From c54cbe6638ff780941569fe95960dbc77fc8e4e3 Mon Sep 17 00:00:00 2001
From: AreYouScared <sir3lit@gmail.com>
Date: Sun, 19 Apr 2020 08:30:52 -0400
Subject: [PATCH] Update Admin CSS / Few css fixes

Changed `code` color to be a little lighter, more contrast / easier to read (From #999 to #c3c3c3)
Added Readonly style, was white box with grey letters. Changes to Dark grey box and white letters.
Changed cursor for disabled / read-only to `not-allowed` instead of `text`
Closes #1918 -> Dropdown text was grey with a grey background.
Added Green and Yellow Text colors
Added Text-Danger
Changed Link color, to be a tad lighter
Added well/well-sm/well-lg to pterodactyl.css
Changed well to match the dark theme.
Hovering over Start / Restart show respective colors Green / Blue
---
 public/themes/pterodactyl/css/pterodactyl.css | 65 +++++++++++++++----
 .../components/server/ServerConsole.tsx       |  4 +-
 resources/views/admin/packs/new.blade.php     |  4 +-
 resources/views/admin/users/index.blade.php   |  2 +-
 4 files changed, 57 insertions(+), 18 deletions(-)

diff --git a/public/themes/pterodactyl/css/pterodactyl.css b/public/themes/pterodactyl/css/pterodactyl.css
index 2bf65ab04..b016ee4ed 100644
--- a/public/themes/pterodactyl/css/pterodactyl.css
+++ b/public/themes/pterodactyl/css/pterodactyl.css
@@ -331,6 +331,12 @@ span[aria-labelledby="select2-pUserId-container"] {
     background: transparent !important;
 }
 
+.callout code {
+    background-color: #515f6cbb;
+    color: #c3c3c3;
+    border: 1px solid rgba(0, 0, 0, .25);
+}
+
 .tab-pane .box-footer {
     margin: 0 -10px -10px;
 }
@@ -485,7 +491,7 @@ label.control-label > span.field-optional:before {
 
 /* *******
 
-  > Version v0.8
+  > Version v1.0
 
 ******* */
 
@@ -546,10 +552,18 @@ body {
     color: #9aa5b1 !important;
 }
 
+.text-green {
+    color: #00a65a !important;
+}
+
 .text-muted {
     color: #9aa5b1 !important;
 }
 
+.text-danger {
+    color: #ff1c00;
+}
+
 .content-wrapper {
     background-color: #33404d;
 }
@@ -662,7 +676,7 @@ a {
 
 input.form-control {
     padding: .75rem;
-    background-color: #515f6c;
+    background-color: #515f6cbb;
     border-width: 1px;
     border-color: #606d7b;
     border-radius: .25rem;
@@ -674,7 +688,7 @@ input.form-control {
 
 textarea.form-control {
     padding: .75rem;
-    background-color: #515f6c;
+    background-color: #515f6cbb;
     border-width: 1px;
     border-color: #606d7b;
     border-radius: .25rem;
@@ -686,7 +700,7 @@ textarea.form-control {
 
 .input-group .input-group-addon {
     border-color: #606d7b;
-    background-color: #515f6c;
+    background-color: #515f6cbb;
     color: #cad1d8;
 }
 
@@ -695,7 +709,7 @@ textarea.form-control {
 }
 
 .select2-container--default .select2-selection--single {
-    background-color: #515f6c;
+    background-color: #515f6cbb;
 }
 
 .select2-container--default .select2-selection--single .select2-selection__rendered {
@@ -703,16 +717,17 @@ textarea.form-control {
 }
 
 .select2-container--default .select2-selection--multiple {
-    background-color: #515f6c;
+    background-color: #515f6cbb;
 }
 
 .select2-container--default .select2-selection--multiple {
     border: 1px solid #606d7b;
     border-radius: 0;
 }
+
 code {
-    background-color: #515f6c;
-    color: #999;
+    background-color: #515f6cbb;
+    color: #c3c3c3;
     border: 1px solid rgba(0, 0, 0, .25);
 }
 
@@ -760,12 +775,12 @@ code {
 }
 
 .select2-dropdown {
-    background-color: #515f6c;
+    background-color: #515f6cbb;
     border: 1px solid #606d7b;
 }
 .select2-container--default.select2-container--focus .select2-selection--multiple, .select2-container--default .select2-search--dropdown .select2-search__field {
     border-color: #d2d6de !important;
-    background-color: #515f6c;
+    background-color: #515f6cbb;
 }
 
 .select2-container--default .select2-results__option--highlighted[aria-selected] {
@@ -773,14 +788,38 @@ code {
 }
 
 a {
-    color: #099aa5;
+    color: #288afb;
 }
 
 a:hover {
-    color: #0967d3;
+    color: #206ec7;
 }
 
 .form-control {
     border-color: #606d7b;
-    background-color: #515f6c;
+    background-color: #515f6cbb;
+    color: #cad1d8;
+}
+
+.form-control[disabled], .form-control[readonly],
+fieldset[disabled] .form-control {
+    background-color: #1f2933;
+    color: #cad1d8;
+    cursor: not-allowed;
+}
+
+.well {
+    min-height: 20px;
+    padding: 19px;
+    margin-bottom: 20px;
+    background-color: #515f6cbb;
+    border: 1px solid #606d7b;
+}
+
+.well-lg {
+    padding: 24px;
+}
+
+.well-sm {
+    padding: 9px;
 }
diff --git a/resources/scripts/components/server/ServerConsole.tsx b/resources/scripts/components/server/ServerConsole.tsx
index b808f8ef1..0e2883cc5 100644
--- a/resources/scripts/components/server/ServerConsole.tsx
+++ b/resources/scripts/components/server/ServerConsole.tsx
@@ -127,7 +127,7 @@ export default () => {
                     <div className={'grey-box justify-center'}>
                         <Can action={'control.start'}>
                             <button
-                                className={'btn btn-secondary btn-xs mr-2'}
+                                className={'btn btn-secondary btn-green btn-xs mr-2'}
                                 disabled={status !== 'offline'}
                                 onClick={e => {
                                     e.preventDefault();
@@ -139,7 +139,7 @@ export default () => {
                         </Can>
                         <Can action={'control.restart'}>
                             <button
-                                className={'btn btn-secondary btn-xs mr-2'}
+                                className={'btn btn-secondary btn-primary btn-xs mr-2'}
                                 onClick={e => {
                                     e.preventDefault();
                                     sendPowerCommand('restart');
diff --git a/resources/views/admin/packs/new.blade.php b/resources/views/admin/packs/new.blade.php
index 5778555aa..8cff53c14 100644
--- a/resources/views/admin/packs/new.blade.php
+++ b/resources/views/admin/packs/new.blade.php
@@ -106,8 +106,8 @@
                         <input type="file" accept=".tar.gz, application/gzip" name="file_upload" class="well well-sm" style="width:100%"/>
                         <p class="text-muted small">This package file must be a <code>.tar.gz</code> archive of pack files to be decompressed into the server folder.</p>
                         <p class="text-muted small">If your file is larger than <code>50MB</code> it is recommended to upload it using SFTP. Once you have added this pack to the system, a path will be provided where you should upload the file.</p>
-                        <div class="callout callout-info callout-slim no-margin-bottom">
-                            <p class="text-muted small"><strong>This server is currently configured with the following limits:</strong><br /><code>upload_max_filesize={{ ini_get('upload_max_filesize') }}</code><br /><code>post_max_size={{ ini_get('post_max_size') }}</code><br /><br />If your file is larger than either of those values this request will fail.</p>
+                        <div class="callout-info callout-slim no-margin-bottom">
+                            <p class="text-muted small"><strong>This node is currently configured with the following limits:</strong><br /><code>upload_max_filesize={{ ini_get('upload_max_filesize') }}</code><br /><code>post_max_size={{ ini_get('post_max_size') }}</code><br /><br />If your file is larger than either of those values this request will fail.</p>
                         </div>
                     </div>
                 </div>
diff --git a/resources/views/admin/users/index.blade.php b/resources/views/admin/users/index.blade.php
index b327ad5f3..2de490d53 100644
--- a/resources/views/admin/users/index.blade.php
+++ b/resources/views/admin/users/index.blade.php
@@ -58,7 +58,7 @@
                                 <td>{{ $user->username }}</td>
                                 <td class="text-center">
                                     @if($user->use_totp)
-                                        <i class="fa fa-lock text-green-500"></i>
+                                        <i class="fa fa-lock text-green"></i>
                                     @else
                                         <i class="fa fa-unlock text-red"></i>
                                     @endif