1
1
mirror of https://github.com/pterodactyl/panel.git synced 2024-11-25 10:32:31 +01:00

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; background: transparent !important;
} }
.callout code {
background-color: #515f6cbb;
color: #c3c3c3;
border: 1px solid rgba(0, 0, 0, .25);
}
.tab-pane .box-footer { .tab-pane .box-footer {
margin: 0 -10px -10px; 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; color: #9aa5b1 !important;
} }
.text-green {
color: #00a65a !important;
}
.text-muted { .text-muted {
color: #9aa5b1 !important; color: #9aa5b1 !important;
} }
.text-danger {
color: #ff1c00;
}
.content-wrapper { .content-wrapper {
background-color: #33404d; background-color: #33404d;
} }
@ -662,7 +676,7 @@ a {
input.form-control { input.form-control {
padding: .75rem; padding: .75rem;
background-color: #515f6c; background-color: #515f6cbb;
border-width: 1px; border-width: 1px;
border-color: #606d7b; border-color: #606d7b;
border-radius: .25rem; border-radius: .25rem;
@ -674,7 +688,7 @@ input.form-control {
textarea.form-control { textarea.form-control {
padding: .75rem; padding: .75rem;
background-color: #515f6c; background-color: #515f6cbb;
border-width: 1px; border-width: 1px;
border-color: #606d7b; border-color: #606d7b;
border-radius: .25rem; border-radius: .25rem;
@ -686,7 +700,7 @@ textarea.form-control {
.input-group .input-group-addon { .input-group .input-group-addon {
border-color: #606d7b; border-color: #606d7b;
background-color: #515f6c; background-color: #515f6cbb;
color: #cad1d8; color: #cad1d8;
} }
@ -695,7 +709,7 @@ textarea.form-control {
} }
.select2-container--default .select2-selection--single { .select2-container--default .select2-selection--single {
background-color: #515f6c; background-color: #515f6cbb;
} }
.select2-container--default .select2-selection--single .select2-selection__rendered { .select2-container--default .select2-selection--single .select2-selection__rendered {
@ -703,16 +717,17 @@ textarea.form-control {
} }
.select2-container--default .select2-selection--multiple { .select2-container--default .select2-selection--multiple {
background-color: #515f6c; background-color: #515f6cbb;
} }
.select2-container--default .select2-selection--multiple { .select2-container--default .select2-selection--multiple {
border: 1px solid #606d7b; border: 1px solid #606d7b;
border-radius: 0; border-radius: 0;
} }
code { code {
background-color: #515f6c; background-color: #515f6cbb;
color: #999; color: #c3c3c3;
border: 1px solid rgba(0, 0, 0, .25); border: 1px solid rgba(0, 0, 0, .25);
} }
@ -760,12 +775,12 @@ code {
} }
.select2-dropdown { .select2-dropdown {
background-color: #515f6c; background-color: #515f6cbb;
border: 1px solid #606d7b; border: 1px solid #606d7b;
} }
.select2-container--default.select2-container--focus .select2-selection--multiple, .select2-container--default .select2-search--dropdown .select2-search__field { .select2-container--default.select2-container--focus .select2-selection--multiple, .select2-container--default .select2-search--dropdown .select2-search__field {
border-color: #d2d6de !important; border-color: #d2d6de !important;
background-color: #515f6c; background-color: #515f6cbb;
} }
.select2-container--default .select2-results__option--highlighted[aria-selected] { .select2-container--default .select2-results__option--highlighted[aria-selected] {
@ -773,14 +788,38 @@ code {
} }
a { a {
color: #099aa5; color: #288afb;
} }
a:hover { a:hover {
color: #0967d3; color: #206ec7;
} }
.form-control { .form-control {
border-color: #606d7b; 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'}> <div className={'grey-box justify-center'}>
<Can action={'control.start'}> <Can action={'control.start'}>
<button <button
className={'btn btn-secondary btn-xs mr-2'} className={'btn btn-secondary btn-green btn-xs mr-2'}
disabled={status !== 'offline'} disabled={status !== 'offline'}
onClick={e => { onClick={e => {
e.preventDefault(); e.preventDefault();
@ -139,7 +139,7 @@ export default () => {
</Can> </Can>
<Can action={'control.restart'}> <Can action={'control.restart'}>
<button <button
className={'btn btn-secondary btn-xs mr-2'} className={'btn btn-secondary btn-primary btn-xs mr-2'}
onClick={e => { onClick={e => {
e.preventDefault(); e.preventDefault();
sendPowerCommand('restart'); 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%"/> <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">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> <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"> <div class="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> <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> </div>
</div> </div>

View File

@ -58,7 +58,7 @@
<td>{{ $user->username }}</td> <td>{{ $user->username }}</td>
<td class="text-center"> <td class="text-center">
@if($user->use_totp) @if($user->use_totp)
<i class="fa fa-lock text-green-500"></i> <i class="fa fa-lock text-green"></i>
@else @else
<i class="fa fa-unlock text-red"></i> <i class="fa fa-unlock text-red"></i>
@endif @endif