sebclem/hassio-nextcloud-backup
1
0
Fork 0
mirror of https://github.com/Sebclem/hassio-nextcloud-backup.git synced 2024-11-22 17:22:58 +01:00
Code Issues Projects Releases Wiki Activity

🔨 Convert nextcloud setting modal to bootstrap

Browse Source
This commit is contained in:
Sebastien Clement 2021-01-08 16:54:31 +01:00
parent da37e6ecaf
commit 7d4b796950
10 changed files with 286 additions and 217 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

273
nextcloud_backup/rootfs/opt/nextcloud_backup/public/css/custom_bootstrap.css
View File

@ -572,6 +572,7 @@ progress {
background-color: #222222; background-color: #222222;
border: 1px solid #dee2e6; border: 1px solid #dee2e6;
border-radius: 0.25rem; border-radius: 0.25rem;
box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
max-width: 100%; max-width: 100%;
height: auto; height: auto;
} }
@ -2152,12 +2153,13 @@ progress {
font-size: 1rem; font-size: 1rem;
font-weight: 400; font-weight: 400;
line-height: 1.5; line-height: 1.5;
color: #212529; color: #b58e51;
background-color: #fff; background-color: #343a40;
background-clip: padding-box; background-clip: padding-box;
border: 1px solid #ced4da; border: 1px solid #343a40;
appearance: none; appearance: none;
border-radius: 0.25rem; border-radius: 0.25rem;
box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.075);
transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
} }
@media (prefers-reduced-motion: reduce) { @media (prefers-reduced-motion: reduce) {
@ -2172,11 +2174,11 @@ progress {
cursor: pointer; cursor: pointer;
} }
.form-control:focus { .form-control:focus {
color: #212529; color: #b58e51;
background-color: #fff; background-color: #343a40;
border-color: #86b7fe; border-color: #dac7a8;
outline: 0; outline: 0;
box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25); box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.075), 0 0 0 0.25rem rgba(181, 142, 81, 0.25);
} }
.form-control::-webkit-date-and-time-value { .form-control::-webkit-date-and-time-value {
height: 1.5em; height: 1.5em;
@ -2193,7 +2195,7 @@ progress {
padding: 0.375rem 0.75rem; padding: 0.375rem 0.75rem;
margin: -0.375rem -0.75rem; margin: -0.375rem -0.75rem;
margin-inline-end: 0.75rem; margin-inline-end: 0.75rem;
color: #212529; color: #b58e51;
background-color: #e9ecef; background-color: #e9ecef;
pointer-events: none; pointer-events: none;
border-color: inherit; border-color: inherit;
@ -2215,7 +2217,7 @@ progress {
padding: 0.375rem 0.75rem; padding: 0.375rem 0.75rem;
margin: -0.375rem -0.75rem; margin: -0.375rem -0.75rem;
margin-inline-end: 0.75rem; margin-inline-end: 0.75rem;
color: #212529; color: #b58e51;
background-color: #e9ecef; background-color: #e9ecef;
pointer-events: none; pointer-events: none;
border-color: inherit; border-color: inherit;
@ -2318,21 +2320,22 @@ textarea.form-control-lg {
font-size: 1rem; font-size: 1rem;
font-weight: 400; font-weight: 400;
line-height: 1.5; line-height: 1.5;
color: #212529; color: #b58e51;
vertical-align: middle; vertical-align: middle;
background-color: #fff; background-color: #343a40;
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e"); background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: right 0.75rem center; background-position: right 0.75rem center;
background-size: 16px 12px; background-size: 16px 12px;
border: 1px solid #ced4da; border: 1px solid #343a40;
border-radius: 0.25rem; border-radius: 0.25rem;
box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.075);
appearance: none; appearance: none;
} }
.form-select:focus { .form-select:focus {
border-color: #86b7fe; border-color: #dac7a8;
outline: 0; outline: 0;
box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25); box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.075), 0 0 0 0.25rem rgba(181, 142, 81, 0.25);
} }
.form-select[multiple], .form-select[size]:not([size="1"]) { .form-select[multiple], .form-select[size]:not([size="1"]) {
padding-right: 0.75rem; padding-right: 0.75rem;
@ -2344,7 +2347,7 @@ textarea.form-control-lg {
} }
.form-select:-moz-focusring { .form-select:-moz-focusring {
color: transparent; color: transparent;
text-shadow: 0 0 0 #212529; text-shadow: 0 0 0 #b58e51;
} }
.form-select-sm { .form-select-sm {
@ -2381,7 +2384,7 @@ textarea.form-control-lg {
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: center; background-position: center;
background-size: contain; background-size: contain;
border: 1px solid rgba(0, 0, 0, 0.25); border: 1px solid #b58e51;
appearance: none; appearance: none;
color-adjust: exact; color-adjust: exact;
transition: background-color 0.15s ease-in-out, background-position 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; transition: background-color 0.15s ease-in-out, background-position 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
@ -2401,13 +2404,13 @@ textarea.form-control-lg {
filter: brightness(90%); filter: brightness(90%);
} }
.form-check-input:focus { .form-check-input:focus {
border-color: #86b7fe; border-color: #dac7a8;
outline: 0; outline: 0;
box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25); box-shadow: 0 0 0 0.25rem rgba(181, 142, 81, 0.25);
} }
.form-check-input:checked { .form-check-input:checked {
background-color: #0d6efd; background-color: #b58e51;
border-color: #0d6efd; border-color: #b58e51;
} }
.form-check-input:checked[type=checkbox] { .form-check-input:checked[type=checkbox] {
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e"); background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e");
@ -2416,8 +2419,8 @@ textarea.form-control-lg {
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%23fff'/%3e%3c/svg%3e"); background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%23fff'/%3e%3c/svg%3e");
} }
.form-check-input[type=checkbox]:indeterminate { .form-check-input[type=checkbox]:indeterminate {
background-color: #0d6efd; background-color: #b58e51;
border-color: #0d6efd; border-color: #b58e51;
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10h8'/%3e%3c/svg%3e"); background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10h8'/%3e%3c/svg%3e");
} }
.form-check-input:disabled { .form-check-input:disabled {
@ -2435,12 +2438,12 @@ textarea.form-control-lg {
.form-switch .form-check-input { .form-switch .form-check-input {
width: 2em; width: 2em;
margin-left: -2.5em; margin-left: -2.5em;
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgba%280, 0, 0, 0.25%29'/%3e%3c/svg%3e"); background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23b58e51'/%3e%3c/svg%3e");
background-position: left center; background-position: left center;
border-radius: 2em; border-radius: 2em;
} }
.form-switch .form-check-input:focus { .form-switch .form-check-input:focus {
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%2386b7fe'/%3e%3c/svg%3e"); background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23dac7a8'/%3e%3c/svg%3e");
} }
.form-switch .form-check-input:checked { .form-switch .form-check-input:checked {
background-position: right center; background-position: right center;
@ -2474,10 +2477,10 @@ textarea.form-control-lg {
outline: none; outline: none;
} }
.form-range:focus::-webkit-slider-thumb { .form-range:focus::-webkit-slider-thumb {
box-shadow: 0 0 0 1px #222222, 0 0 0 0.25rem rgba(13, 110, 253, 0.25); box-shadow: 0 0 0 1px #222222, 0 0 0 0.25rem rgba(181, 142, 81, 0.25);
} }
.form-range:focus::-moz-range-thumb { .form-range:focus::-moz-range-thumb {
box-shadow: 0 0 0 1px #222222, 0 0 0 0.25rem rgba(13, 110, 253, 0.25); box-shadow: 0 0 0 1px #222222, 0 0 0 0.25rem rgba(181, 142, 81, 0.25);
} }
.form-range::-moz-focus-outer { .form-range::-moz-focus-outer {
border: 0; border: 0;
@ -2486,9 +2489,10 @@ textarea.form-control-lg {
width: 1rem; width: 1rem;
height: 1rem; height: 1rem;
margin-top: -0.25rem; margin-top: -0.25rem;
background-color: #0d6efd; background-color: #b58e51;
border: 0; border: 0;
border-radius: 1rem; border-radius: 1rem;
box-shadow: 0 0.1rem 0.25rem rgba(0, 0, 0, 0.1);
transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
appearance: none; appearance: none;
} }
@ -2498,7 +2502,7 @@ textarea.form-control-lg {
} }
} }
.form-range::-webkit-slider-thumb:active { .form-range::-webkit-slider-thumb:active {
background-color: #b6d4fe; background-color: #e9ddcb;
} }
.form-range::-webkit-slider-runnable-track { .form-range::-webkit-slider-runnable-track {
width: 100%; width: 100%;
@ -2508,13 +2512,15 @@ textarea.form-control-lg {
background-color: #dee2e6; background-color: #dee2e6;
border-color: transparent; border-color: transparent;
border-radius: 1rem; border-radius: 1rem;
box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.075);
} }
.form-range::-moz-range-thumb { .form-range::-moz-range-thumb {
width: 1rem; width: 1rem;
height: 1rem; height: 1rem;
background-color: #0d6efd; background-color: #b58e51;
border: 0; border: 0;
border-radius: 1rem; border-radius: 1rem;
box-shadow: 0 0.1rem 0.25rem rgba(0, 0, 0, 0.1);
transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
appearance: none; appearance: none;
} }
@ -2524,7 +2530,7 @@ textarea.form-control-lg {
} }
} }
.form-range::-moz-range-thumb:active { .form-range::-moz-range-thumb:active {
background-color: #b6d4fe; background-color: #e9ddcb;
} }
.form-range::-moz-range-track { .form-range::-moz-range-track {
width: 100%; width: 100%;
@ -2534,6 +2540,7 @@ textarea.form-control-lg {
background-color: #dee2e6; background-color: #dee2e6;
border-color: transparent; border-color: transparent;
border-radius: 1rem; border-radius: 1rem;
box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.075);
} }
.form-range:disabled { .form-range:disabled {
pointer-events: none; pointer-events: none;
@ -2628,11 +2635,11 @@ textarea.form-control-lg {
font-size: 1rem; font-size: 1rem;
font-weight: 400; font-weight: 400;
line-height: 1.5; line-height: 1.5;
color: #212529; color: #b58e51;
text-align: center; text-align: center;
white-space: nowrap; white-space: nowrap;
background-color: #e9ecef; background-color: #e9ecef;
border: 1px solid #ced4da; border: 1px solid #343a40;
border-radius: 0.25rem; border-radius: 0.25rem;
} }
@ -2854,17 +2861,25 @@ textarea.form-control-lg {
} }
.btn-check:focus + .btn, .btn:focus { .btn-check:focus + .btn, .btn:focus {
outline: 0; outline: 0;
box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25); box-shadow: 0 0 0 0.25rem rgba(181, 142, 81, 0.25);
}
.btn-check:checked + .btn, .btn-check:active + .btn, .btn:active, .btn.active {
box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
}
.btn-check:checked + .btn:focus, .btn-check:active + .btn:focus, .btn:active:focus, .btn.active:focus {
box-shadow: 0 0 0 0.25rem rgba(181, 142, 81, 0.25), inset 0 3px 5px rgba(0, 0, 0, 0.125);
} }
.btn:disabled, .btn.disabled, fieldset:disabled .btn { .btn:disabled, .btn.disabled, fieldset:disabled .btn {
pointer-events: none; pointer-events: none;
opacity: 0.65; opacity: 0.65;
box-shadow: none;
} }
.btn-primary { .btn-primary {
color: #fff; color: #fff;
background-color: #0d6efd; background-color: #0d6efd;
border-color: #0d6efd; border-color: #0d6efd;
box-shadow: none;
} }
.btn-primary:hover { .btn-primary:hover {
color: #fff; color: #fff;
@ -2875,7 +2890,7 @@ textarea.form-control-lg {
color: #fff; color: #fff;
background-color: #0b5ed7; background-color: #0b5ed7;
border-color: #0a58ca; border-color: #0a58ca;
box-shadow: 0 0 0 0.25rem rgba(49, 132, 253, 0.5); box-shadow: none, 0 0 0 0.25rem rgba(49, 132, 253, 0.5);
} }
.btn-check:checked + .btn-primary, .btn-check:active + .btn-primary, .btn-primary:active, .btn-primary.active, .show > .btn-primary.dropdown-toggle { .btn-check:checked + .btn-primary, .btn-check:active + .btn-primary, .btn-primary:active, .btn-primary.active, .show > .btn-primary.dropdown-toggle {
color: #fff; color: #fff;
@ -2883,7 +2898,7 @@ textarea.form-control-lg {
border-color: #0a53be; border-color: #0a53be;
} }
.btn-check:checked + .btn-primary:focus, .btn-check:active + .btn-primary:focus, .btn-primary:active:focus, .btn-primary.active:focus, .show > .btn-primary.dropdown-toggle:focus { .btn-check:checked + .btn-primary:focus, .btn-check:active + .btn-primary:focus, .btn-primary:active:focus, .btn-primary.active:focus, .show > .btn-primary.dropdown-toggle:focus {
box-shadow: 0 0 0 0.25rem rgba(49, 132, 253, 0.5); box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125), 0 0 0 0.25rem rgba(49, 132, 253, 0.5);
} }
.btn-primary:disabled, .btn-primary.disabled { .btn-primary:disabled, .btn-primary.disabled {
color: #fff; color: #fff;
@ -2895,6 +2910,7 @@ textarea.form-control-lg {
color: #fff; color: #fff;
background-color: #343a40; background-color: #343a40;
border-color: #343a40; border-color: #343a40;
box-shadow: none;
} }
.btn-secondary:hover { .btn-secondary:hover {
color: #fff; color: #fff;
@ -2905,7 +2921,7 @@ textarea.form-control-lg {
color: #fff; color: #fff;
background-color: #2c3136; background-color: #2c3136;
border-color: #2a2e33; border-color: #2a2e33;
box-shadow: 0 0 0 0.25rem rgba(82, 88, 93, 0.5); box-shadow: none, 0 0 0 0.25rem rgba(82, 88, 93, 0.5);
} }
.btn-check:checked + .btn-secondary, .btn-check:active + .btn-secondary, .btn-secondary:active, .btn-secondary.active, .show > .btn-secondary.dropdown-toggle { .btn-check:checked + .btn-secondary, .btn-check:active + .btn-secondary, .btn-secondary:active, .btn-secondary.active, .show > .btn-secondary.dropdown-toggle {
color: #fff; color: #fff;
@ -2913,7 +2929,7 @@ textarea.form-control-lg {
border-color: #272c30; border-color: #272c30;
} }
.btn-check:checked + .btn-secondary:focus, .btn-check:active + .btn-secondary:focus, .btn-secondary:active:focus, .btn-secondary.active:focus, .show > .btn-secondary.dropdown-toggle:focus { .btn-check:checked + .btn-secondary:focus, .btn-check:active + .btn-secondary:focus, .btn-secondary:active:focus, .btn-secondary.active:focus, .show > .btn-secondary.dropdown-toggle:focus {
box-shadow: 0 0 0 0.25rem rgba(82, 88, 93, 0.5); box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125), 0 0 0 0.25rem rgba(82, 88, 93, 0.5);
} }
.btn-secondary:disabled, .btn-secondary.disabled { .btn-secondary:disabled, .btn-secondary.disabled {
color: #fff; color: #fff;
@ -2925,6 +2941,7 @@ textarea.form-control-lg {
color: #fff; color: #fff;
background-color: #198754; background-color: #198754;
border-color: #198754; border-color: #198754;
box-shadow: none;
} }
.btn-success:hover { .btn-success:hover {
color: #fff; color: #fff;
@ -2935,7 +2952,7 @@ textarea.form-control-lg {
color: #fff; color: #fff;
background-color: #157347; background-color: #157347;
border-color: #146c43; border-color: #146c43;
box-shadow: 0 0 0 0.25rem rgba(60, 153, 110, 0.5); box-shadow: none, 0 0 0 0.25rem rgba(60, 153, 110, 0.5);
} }
.btn-check:checked + .btn-success, .btn-check:active + .btn-success, .btn-success:active, .btn-success.active, .show > .btn-success.dropdown-toggle { .btn-check:checked + .btn-success, .btn-check:active + .btn-success, .btn-success:active, .btn-success.active, .show > .btn-success.dropdown-toggle {
color: #fff; color: #fff;
@ -2943,7 +2960,7 @@ textarea.form-control-lg {
border-color: #13653f; border-color: #13653f;
} }
.btn-check:checked + .btn-success:focus, .btn-check:active + .btn-success:focus, .btn-success:active:focus, .btn-success.active:focus, .show > .btn-success.dropdown-toggle:focus { .btn-check:checked + .btn-success:focus, .btn-check:active + .btn-success:focus, .btn-success:active:focus, .btn-success.active:focus, .show > .btn-success.dropdown-toggle:focus {
box-shadow: 0 0 0 0.25rem rgba(60, 153, 110, 0.5); box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125), 0 0 0 0.25rem rgba(60, 153, 110, 0.5);
} }
.btn-success:disabled, .btn-success.disabled { .btn-success:disabled, .btn-success.disabled {
color: #fff; color: #fff;
@ -2955,6 +2972,7 @@ textarea.form-control-lg {
color: #000; color: #000;
background-color: #0dcaf0; background-color: #0dcaf0;
border-color: #0dcaf0; border-color: #0dcaf0;
box-shadow: none;
} }
.btn-info:hover { .btn-info:hover {
color: #000; color: #000;
@ -2965,7 +2983,7 @@ textarea.form-control-lg {
color: #000; color: #000;
background-color: #31d2f2; background-color: #31d2f2;
border-color: #25cff2; border-color: #25cff2;
box-shadow: 0 0 0 0.25rem rgba(11, 172, 204, 0.5); box-shadow: none, 0 0 0 0.25rem rgba(11, 172, 204, 0.5);
} }
.btn-check:checked + .btn-info, .btn-check:active + .btn-info, .btn-info:active, .btn-info.active, .show > .btn-info.dropdown-toggle { .btn-check:checked + .btn-info, .btn-check:active + .btn-info, .btn-info:active, .btn-info.active, .show > .btn-info.dropdown-toggle {
color: #000; color: #000;
@ -2973,7 +2991,7 @@ textarea.form-control-lg {
border-color: #25cff2; border-color: #25cff2;
} }
.btn-check:checked + .btn-info:focus, .btn-check:active + .btn-info:focus, .btn-info:active:focus, .btn-info.active:focus, .show > .btn-info.dropdown-toggle:focus { .btn-check:checked + .btn-info:focus, .btn-check:active + .btn-info:focus, .btn-info:active:focus, .btn-info.active:focus, .show > .btn-info.dropdown-toggle:focus {
box-shadow: 0 0 0 0.25rem rgba(11, 172, 204, 0.5); box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125), 0 0 0 0.25rem rgba(11, 172, 204, 0.5);
} }
.btn-info:disabled, .btn-info.disabled { .btn-info:disabled, .btn-info.disabled {
color: #000; color: #000;
@ -2985,6 +3003,7 @@ textarea.form-control-lg {
color: #000; color: #000;
background-color: #ffc107; background-color: #ffc107;
border-color: #ffc107; border-color: #ffc107;
box-shadow: none;
} }
.btn-warning:hover { .btn-warning:hover {
color: #000; color: #000;
@ -2995,7 +3014,7 @@ textarea.form-control-lg {
color: #000; color: #000;
background-color: #ffca2c; background-color: #ffca2c;
border-color: #ffc720; border-color: #ffc720;
box-shadow: 0 0 0 0.25rem rgba(217, 164, 6, 0.5); box-shadow: none, 0 0 0 0.25rem rgba(217, 164, 6, 0.5);
} }
.btn-check:checked + .btn-warning, .btn-check:active + .btn-warning, .btn-warning:active, .btn-warning.active, .show > .btn-warning.dropdown-toggle { .btn-check:checked + .btn-warning, .btn-check:active + .btn-warning, .btn-warning:active, .btn-warning.active, .show > .btn-warning.dropdown-toggle {
color: #000; color: #000;
@ -3003,7 +3022,7 @@ textarea.form-control-lg {
border-color: #ffc720; border-color: #ffc720;
} }
.btn-check:checked + .btn-warning:focus, .btn-check:active + .btn-warning:focus, .btn-warning:active:focus, .btn-warning.active:focus, .show > .btn-warning.dropdown-toggle:focus { .btn-check:checked + .btn-warning:focus, .btn-check:active + .btn-warning:focus, .btn-warning:active:focus, .btn-warning.active:focus, .show > .btn-warning.dropdown-toggle:focus {
box-shadow: 0 0 0 0.25rem rgba(217, 164, 6, 0.5); box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125), 0 0 0 0.25rem rgba(217, 164, 6, 0.5);
} }
.btn-warning:disabled, .btn-warning.disabled { .btn-warning:disabled, .btn-warning.disabled {
color: #000; color: #000;
@ -3015,6 +3034,7 @@ textarea.form-control-lg {
color: #fff; color: #fff;
background-color: #dc3545; background-color: #dc3545;
border-color: #dc3545; border-color: #dc3545;
box-shadow: none;
} }
.btn-danger:hover { .btn-danger:hover {
color: #fff; color: #fff;
@ -3025,7 +3045,7 @@ textarea.form-control-lg {
color: #fff; color: #fff;
background-color: #bb2d3b; background-color: #bb2d3b;
border-color: #b02a37; border-color: #b02a37;
box-shadow: 0 0 0 0.25rem rgba(225, 83, 97, 0.5); box-shadow: none, 0 0 0 0.25rem rgba(225, 83, 97, 0.5);
} }
.btn-check:checked + .btn-danger, .btn-check:active + .btn-danger, .btn-danger:active, .btn-danger.active, .show > .btn-danger.dropdown-toggle { .btn-check:checked + .btn-danger, .btn-check:active + .btn-danger, .btn-danger:active, .btn-danger.active, .show > .btn-danger.dropdown-toggle {
color: #fff; color: #fff;
@ -3033,7 +3053,7 @@ textarea.form-control-lg {
border-color: #a52834; border-color: #a52834;
} }
.btn-check:checked + .btn-danger:focus, .btn-check:active + .btn-danger:focus, .btn-danger:active:focus, .btn-danger.active:focus, .show > .btn-danger.dropdown-toggle:focus { .btn-check:checked + .btn-danger:focus, .btn-check:active + .btn-danger:focus, .btn-danger:active:focus, .btn-danger.active:focus, .show > .btn-danger.dropdown-toggle:focus {
box-shadow: 0 0 0 0.25rem rgba(225, 83, 97, 0.5); box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125), 0 0 0 0.25rem rgba(225, 83, 97, 0.5);
} }
.btn-danger:disabled, .btn-danger.disabled { .btn-danger:disabled, .btn-danger.disabled {
color: #fff; color: #fff;
@ -3045,6 +3065,7 @@ textarea.form-control-lg {
color: #000; color: #000;
background-color: #f8f9fa; background-color: #f8f9fa;
border-color: #f8f9fa; border-color: #f8f9fa;
box-shadow: none;
} }
.btn-light:hover { .btn-light:hover {
color: #000; color: #000;
@ -3055,7 +3076,7 @@ textarea.form-control-lg {
color: #000; color: #000;
background-color: #f9fafb; background-color: #f9fafb;
border-color: #f9fafb; border-color: #f9fafb;
box-shadow: 0 0 0 0.25rem rgba(211, 212, 213, 0.5); box-shadow: none, 0 0 0 0.25rem rgba(211, 212, 213, 0.5);
} }
.btn-check:checked + .btn-light, .btn-check:active + .btn-light, .btn-light:active, .btn-light.active, .show > .btn-light.dropdown-toggle { .btn-check:checked + .btn-light, .btn-check:active + .btn-light, .btn-light:active, .btn-light.active, .show > .btn-light.dropdown-toggle {
color: #000; color: #000;
@ -3063,7 +3084,7 @@ textarea.form-control-lg {
border-color: #f9fafb; border-color: #f9fafb;
} }
.btn-check:checked + .btn-light:focus, .btn-check:active + .btn-light:focus, .btn-light:active:focus, .btn-light.active:focus, .show > .btn-light.dropdown-toggle:focus { .btn-check:checked + .btn-light:focus, .btn-check:active + .btn-light:focus, .btn-light:active:focus, .btn-light.active:focus, .show > .btn-light.dropdown-toggle:focus {
box-shadow: 0 0 0 0.25rem rgba(211, 212, 213, 0.5); box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125), 0 0 0 0.25rem rgba(211, 212, 213, 0.5);
} }
.btn-light:disabled, .btn-light.disabled { .btn-light:disabled, .btn-light.disabled {
color: #000; color: #000;
@ -3075,6 +3096,7 @@ textarea.form-control-lg {
color: #fff; color: #fff;
background-color: #292929; background-color: #292929;
border-color: #292929; border-color: #292929;
box-shadow: none;
} }
.btn-dark:hover { .btn-dark:hover {
color: #fff; color: #fff;
@ -3085,7 +3107,7 @@ textarea.form-control-lg {
color: #fff; color: #fff;
background-color: #232323; background-color: #232323;
border-color: #212121; border-color: #212121;
box-shadow: 0 0 0 0.25rem rgba(73, 73, 73, 0.5); box-shadow: none, 0 0 0 0.25rem rgba(73, 73, 73, 0.5);
} }
.btn-check:checked + .btn-dark, .btn-check:active + .btn-dark, .btn-dark:active, .btn-dark.active, .show > .btn-dark.dropdown-toggle { .btn-check:checked + .btn-dark, .btn-check:active + .btn-dark, .btn-dark:active, .btn-dark.active, .show > .btn-dark.dropdown-toggle {
color: #fff; color: #fff;
@ -3093,7 +3115,7 @@ textarea.form-control-lg {
border-color: #1f1f1f; border-color: #1f1f1f;
} }
.btn-check:checked + .btn-dark:focus, .btn-check:active + .btn-dark:focus, .btn-dark:active:focus, .btn-dark.active:focus, .show > .btn-dark.dropdown-toggle:focus { .btn-check:checked + .btn-dark:focus, .btn-check:active + .btn-dark:focus, .btn-dark:active:focus, .btn-dark.active:focus, .show > .btn-dark.dropdown-toggle:focus {
box-shadow: 0 0 0 0.25rem rgba(73, 73, 73, 0.5); box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125), 0 0 0 0.25rem rgba(73, 73, 73, 0.5);
} }
.btn-dark:disabled, .btn-dark.disabled { .btn-dark:disabled, .btn-dark.disabled {
color: #fff; color: #fff;
@ -3119,7 +3141,7 @@ textarea.form-control-lg {
border-color: #0d6efd; border-color: #0d6efd;
} }
.btn-check:checked + .btn-outline-primary:focus, .btn-check:active + .btn-outline-primary:focus, .btn-outline-primary:active:focus, .btn-outline-primary.active:focus, .btn-outline-primary.dropdown-toggle.show:focus { .btn-check:checked + .btn-outline-primary:focus, .btn-check:active + .btn-outline-primary:focus, .btn-outline-primary:active:focus, .btn-outline-primary.active:focus, .btn-outline-primary.dropdown-toggle.show:focus {
box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.5); box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125), 0 0 0 0.25rem rgba(13, 110, 253, 0.5);
} }
.btn-outline-primary:disabled, .btn-outline-primary.disabled { .btn-outline-primary:disabled, .btn-outline-primary.disabled {
color: #0d6efd; color: #0d6efd;
@ -3144,7 +3166,7 @@ textarea.form-control-lg {
border-color: #343a40; border-color: #343a40;
} }
.btn-check:checked + .btn-outline-secondary:focus, .btn-check:active + .btn-outline-secondary:focus, .btn-outline-secondary:active:focus, .btn-outline-secondary.active:focus, .btn-outline-secondary.dropdown-toggle.show:focus { .btn-check:checked + .btn-outline-secondary:focus, .btn-check:active + .btn-outline-secondary:focus, .btn-outline-secondary:active:focus, .btn-outline-secondary.active:focus, .btn-outline-secondary.dropdown-toggle.show:focus {
box-shadow: 0 0 0 0.25rem rgba(52, 58, 64, 0.5); box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125), 0 0 0 0.25rem rgba(52, 58, 64, 0.5);
} }
.btn-outline-secondary:disabled, .btn-outline-secondary.disabled { .btn-outline-secondary:disabled, .btn-outline-secondary.disabled {
color: #343a40; color: #343a40;
@ -3169,7 +3191,7 @@ textarea.form-control-lg {
border-color: #198754; border-color: #198754;
} }
.btn-check:checked + .btn-outline-success:focus, .btn-check:active + .btn-outline-success:focus, .btn-outline-success:active:focus, .btn-outline-success.active:focus, .btn-outline-success.dropdown-toggle.show:focus { .btn-check:checked + .btn-outline-success:focus, .btn-check:active + .btn-outline-success:focus, .btn-outline-success:active:focus, .btn-outline-success.active:focus, .btn-outline-success.dropdown-toggle.show:focus {
box-shadow: 0 0 0 0.25rem rgba(25, 135, 84, 0.5); box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125), 0 0 0 0.25rem rgba(25, 135, 84, 0.5);
} }
.btn-outline-success:disabled, .btn-outline-success.disabled { .btn-outline-success:disabled, .btn-outline-success.disabled {
color: #198754; color: #198754;
@ -3194,7 +3216,7 @@ textarea.form-control-lg {
border-color: #0dcaf0; border-color: #0dcaf0;
} }
.btn-check:checked + .btn-outline-info:focus, .btn-check:active + .btn-outline-info:focus, .btn-outline-info:active:focus, .btn-outline-info.active:focus, .btn-outline-info.dropdown-toggle.show:focus { .btn-check:checked + .btn-outline-info:focus, .btn-check:active + .btn-outline-info:focus, .btn-outline-info:active:focus, .btn-outline-info.active:focus, .btn-outline-info.dropdown-toggle.show:focus {
box-shadow: 0 0 0 0.25rem rgba(13, 202, 240, 0.5); box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125), 0 0 0 0.25rem rgba(13, 202, 240, 0.5);
} }
.btn-outline-info:disabled, .btn-outline-info.disabled { .btn-outline-info:disabled, .btn-outline-info.disabled {
color: #0dcaf0; color: #0dcaf0;
@ -3219,7 +3241,7 @@ textarea.form-control-lg {
border-color: #ffc107; border-color: #ffc107;
} }
.btn-check:checked + .btn-outline-warning:focus, .btn-check:active + .btn-outline-warning:focus, .btn-outline-warning:active:focus, .btn-outline-warning.active:focus, .btn-outline-warning.dropdown-toggle.show:focus { .btn-check:checked + .btn-outline-warning:focus, .btn-check:active + .btn-outline-warning:focus, .btn-outline-warning:active:focus, .btn-outline-warning.active:focus, .btn-outline-warning.dropdown-toggle.show:focus {
box-shadow: 0 0 0 0.25rem rgba(255, 193, 7, 0.5); box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125), 0 0 0 0.25rem rgba(255, 193, 7, 0.5);
} }
.btn-outline-warning:disabled, .btn-outline-warning.disabled { .btn-outline-warning:disabled, .btn-outline-warning.disabled {
color: #ffc107; color: #ffc107;
@ -3244,7 +3266,7 @@ textarea.form-control-lg {
border-color: #dc3545; border-color: #dc3545;
} }
.btn-check:checked + .btn-outline-danger:focus, .btn-check:active + .btn-outline-danger:focus, .btn-outline-danger:active:focus, .btn-outline-danger.active:focus, .btn-outline-danger.dropdown-toggle.show:focus { .btn-check:checked + .btn-outline-danger:focus, .btn-check:active + .btn-outline-danger:focus, .btn-outline-danger:active:focus, .btn-outline-danger.active:focus, .btn-outline-danger.dropdown-toggle.show:focus {
box-shadow: 0 0 0 0.25rem rgba(220, 53, 69, 0.5); box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125), 0 0 0 0.25rem rgba(220, 53, 69, 0.5);
} }
.btn-outline-danger:disabled, .btn-outline-danger.disabled { .btn-outline-danger:disabled, .btn-outline-danger.disabled {
color: #dc3545; color: #dc3545;
@ -3269,7 +3291,7 @@ textarea.form-control-lg {
border-color: #f8f9fa; border-color: #f8f9fa;
} }
.btn-check:checked + .btn-outline-light:focus, .btn-check:active + .btn-outline-light:focus, .btn-outline-light:active:focus, .btn-outline-light.active:focus, .btn-outline-light.dropdown-toggle.show:focus { .btn-check:checked + .btn-outline-light:focus, .btn-check:active + .btn-outline-light:focus, .btn-outline-light:active:focus, .btn-outline-light.active:focus, .btn-outline-light.dropdown-toggle.show:focus {
box-shadow: 0 0 0 0.25rem rgba(248, 249, 250, 0.5); box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125), 0 0 0 0.25rem rgba(248, 249, 250, 0.5);
} }
.btn-outline-light:disabled, .btn-outline-light.disabled { .btn-outline-light:disabled, .btn-outline-light.disabled {
color: #f8f9fa; color: #f8f9fa;
@ -3294,7 +3316,7 @@ textarea.form-control-lg {
border-color: #292929; border-color: #292929;
} }
.btn-check:checked + .btn-outline-dark:focus, .btn-check:active + .btn-outline-dark:focus, .btn-outline-dark:active:focus, .btn-outline-dark.active:focus, .btn-outline-dark.dropdown-toggle.show:focus { .btn-check:checked + .btn-outline-dark:focus, .btn-check:active + .btn-outline-dark:focus, .btn-outline-dark:active:focus, .btn-outline-dark.active:focus, .btn-outline-dark.dropdown-toggle.show:focus {
box-shadow: 0 0 0 0.25rem rgba(41, 41, 41, 0.5); box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125), 0 0 0 0.25rem rgba(41, 41, 41, 0.5);
} }
.btn-outline-dark:disabled, .btn-outline-dark.disabled { .btn-outline-dark:disabled, .btn-outline-dark.disabled {
color: #292929; color: #292929;
@ -3393,6 +3415,7 @@ textarea.form-control-lg {
background-clip: padding-box; background-clip: padding-box;
border: 1px solid rgba(0, 0, 0, 0.15); border: 1px solid rgba(0, 0, 0, 0.15);
border-radius: 0.25rem; border-radius: 0.25rem;
box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
} }
.dropdown-menu[style] { .dropdown-menu[style] {
right: auto !important; right: auto !important;
@ -3578,7 +3601,7 @@ textarea.form-control-lg {
.dropdown-item.active, .dropdown-item:active { .dropdown-item.active, .dropdown-item:active {
color: #fff; color: #fff;
text-decoration: none; text-decoration: none;
background-color: #0d6efd; background-color: #b58e51;
} }
.dropdown-item.disabled, .dropdown-item:disabled { .dropdown-item.disabled, .dropdown-item:disabled {
color: #6c757d; color: #6c757d;
@ -3619,7 +3642,7 @@ textarea.form-control-lg {
} }
.dropdown-menu-dark .dropdown-item.active, .dropdown-menu-dark .dropdown-item:active { .dropdown-menu-dark .dropdown-item.active, .dropdown-menu-dark .dropdown-item:active {
color: #fff; color: #fff;
background-color: #0d6efd; background-color: #b58e51;
} }
.dropdown-menu-dark .dropdown-item.disabled, .dropdown-menu-dark .dropdown-item:disabled { .dropdown-menu-dark .dropdown-item.disabled, .dropdown-menu-dark .dropdown-item:disabled {
color: #adb5bd; color: #adb5bd;
@ -3706,6 +3729,13 @@ textarea.form-control-lg {
padding-left: 0.75rem; padding-left: 0.75rem;
} }
.btn-group.show .dropdown-toggle {
box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
}
.btn-group.show .dropdown-toggle.btn-link {
box-shadow: none;
}
.btn-group-vertical { .btn-group-vertical {
flex-direction: column; flex-direction: column;
align-items: flex-start; align-items: flex-start;
@ -3790,7 +3820,7 @@ textarea.form-control-lg {
.nav-pills .nav-link.active, .nav-pills .nav-link.active,
.nav-pills .show > .nav-link { .nav-pills .show > .nav-link {
color: #fff; color: #fff;
background-color: #0d6efd; background-color: #b58e51;
} }
.nav-fill > .nav-link, .nav-fill > .nav-link,
@ -4289,7 +4319,7 @@ textarea.form-control-lg {
} }
.accordion-button:not(.collapsed) { .accordion-button:not(.collapsed) {
color: #0c63e4; color: #0c63e4;
background-color: #e7f1ff; background-color: #f8f4ee;
} }
.accordion-button:not(.collapsed)::after { .accordion-button:not(.collapsed)::after {
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%230c63e4'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e"); background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%230c63e4'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
@ -4316,9 +4346,9 @@ textarea.form-control-lg {
} }
.accordion-button:focus { .accordion-button:focus {
z-index: 3; z-index: 3;
border-color: #86b7fe; border-color: #dac7a8;
outline: 0; outline: 0;
box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25); box-shadow: 0 0 0 0.25rem rgba(181, 142, 81, 0.25);
} }
.accordion-header { .accordion-header {
@ -4420,7 +4450,7 @@ textarea.form-control-lg {
color: #0a58ca; color: #0a58ca;
background-color: #e9ecef; background-color: #e9ecef;
outline: 0; outline: 0;
box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25); box-shadow: 0 0 0 0.25rem rgba(181, 142, 81, 0.25);
} }
.page-item:not(:first-child) .page-link { .page-item:not(:first-child) .page-link {
@ -4429,8 +4459,8 @@ textarea.form-control-lg {
.page-item.active .page-link { .page-item.active .page-link {
z-index: 3; z-index: 3;
color: #fff; color: #fff;
background-color: #0d6efd; background-color: #b58e51;
border-color: #0d6efd; border-color: #b58e51;
} }
.page-item.disabled .page-link { .page-item.disabled .page-link {
color: #6c757d; color: #6c757d;
@ -4527,75 +4557,75 @@ textarea.form-control-lg {
} }
.alert-primary { .alert-primary {
color: #084298; color: white;
background-color: #cfe2ff; background-color: #0d6efd;
border-color: #b6d4fe; border-color: #257dfd;
} }
.alert-primary .alert-link { .alert-primary .alert-link {
color: #06357a; color: #cccccc;
} }
.alert-secondary { .alert-secondary {
color: #1f2326; color: white;
background-color: #d6d8d9; background-color: #343a40;
border-color: #c2c4c6; border-color: #484e53;
} }
.alert-secondary .alert-link { .alert-secondary .alert-link {
color: #191c1e; color: #cccccc;
} }
.alert-success { .alert-success {
color: #0f5132; color: white;
background-color: #d1e7dd; background-color: #198754;
border-color: #badbcc; border-color: #309365;
} }
.alert-success .alert-link { .alert-success .alert-link {
color: #0c4128; color: #cccccc;
} }
.alert-info { .alert-info {
color: #055160; color: #0dcaf0;
background-color: #cff4fc; background-color: #0dcaf0;
border-color: #b6effb; border-color: #25cff2;
} }
.alert-info .alert-link { .alert-info .alert-link {
color: #04414d; color: #0aa2c0;
} }
.alert-warning { .alert-warning {
color: #664d03; color: #ffc107;
background-color: #fff3cd; background-color: #ffc107;
border-color: #ffecb5; border-color: #ffc720;
} }
.alert-warning .alert-link { .alert-warning .alert-link {
color: #523e02; color: #cc9a06;
} }
.alert-danger { .alert-danger {
color: #842029; color: white;
background-color: #f8d7da; background-color: #dc3545;
border-color: #f5c2c7; border-color: #e04958;
} }
.alert-danger .alert-link { .alert-danger .alert-link {
color: #6a1a21; color: #cccccc;
} }
.alert-light { .alert-light {
color: #636464; color: #f8f9fa;
background-color: #fefefe; background-color: #f8f9fa;
border-color: #fdfdfe; border-color: #f9fafb;
} }
.alert-light .alert-link { .alert-light .alert-link {
color: #4f5050; color: #c6c7c8;
} }
.alert-dark { .alert-dark {
color: #191919; color: white;
background-color: #d4d4d4; background-color: #292929;
border-color: #bfbfbf; border-color: #3e3e3e;
} }
.alert-dark .alert-link { .alert-dark .alert-link {
color: #141414; color: #cccccc;
} }
@keyframes progress-bar-stripes { @keyframes progress-bar-stripes {
@ -4610,6 +4640,7 @@ textarea.form-control-lg {
font-size: 0.75rem; font-size: 0.75rem;
background-color: #e9ecef; background-color: #e9ecef;
border-radius: 0.25rem; border-radius: 0.25rem;
box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.075);
} }
.progress-bar { .progress-bar {
@ -4653,14 +4684,14 @@ textarea.form-control-lg {
.list-group-item-action { .list-group-item-action {
width: 100%; width: 100%;
color: #495057; color: #b58e51;
text-align: inherit; text-align: inherit;
} }
.list-group-item-action:hover, .list-group-item-action:focus { .list-group-item-action:hover, .list-group-item-action:focus {
z-index: 1; z-index: 1;
color: #495057; color: #adb5bd;
text-decoration: none; text-decoration: none;
background-color: #f8f9fa; background-color: #343a40;
} }
.list-group-item-action:active { .list-group-item-action:active {
color: #212529; color: #212529;
@ -4672,7 +4703,7 @@ textarea.form-control-lg {
display: block; display: block;
padding: 0.5rem 1rem; padding: 0.5rem 1rem;
text-decoration: none; text-decoration: none;
background-color: #fff; background-color: #343a40;
border: 1px solid rgba(0, 0, 0, 0.125); border: 1px solid rgba(0, 0, 0, 0.125);
} }
.list-group-item:first-child { .list-group-item:first-child {
@ -4686,13 +4717,13 @@ textarea.form-control-lg {
.list-group-item.disabled, .list-group-item:disabled { .list-group-item.disabled, .list-group-item:disabled {
color: #6c757d; color: #6c757d;
pointer-events: none; pointer-events: none;
background-color: #fff; background-color: #343a40;
} }
.list-group-item.active { .list-group-item.active {
z-index: 2; z-index: 2;
color: #fff; color: #fff;
background-color: #0d6efd; background-color: #b58e51;
border-color: #0d6efd; border-color: #b58e51;
} }
.list-group-item + .list-group-item { .list-group-item + .list-group-item {
border-top-width: 0; border-top-width: 0;
@ -4898,31 +4929,31 @@ textarea.form-control-lg {
} }
.list-group-item-info { .list-group-item-info {
color: #055160; color: #0dcaf0;
background-color: #cff4fc; background-color: #cff4fc;
} }
.list-group-item-info.list-group-item-action:hover, .list-group-item-info.list-group-item-action:focus { .list-group-item-info.list-group-item-action:hover, .list-group-item-info.list-group-item-action:focus {
color: #055160; color: #0dcaf0;
background-color: #badce3; background-color: #badce3;
} }
.list-group-item-info.list-group-item-action.active { .list-group-item-info.list-group-item-action.active {
color: #fff; color: #fff;
background-color: #055160; background-color: #0dcaf0;
border-color: #055160; border-color: #0dcaf0;
} }
.list-group-item-warning { .list-group-item-warning {
color: #664d03; color: #ffc107;
background-color: #fff3cd; background-color: #fff3cd;
} }
.list-group-item-warning.list-group-item-action:hover, .list-group-item-warning.list-group-item-action:focus { .list-group-item-warning.list-group-item-action:hover, .list-group-item-warning.list-group-item-action:focus {
color: #664d03; color: #ffc107;
background-color: #e6dbb9; background-color: #e6dbb9;
} }
.list-group-item-warning.list-group-item-action.active { .list-group-item-warning.list-group-item-action.active {
color: #fff; color: #fff;
background-color: #664d03; background-color: #ffc107;
border-color: #664d03; border-color: #ffc107;
} }
.list-group-item-danger { .list-group-item-danger {
@ -4940,17 +4971,17 @@ textarea.form-control-lg {
} }
.list-group-item-light { .list-group-item-light {
color: #636464; color: #f8f9fa;
background-color: #fefefe; background-color: #fefefe;
} }
.list-group-item-light.list-group-item-action:hover, .list-group-item-light.list-group-item-action:focus { .list-group-item-light.list-group-item-action:hover, .list-group-item-light.list-group-item-action:focus {
color: #636464; color: #f8f9fa;
background-color: #e5e5e5; background-color: #e5e5e5;
} }
.list-group-item-light.list-group-item-action.active { .list-group-item-light.list-group-item-action.active {
color: #fff; color: #fff;
background-color: #636464; background-color: #f8f9fa;
border-color: #636464; border-color: #f8f9fa;
} }
.list-group-item-dark { .list-group-item-dark {
@ -4985,7 +5016,7 @@ textarea.form-control-lg {
} }
.btn-close:focus { .btn-close:focus {
outline: none; outline: none;
box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25); box-shadow: 0 0 0 0.25rem rgba(181, 142, 81, 0.25);
opacity: 1; opacity: 1;
} }
.btn-close:disabled, .btn-close.disabled { .btn-close:disabled, .btn-close.disabled {
@ -5114,6 +5145,7 @@ textarea.form-control-lg {
background-clip: padding-box; background-clip: padding-box;
border: 1px solid rgba(0, 0, 0, 0.2); border: 1px solid rgba(0, 0, 0, 0.2);
border-radius: 0.3rem; border-radius: 0.3rem;
box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
outline: 0; outline: 0;
} }
@ -5196,6 +5228,10 @@ textarea.form-control-lg {
min-height: calc(100% - 3.5rem); min-height: calc(100% - 3.5rem);
} }
.modal-content {
box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
}
.modal-sm { .modal-sm {
max-width: 300px; max-width: 300px;
} }
@ -5469,6 +5505,7 @@ textarea.form-control-lg {
background-clip: padding-box; background-clip: padding-box;
border: 1px solid rgba(0, 0, 0, 0.2); border: 1px solid rgba(0, 0, 0, 0.2);
border-radius: 0.3rem; border-radius: 0.3rem;
box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
} }
.popover .popover-arrow { .popover .popover-arrow {
position: absolute; position: absolute;

2
nextcloud_backup/rootfs/opt/nextcloud_backup/public/css/custom_bootstrap.css.map
View File

File diff suppressed because one or more lines are too long

34
nextcloud_backup/rootfs/opt/nextcloud_backup/public/js/index.js
View File

@ -4,7 +4,8 @@ var last_manu_back = "";
var last_auto_back = ""; var last_auto_back = "";
const default_toast_timeout = 10000; const default_toast_timeout = 10000;
var loadingModal = null; let loadingModal = null;
let nextcloud_setting_modal;
document.addEventListener('DOMContentLoaded', function () { document.addEventListener('DOMContentLoaded', function () {
$.ajaxSetup({ traditional: true }); $.ajaxSetup({ traditional: true });
updateLocalSnaps(); updateLocalSnaps();
@ -13,6 +14,7 @@ document.addEventListener('DOMContentLoaded', function () {
keyboard: false, keyboard: false,
backdrop: 'static' backdrop: 'static'
}); });
nextcloud_setting_modal = new bootstrap.Modal(document.getElementById('modal-settings-nextcloud'));
setInterval(update_status, 500); setInterval(update_status, 500);
setInterval(updateLocalSnaps, 5000); setInterval(updateLocalSnaps, 5000);
@ -185,12 +187,12 @@ function listeners() {
}); });
$('#ssl').change(function () { $('#ssl').change(function () {
let div = $('#self_signed').parent().parent().parent(); let div = $('#self_signed').parent().parent();
if ($('#ssl').is(':checked')) if ($('#ssl').is(':checked'))
div.removeClass("hide") div.removeClass("invisible")
else else
div.addClass("hide"); div.addClass("invisible");
}); });
$('#confirm-restore').click(function () { $('#confirm-restore').click(function () {
@ -216,6 +218,7 @@ function restore(id) {
function sendNextcloudSettings() { function sendNextcloudSettings() {
loadingModal.show(); loadingModal.show();
nextcloud_setting_modal.hide();
let ssl = $('#ssl').is(':checked') let ssl = $('#ssl').is(':checked')
let self_signed = $('#self_signed').is(':checked') let self_signed = $('#self_signed').is(':checked')
let hostname = $('#hostname').val(); let hostname = $('#hostname').val();
@ -232,13 +235,10 @@ function sendNextcloudSettings() {
}) })
.done((data) => { .done((data) => {
console.log('Saved'); console.log('Saved');
$('#nextcloud_settings_message').parent().addClass("hide"); $('#nextcloud_settings_message').parent().addClass("d-none");
create_toast("success", "Nextcloud settings saved !", default_toast_timeout); create_toast("success", "Nextcloud settings saved !", default_toast_timeout);0
M.Modal.getInstance(document.querySelector('#modal-settings-nextcloud')).close();
}) })
.fail((data) => { .fail((data) => {
debugger;
if (data.status == 406) { if (data.status == 406) {
console.log(data.responseJSON.message); console.log(data.responseJSON.message);
$('#nextcloud_settings_message').html(data.responseJSON.message); $('#nextcloud_settings_message').html(data.responseJSON.message);
@ -247,7 +247,8 @@ function sendNextcloudSettings() {
$('#nextcloud_settings_message').html("Invalid Settings."); $('#nextcloud_settings_message').html("Invalid Settings.");
} }
$('#nextcloud_settings_message').parent().removeClass("hide"); $('#nextcloud_settings_message').parent().removeClass("d-none");
nextcloud_setting_modal.show();
create_toast("error", "Invalid Nextcloud settings !", default_toast_timeout); create_toast("error", "Invalid Nextcloud settings !", default_toast_timeout);
console.log('Fail'); console.log('Fail');
}).always(() => { }).always(() => {
@ -274,23 +275,16 @@ function getNextcloudSettings() {
$.get('./api/nextcloud-settings', (data) => { $.get('./api/nextcloud-settings', (data) => {
$('#ssl').prop("checked", data.ssl == "true"); $('#ssl').prop("checked", data.ssl == "true");
if (data.ssl == "true") { if (data.ssl == "true") {
let div = $('#self_signed').parent().parent().parent(); let div = $('#self_signed').parent().parent();
div.removeClass("hide"); div.removeClass("invisible");
} }
$('#self_signed').prop('checked', data.self_signed == "true") $('#self_signed').prop('checked', data.self_signed == "true")
$('#hostname').val(data.host); $('#hostname').val(data.host);
$('#hostname + label').removeClass("active");
$('#hostname + label').addClass("active");
$('#username').val(data.username); $('#username').val(data.username);
$('#username + label').removeClass("active");
$('#username + label').addClass("active");
$('#password').val(data.password); $('#password').val(data.password);
$('#password + label').removeClass("active");
$('#password + label').addClass("active");
$('#back-dir').val(data.back_dir); $('#back-dir').val(data.back_dir);
$('#back-dir + label').removeClass("active");
$('#back-dir + label').addClass("active");
loadingModal.hide(); loadingModal.hide();
nextcloud_setting_modal.show();
}); });
} }

4
nextcloud_backup/rootfs/opt/nextcloud_backup/public/js/toast.js
View File

@ -9,11 +9,11 @@ function create_toast(type, message, delay) {
default: default:
toast_class = `bg-${type}` toast_class = `bg-${type}`
icon_class = 'fa-check' icon_class = 'fa-check-square'
} }
let toast_id = Date.now().toString(); let toast_id = Date.now().toString();
let toast_html = `<div id="${toast_id}" class="toast d-flex align-items-center text-white ${toast_class}" role="alert" aria-live="assertive" aria-atomic="true">` let toast_html = `<div id="${toast_id}" class="toast d-flex align-items-center text-white ${toast_class}" role="alert" aria-live="assertive" aria-atomic="true">`
toast_html += `<div class="toast-body h5 mb-0"><i class="fas ${icon_class} me-2"></i> ${message}</div>` toast_html += `<div class="toast-body h6 mb-0 align-middle"><i class="fas ${icon_class} me-2 h5 mb-0"></i><span>${message}</span></div>`
toast_html += `<button type="button" class="btn-close btn-close-white ms-auto me-2" data-bs-dismiss="toast" aria-label="Close"></button></div>` toast_html += `<button type="button" class="btn-close btn-close-white ms-auto me-2" data-bs-dismiss="toast" aria-label="Close"></button></div>`
$('#toast-container').prepend(toast_html); $('#toast-container').prepend(toast_html);
let toast_dom = document.getElementById(toast_id) let toast_dom = document.getElementById(toast_id)

5
nextcloud_backup/rootfs/opt/nextcloud_backup/routes/api.js
View File

@ -30,6 +30,7 @@ router.get("/formated-local-snap", function (req, res, next) {
return -1; return -1;
} }
}); });
res.render("localSnaps", { snaps: snaps, moment: moment }); res.render("localSnaps", { snaps: snaps, moment: moment });
}, },
(err) => { (err) => {
@ -68,6 +69,10 @@ router.get("/formated-local-snap", function (req, res, next) {
if (moment(a.lastmod).isBefore(moment(b.lastmod))) return 1; if (moment(a.lastmod).isBefore(moment(b.lastmod))) return 1;
else return -1; else return -1;
}); });
//TODO Remove this when bug is fixed, etag contain '&quot;' at start and end ?
for(let backup of contents){
backup.etag = backup.etag.replace(/&quot;/g, '');
}
res.render("backupSnaps", { backups: contents, moment: moment, humanFileSize: humanFileSize }); res.render("backupSnaps", { backups: contents, moment: moment, humanFileSize: humanFileSize });
}) })
.catch(() => { .catch(() => {

33
nextcloud_backup/rootfs/opt/nextcloud_backup/scss/custom_bootstrap.scss
View File

@ -4,6 +4,29 @@ $dark: #292929;
$secondary: #343a40; $secondary: #343a40;
$accent: #b58e51; $accent: #b58e51;
$enable-shadows: true;
$btn-box-shadow: none;
$component-active-bg: $accent;
$input-color: $accent;
$input-bg: $secondary;
$input-border-color: $secondary;
$form-switch-color: $accent;
$form-switch-bg-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'><circle r='3' fill='#{$form-switch-color}'/></svg>");
$form-check-input-border: 1px solid $accent !default;
$list-group-action-color: $accent;
$list-group-bg: $secondary;
$list-group-hover-bg: $secondary;
$list-group-action-hover-color : #adb5bd;
$alert-bg-scale: 0%;
$alert-border-scale: -10%;
$alert-color-scale: -100%;
@import "../node_modules/bootstrap/scss/bootstrap"; @import "../node_modules/bootstrap/scss/bootstrap";
@ -13,4 +36,14 @@ $accent: #b58e51;
.text-accent{ .text-accent{
color: $accent; color: $accent;
} }
//.form-switch .form-check-input{
// //background-color: $white;
// border-color: $white;
// color: $white;
//}
//
//.form-check-input:checked{
// background-color: $accent;
// border-color: $accent;
//}

2
nextcloud_backup/rootfs/opt/nextcloud_backup/views/backupSnaps.ejs
View File

@ -1,7 +1,7 @@
<% if (locals.backups) { %> <% if (locals.backups) { %>
<div class="list-group "> <div class="list-group ">
<% for(const index in backups) { %> <% for(const index in backups) { %>
<a class="list-group-item list-group-item-action d-flex justify-content-between align-items-center bg-secondary text-accent" <a class="list-group-item list-group-item-action d-flex justify-content-between align-items-center"
href="#" href="#"
data-id="<%= backups[index].etag %>" data-id="<%= backups[index].etag %>"
data-bs-toggle="modal" data-bs-toggle="modal"

14
nextcloud_backup/rootfs/opt/nextcloud_backup/views/index.ejs
View File

@ -88,7 +88,7 @@
</a> </a>
<ul class="navbar-nav"> <ul class="navbar-nav">
<li class="nav-item dropdown" id="setting-trigger"> <li class="nav-item dropdown" id="setting-trigger">
<a class="btn btn-outline-light bg-transparent nav-link active px-2" href="#" id="dropdown-settings" <a class="btn btn-outline-light bg-transparent nav-link px-2 text-white" href="#" id="dropdown-settings"
role="button" role="button"
data-bs-toggle="dropdown" aria-expanded="false"> data-bs-toggle="dropdown" aria-expanded="false">
<i class="fas fa-cogs"></i> <i class="fas fa-cogs"></i>
@ -109,7 +109,7 @@
<div class="container"> <div class="container">
<div class="row mt-3 mb-3" id="header-box"> <div class="row mt-3 mb-3" id="header-box">
<div class="col-12 col-md-3 mb-3 mb-md-0"> <div class="col-12 col-md-3 mb-3 mb-md-0">
<div class="card text-white bg-dark h-100 shadow border-secondary"> <div class="card text-white bg-dark h-100 shadow-sm border-secondary">
<div class="card-header fw-bold h5 border-secondary border-bottom">Status</div> <div class="card-header fw-bold h5 border-secondary border-bottom">Status</div>
<div class="card-body"> <div class="card-body">
<h6 id="status" class="white-text"></h6> <h6 id="status" class="white-text"></h6>
@ -123,7 +123,7 @@
</div> </div>
<div class="col-12 col-md-3 mb-3 mb-md-0"> <div class="col-12 col-md-3 mb-3 mb-md-0">
<div class="card text-white bg-dark h-100 shadow border-secondary"> <div class="card text-white bg-dark h-100 shadow-sm border-secondary">
<div class="card-header fw-bold h5 border-secondary border-bottom">Last Backup</div> <div class="card-header fw-bold h5 border-secondary border-bottom">Last Backup</div>
<div class="card-body"> <div class="card-body">
<h6 class="white-text" id="last_back_status"></h6> <h6 class="white-text" id="last_back_status"></h6>
@ -131,7 +131,7 @@
</div> </div>
</div> </div>
<div class="col-12 col-md-3 mb-3 mb-md-0"> <div class="col-12 col-md-3 mb-3 mb-md-0">
<div class="card text-white bg-dark h-100 shadow border-secondary"> <div class="card text-white bg-dark h-100 shadow-sm border-secondary">
<div class="card-header fw-bold h5 border-secondary border-bottom">Next Backup</div> <div class="card-header fw-bold h5 border-secondary border-bottom">Next Backup</div>
<div class="card-body"> <div class="card-body">
<h6 class="white-text" id="next_back_status"></h6> <h6 class="white-text" id="next_back_status"></h6>
@ -139,7 +139,7 @@
</div> </div>
</div> </div>
<div class="col-12 col-md-3"> <div class="col-12 col-md-3">
<div class="card text-white bg-dark h-100 shadow border-secondary"> <div class="card text-white bg-dark h-100 shadow-sm border-secondary">
<div class="card-header fw-bold h5 border-secondary border-bottom">Manual</div> <div class="card-header fw-bold h5 border-secondary border-bottom">Manual</div>
<div class="card-body"> <div class="card-body">
<div class="w-100"> <div class="w-100">
@ -159,7 +159,7 @@
<div class="row"> <div class="row">
<div class="col-12 col-md-12 col-lg-6 mb-3 mb-lg-0"> <div class="col-12 col-md-12 col-lg-6 mb-3 mb-lg-0">
<div class="card text-white bg-dark h-100 shadow border-secondary"> <div class="card text-white bg-dark h-100 shadow-sm border-secondary">
<div class="card-header fw-bold h4 text-center border-secondary border-bottom">Local Snapshots</div> <div class="card-header fw-bold h4 text-center border-secondary border-bottom">Local Snapshots</div>
<div class="card-body"> <div class="card-body">
<div id="local_snaps"></div> <div id="local_snaps"></div>
@ -167,7 +167,7 @@
</div> </div>
</div> </div>
<div class="col-12 col-md-12 col-lg-6 "> <div class="col-12 col-md-12 col-lg-6 ">
<div class="card text-white bg-dark h-100 shadow border-secondary"> <div class="card text-white bg-dark h-100 shadow-sm border-secondary">
<div class="card-header fw-bold h4 text-center border-secondary border-bottom">Snapshots in Nextcloud <div class="card-header fw-bold h4 text-center border-secondary border-bottom">Snapshots in Nextcloud
</div> </div>
<div class="card-body"> <div class="card-body">

2
nextcloud_backup/rootfs/opt/nextcloud_backup/views/localSnaps.ejs
View File

@ -1,7 +1,7 @@
<% if (locals.snaps) { %> <% if (locals.snaps) { %>
<div class="list-group"> <div class="list-group">
<% for(const index in snaps) { %> <% for(const index in snaps) { %>
<a class="list-group-item list-group-item-action d-flex justify-content-between align-items-center bg-secondary text-accent" <a class="list-group-item list-group-item-action d-flex justify-content-between align-items-center"
href="#" href="#"
data-id="<%= snaps[index].slug %>" data-id="<%= snaps[index].slug %>"
data-bs-toggle="modal" data-bs-toggle="modal"

116
nextcloud_backup/rootfs/opt/nextcloud_backup/views/modals/nextcloud-settings-modal.ejs
View File

@ -1,73 +1,73 @@
<div id="modal-settings-nextcloud" class="modal modal-fixed-footer blue-grey darken-4 white-text"> <div id="modal-settings-nextcloud" class="modal fade" xmlns="http://www.w3.org/1999/html">
<div class="modal-content"> <div class="modal-dialog modal-lg">
<div class="row"> <div class="modal-content bg-dark text-white">
<div class="col s12 center"> <div class="modal-header border-secondary">
<h4>Nextcloud Settings</h4> <h5 class="modal-title" id="exampleModalLabel">Nextcloud Settings</h5>
<button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal"
aria-label="Close"></button>
</div> </div>
</div> <div class="modal-body">
<div class="row"> <div class="row d-none">
<div class="col s12 center divider"> <div class="col-12 col-md-10 offset-md-1 text-center alert alert-danger" role="alert" id="nextcloud_settings_message">
</div>
</div>
<div class="row hide">
<div class="col s12 center red-text" id="nextcloud_settings_message">
</div> </div>
</div> </div>
<div class="row" style="margin-bottom: 10px;">
<div class="col m4 s12 " style="margin-bottom: 10px;">
<div style="color: #9e9e9e; display: inline;">SSL</div>
<div class="switch" style="display: inline;">
<label>
<input id="ssl" type="checkbox">
<span class="lever"></span>
</label>
</div>
</div>
<div class="col m8 s12 hide" style="margin-bottom: 10px;">
<div style="color: #9e9e9e; display: inline;">Accept Self-signed certificate</div>
<div class="switch" style="display: inline;">
<label>
<input id="self_signed" type="checkbox">
<span class="lever"></span>
</label>
</div>
</div>
</div>
<div class="row"> <div class="row">
<div class="input-field col s12"> <div class="col-sm-12 col-md-4">
<input id="hostname" type="text" class="white-text"> <div class="form-check form-switch">
<label for="hostname">Hostname</label> <input class="form-check-input" id="ssl" type="checkbox">
<span class="helper-text">exemple.com:8080</span> <label class="form-check-label" for="ssl">SSL</label>
</div> </div>
</div> </div>
<div class="row"> <div class="col-sm-12 col-md-8 invisible">
<div class="input-field col m6 s12"> <div class="form-check form-switch">
<input id="username" type="text" class="white-text"> <input class="form-check-input" id="self_signed" type="checkbox">
<label for="username">Username</label> <label class="form-check-label" for="ssl">Accept Self-signed certificate</label>
</div>
<div class="input-field col m6 s12">
<input id="password" type="password" class="white-text">
<label for="password">Password</label>
<span class="helper-text">!!! Use App Password !!! See <a target="_blank"
href="https://github.com/Sebclem/hassio-nextcloud-backup#nextcloud-config">doc</a> for more
information.</span>
</div> </div>
</div> </div>
<div class="row"> </div>
<div class="input-field col s12"> <div class="row mt-3">
<input id="back-dir" type="text" class="white-text"> <div class="col-12">
<label for="back-dir">Backup Directory</label> <label for="hostname" class="form-label">Hostname</label>
<span class="helper-text">Default: /Hassio Backup/</span> <input id="hostname" type="text" class="form-control" aria-describedby="hostname-help">
<div id="hostname-help" class="form-text">exemple.com:8080</span>
</div>
</div>
</div>
<div class="row mt-3">
<div class="col-12 col-md-6">
<label for="username" class="form-label">Username</label>
<input id="username" type="text" class="form-control">
</div>
<div class="col-12 col-md-6">
<label for="password" class="form-label">Password</label>
<input id="password" type="password" class="form-control" aria-describedby="password-help">
<div id="password-help" class="form-text">
!!! Use App Password !!! See
<a target="_blank"
href="https://github.com/Sebclem/hassio-nextcloud-backup#nextcloud-config">
doc
</a>
for more information.
</div>
</div>
</div>
<div class="row mt-3">
<div class="col-12">
<label for="back-dir" class="form-label">Backup Directory</label>
<input id="back-dir" type="text" class="form-control" aria-describedby="dir-help">
<div id="dir-help" class="form-text">Default: /Hassio Backup/</div>
</div>
</div>
</div>
<div class="modal-footer border-secondary">
<button data-bs-dismiss="modal" class="btn btn-danger"><b>Cancel</b></button>
<button class="btn btn-success" id="save-nextcloud-settings"><b>Save</b></button>
</div> </div>
</div> </div>
</div> </div>
<div class="modal-footer blue-grey darken-4"> </div>
<a href="#" class="modal-close waves-effect btn red"><b>Cancel</b></a>
<a href="#" class="btn green waves-effect" style="margin-left: 5px;" id="save-nextcloud-settings"><b>Save</b></a>
</div>
</div>