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
This commit is contained in:
AreYouScared 2020-04-19 08:30:52 -04:00
parent 00b0d30c60
commit c54cbe6638
4 changed files with 57 additions and 18 deletions

View file

@ -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;
}

View file

@ -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');

View file

@ -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>

View file

@ -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