From e22068ec90cce7f80570f3fd328397967a332641 Mon Sep 17 00:00:00 2001 From: Sami Mokaddem Date: Thu, 16 Dec 2021 11:53:56 +0100 Subject: [PATCH] chg: [themes] Recompiled themes using dart-sass --- .../additional/bootstrap-additional.css | 315 +- webroot/css/themes/theme-darkly.css | 389 ++- webroot/css/themes/theme-default.css | 389 ++- webroot/css/themes/theme-flatly.css | 389 ++- webroot/css/themes/theme-minty.css | 389 ++- webroot/css/themes/theme-quartz.css | 1156 +++---- webroot/css/themes/theme-slate.css | 2698 ++++++++++------- webroot/css/themes/theme-vapor.css | 386 ++- 8 files changed, 3493 insertions(+), 2618 deletions(-) diff --git a/webroot/css/themes/additional/bootstrap-additional.css b/webroot/css/themes/additional/bootstrap-additional.css index 4a7c905..a0fc59f 100644 --- a/webroot/css/themes/additional/bootstrap-additional.css +++ b/webroot/css/themes/additional/bootstrap-additional.css @@ -1,284 +1,329 @@ /* Callout */ .callout { border: 1px solid #e9ecef; - border-radius: .25rem; + border-radius: 0.25rem; background-color: #fff; - box-shadow: 0 0 35px 0 rgba(154, 161, 171, 0.25); } + box-shadow: 0 0 35px 0 rgba(154, 161, 171, 0.25); +} .callout-primary { border-left-color: #0d6efd; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-secondary { border-left-color: #6c757d; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-success { border-left-color: #198754; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-info { border-left-color: #0dcaf0; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-warning { border-left-color: #ffc107; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-danger { border-left-color: #dc3545; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-light { border-left-color: #f8f9fa; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-dark { border-left-color: #212529; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} /* Toasts */ .toast { - min-width: 250px; } + min-width: 250px; +} .toast-primary { color: #04214c; background-color: #b6d4fe; - border-color: #9ec5fe; } - .toast-primary strong { - border-top-color: #85b6fe; } + border-color: #9ec5fe; +} +.toast-primary strong { + border-top-color: #85b6fe; +} .toast-secondary { color: #202326; background-color: #d3d6d8; - border-color: #c4c8cb; } - .toast-secondary strong { - border-top-color: #b6bbbf; } + border-color: #c4c8cb; +} +.toast-secondary strong { + border-top-color: #b6bbbf; +} .toast-success { color: #082919; background-color: #badbcc; - border-color: #a3cfbb; } - .toast-success strong { - border-top-color: #92c6af; } + border-color: #a3cfbb; +} +.toast-success strong { + border-top-color: #92c6af; +} .toast-info { color: #043d48; background-color: #b6effb; - border-color: #9eeaf9; } - .toast-info strong { - border-top-color: #86e5f8; } + border-color: #9eeaf9; +} +.toast-info strong { + border-top-color: #86e5f8; +} .toast-warning { color: #4d3a02; background-color: #ffecb5; - border-color: #ffe69c; } - .toast-warning strong { - border-top-color: #ffe083; } + border-color: #ffe69c; +} +.toast-warning strong { + border-top-color: #ffe083; +} .toast-danger { color: #421015; background-color: #f5c2c7; - border-color: #f1aeb5; } - .toast-danger strong { - border-top-color: #ed98a1; } + border-color: #f1aeb5; +} +.toast-danger strong { + border-top-color: #ed98a1; +} .toast-light { color: #4a4b4b; background-color: #fdfdfe; - border-color: #fcfdfd; } - .toast-light strong { - border-top-color: #edf3f3; } + border-color: #fcfdfd; +} +.toast-light strong { + border-top-color: #edf3f3; +} .toast-dark { color: #0a0b0c; background-color: #bcbebf; - border-color: #a6a8a9; } - .toast-dark strong { - border-top-color: #999b9c; } + border-color: #a6a8a9; +} +.toast-dark strong { + border-top-color: #999b9c; +} /* Dropdown-item */ .dropdown-item.dropdown-item-primary { color: #fff; text-decoration: none; - background-color: #0d6efd; } - + background-color: #0d6efd; +} .dropdown-item.dropdown-item-outline-primary:hover { color: #fff; - background-color: #0d6efd; } - + background-color: #0d6efd; +} .dropdown-item.dropdown-item-secondary { color: #fff; text-decoration: none; - background-color: #6c757d; } - + background-color: #6c757d; +} .dropdown-item.dropdown-item-outline-secondary:hover { color: #fff; - background-color: #6c757d; } - + background-color: #6c757d; +} .dropdown-item.dropdown-item-success { color: #fff; text-decoration: none; - background-color: #198754; } - + background-color: #198754; +} .dropdown-item.dropdown-item-outline-success:hover { color: #fff; - background-color: #198754; } - + background-color: #198754; +} .dropdown-item.dropdown-item-info { color: #000; text-decoration: none; - background-color: #0dcaf0; } - + background-color: #0dcaf0; +} .dropdown-item.dropdown-item-outline-info:hover { color: #000; - background-color: #0dcaf0; } - + background-color: #0dcaf0; +} .dropdown-item.dropdown-item-warning { color: #000; text-decoration: none; - background-color: #ffc107; } - + background-color: #ffc107; +} .dropdown-item.dropdown-item-outline-warning:hover { color: #000; - background-color: #ffc107; } - + background-color: #ffc107; +} .dropdown-item.dropdown-item-danger { color: #fff; text-decoration: none; - background-color: #dc3545; } - + background-color: #dc3545; +} .dropdown-item.dropdown-item-outline-danger:hover { color: #fff; - background-color: #dc3545; } - + background-color: #dc3545; +} .dropdown-item.dropdown-item-light { color: #000; text-decoration: none; - background-color: #f8f9fa; } - + background-color: #f8f9fa; +} .dropdown-item.dropdown-item-outline-light:hover { color: #000; - background-color: #f8f9fa; } - + background-color: #f8f9fa; +} .dropdown-item.dropdown-item-dark { color: #fff; text-decoration: none; - background-color: #212529; } - + background-color: #212529; +} .dropdown-item.dropdown-item-outline-dark:hover { color: #fff; - background-color: #212529; } + background-color: #212529; +} /* Progress Timeline */ .progress-timeline { - padding: 0.2em 0.2em 0.5em 0.2em; } - .progress-timeline ul { - position: relative; - padding: 0; } - .progress-timeline li { - list-style-type: none; - position: relative; } - .progress-timeline li.progress-inactive { - opacity: 0.5; } - .progress-timeline .progress-line { - height: 2px; } - .progress-timeline .progress-line.progress-inactive { - opacity: 0.5; } + padding: 0.2em 0.2em 0.5em 0.2em; +} +.progress-timeline ul { + position: relative; + padding: 0; +} +.progress-timeline li { + list-style-type: none; + position: relative; +} +.progress-timeline li.progress-inactive { + opacity: 0.5; +} +.progress-timeline .progress-line { + height: 2px; +} +.progress-timeline .progress-line.progress-inactive { + opacity: 0.5; +} /* Forms severity */ .form-control.is-invalid.info { - background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%230dcaf0' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%230dcaf0' stroke='none'/%3e%3c/svg%3e"); } - .form-control.is-invalid.info:focus { - border-color: #0dcaf0; - box-shadow: 0 0 0 0.25rem rgba(13, 202, 240, 0.25); } - + background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%230dcaf0' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%230dcaf0' stroke='none'/%3e%3c/svg%3e"); +} +.form-control.is-invalid.info:focus { + border-color: #0dcaf0; + box-shadow: 0 0 0 0.25rem rgba(13, 202, 240, 0.25); +} .form-control.is-invalid.warning { - background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23ffc107' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23ffc107' stroke='none'/%3e%3c/svg%3e"); } - .form-control.is-invalid.warning:focus { - border-color: #ffc107; - box-shadow: 0 0 0 0.25rem rgba(255, 193, 7, 0.25); } + background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23ffc107' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23ffc107' stroke='none'/%3e%3c/svg%3e"); +} +.form-control.is-invalid.warning:focus { + border-color: #ffc107; + box-shadow: 0 0 0 0.25rem rgba(255, 193, 7, 0.25); +} .form-select.is-invalid:not([multiple]):not([size]).info, -.form-select.is-invalid:not([multiple])[size="1"] -.form-select.is-invalid.info { +.form-select.is-invalid:not([multiple])[size="1"] .form-select.is-invalid.info { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%230dcaf0'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%230dcaf0' stroke='none'/%3e%3c/svg%3e"); - background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); } - .form-select.is-invalid:not([multiple]):not([size]).info:focus, - .form-select.is-invalid:not([multiple])[size="1"] -.form-select.is-invalid.info:focus { - box-shadow: 0 0 0 0.25rem rgba(13, 202, 240, 0.25); } - + background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); +} +.form-select.is-invalid:not([multiple]):not([size]).info:focus, +.form-select.is-invalid:not([multiple])[size="1"] .form-select.is-invalid.info:focus { + box-shadow: 0 0 0 0.25rem rgba(13, 202, 240, 0.25); +} .form-select.is-invalid:not([multiple]):not([size]).warning, -.form-select.is-invalid:not([multiple])[size="1"] -.form-select.is-invalid.warning { +.form-select.is-invalid:not([multiple])[size="1"] .form-select.is-invalid.warning { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23ffc107'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23ffc107' stroke='none'/%3e%3c/svg%3e"); - background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); } - .form-select.is-invalid:not([multiple]):not([size]).warning:focus, - .form-select.is-invalid:not([multiple])[size="1"] -.form-select.is-invalid.warning:focus { - box-shadow: 0 0 0 0.25rem rgba(255, 193, 7, 0.25); } + background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); +} +.form-select.is-invalid:not([multiple]):not([size]).warning:focus, +.form-select.is-invalid:not([multiple])[size="1"] .form-select.is-invalid.warning:focus { + box-shadow: 0 0 0 0.25rem rgba(255, 193, 7, 0.25); +} .form-check-input.is-invalid.info { - border-color: #0dcaf0; } - + border-color: #0dcaf0; +} .form-check-input.is-invalid.info:checked { - background-color: #0dcaf0; } - + background-color: #0dcaf0; +} .form-check-input.is-invalid.info ~ .form-check-label { - color: unset; } - + color: unset; +} .form-check-input.is-invalid.info:focus { - box-shadow: 0 0 0 0.2rem rgba(13, 202, 240, 0.25); } - + box-shadow: 0 0 0 0.2rem rgba(13, 202, 240, 0.25); +} .form-check-input.is-invalid.warning { - border-color: #ffc107; } - + border-color: #ffc107; +} .form-check-input.is-invalid.warning:checked { - background-color: #ffc107; } - + background-color: #ffc107; +} .form-check-input.is-invalid.warning ~ .form-check-label { - color: unset; } - + color: unset; +} .form-check-input.is-invalid.warning:focus { - box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.25); } + box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.25); +} /* Utilities */ .mw-75 { - max-width: 75% !important; } + max-width: 75% !important; +} .mw-50 { - max-width: 50% !important; } + max-width: 50% !important; +} .mw-25 { - max-width: 25% !important; } + max-width: 25% !important; +} .mh-75 { - max-height: 75% !important; } + max-height: 75% !important; +} .mh-50 { - max-height: 50% !important; } + max-height: 50% !important; +} .mh-25 { - max-height: 25% !important; } + max-height: 25% !important; +} .p-abs-center-y { top: 50%; - transform: translateY(-50%); } + transform: translateY(-50%); +} .p-abs-center-x { left: 50%; - transform: translateX(-50%); } + transform: translateX(-50%); +} .p-abs-center-both { top: 50%; left: 50%; - transform: translateX(-50%) translateY(-50%); } + transform: translateX(-50%) translateY(-50%); +} diff --git a/webroot/css/themes/theme-darkly.css b/webroot/css/themes/theme-darkly.css index 9c4511a..eb1924f 100644 --- a/webroot/css/themes/theme-darkly.css +++ b/webroot/css/themes/theme-darkly.css @@ -1,287 +1,332 @@ /* Callout */ .callout { border: 1px solid 1px solid none; - border-radius: .25rem; + border-radius: 0.25rem; background-color: #363636; - box-shadow: none; } + box-shadow: none; +} .callout-primary { border-left-color: #375a7f; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-secondary { border-left-color: #444; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-success { border-left-color: #00bc8c; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-info { border-left-color: #3498db; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-warning { border-left-color: #f39c12; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-danger { border-left-color: #e74c3c; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-light { border-left-color: #adb5bd; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-dark { border-left-color: #303030; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} /* Toasts */ .toast { - min-width: 250px; } + min-width: 250px; +} .toast-primary { color: #111b26; background-color: #c3ced9; - border-color: #afbdcc; } - .toast-primary strong { - border-top-color: #9fb0c2; } + border-color: #afbdcc; +} +.toast-primary strong { + border-top-color: #9fb0c2; +} .toast-secondary { color: #141414; background-color: #c7c7c7; - border-color: #b4b4b4; } - .toast-secondary strong { - border-top-color: #a7a7a7; } + border-color: #b4b4b4; +} +.toast-secondary strong { + border-top-color: #a7a7a7; +} .toast-success { color: #00382a; background-color: #b3ebdd; - border-color: #99e4d1; } - .toast-success strong { - border-top-color: #85dfc8; } + border-color: #99e4d1; +} +.toast-success strong { + border-top-color: #85dfc8; +} .toast-info { color: #102e42; background-color: #c2e0f4; - border-color: #aed6f1; } - .toast-info strong { - border-top-color: #98cbed; } + border-color: #aed6f1; +} +.toast-info strong { + border-top-color: #98cbed; +} .toast-warning { color: #492f05; background-color: #fbe1b8; - border-color: #fad7a0; } - .toast-warning strong { - border-top-color: #f9cd88; } + border-color: #fad7a0; +} +.toast-warning strong { + border-top-color: #f9cd88; +} .toast-danger { color: #451712; background-color: #f8c9c5; - border-color: #f5b7b1; } - .toast-danger strong { - border-top-color: #f2a29a; } + border-color: #f5b7b1; +} +.toast-danger strong { + border-top-color: #f2a29a; +} .toast-light { color: #343639; background-color: #e6e9eb; - border-color: #dee1e5; } - .toast-light strong { - border-top-color: #d0d4da; } + border-color: #dee1e5; +} +.toast-light strong { + border-top-color: #d0d4da; +} .toast-dark { color: #0e0e0e; background-color: #c1c1c1; - border-color: #acacac; } - .toast-dark strong { - border-top-color: #9f9f9f; } + border-color: #acacac; +} +.toast-dark strong { + border-top-color: #9f9f9f; +} /* Dropdown-item */ .dropdown-item.dropdown-item-primary { color: #fff; text-decoration: none; - background-color: #375a7f; } - + background-color: #375a7f; +} .dropdown-item.dropdown-item-outline-primary:hover { color: #fff; - background-color: #375a7f; } - + background-color: #375a7f; +} .dropdown-item.dropdown-item-secondary { color: #fff; text-decoration: none; - background-color: #444; } - + background-color: #444; +} .dropdown-item.dropdown-item-outline-secondary:hover { color: #fff; - background-color: #444; } - + background-color: #444; +} .dropdown-item.dropdown-item-success { color: #fff; text-decoration: none; - background-color: #00bc8c; } - + background-color: #00bc8c; +} .dropdown-item.dropdown-item-outline-success:hover { color: #fff; - background-color: #00bc8c; } - + background-color: #00bc8c; +} .dropdown-item.dropdown-item-info { color: #fff; text-decoration: none; - background-color: #3498db; } - + background-color: #3498db; +} .dropdown-item.dropdown-item-outline-info:hover { color: #fff; - background-color: #3498db; } - + background-color: #3498db; +} .dropdown-item.dropdown-item-warning { color: #fff; text-decoration: none; - background-color: #f39c12; } - + background-color: #f39c12; +} .dropdown-item.dropdown-item-outline-warning:hover { color: #fff; - background-color: #f39c12; } - + background-color: #f39c12; +} .dropdown-item.dropdown-item-danger { color: #fff; text-decoration: none; - background-color: #e74c3c; } - + background-color: #e74c3c; +} .dropdown-item.dropdown-item-outline-danger:hover { color: #fff; - background-color: #e74c3c; } - + background-color: #e74c3c; +} .dropdown-item.dropdown-item-light { color: #fff; text-decoration: none; - background-color: #adb5bd; } - + background-color: #adb5bd; +} .dropdown-item.dropdown-item-outline-light:hover { color: #fff; - background-color: #adb5bd; } - + background-color: #adb5bd; +} .dropdown-item.dropdown-item-dark { color: #fff; text-decoration: none; - background-color: #303030; } - + background-color: #303030; +} .dropdown-item.dropdown-item-outline-dark:hover { color: #fff; - background-color: #303030; } + background-color: #303030; +} /* Progress Timeline */ .progress-timeline { - padding: 0.2em 0.2em 0.5em 0.2em; } - .progress-timeline ul { - position: relative; - padding: 0; } - .progress-timeline li { - list-style-type: none; - position: relative; } - .progress-timeline li.progress-inactive { - opacity: 0.5; } - .progress-timeline .progress-line { - height: 2px; } - .progress-timeline .progress-line.progress-inactive { - opacity: 0.5; } + padding: 0.2em 0.2em 0.5em 0.2em; +} +.progress-timeline ul { + position: relative; + padding: 0; +} +.progress-timeline li { + list-style-type: none; + position: relative; +} +.progress-timeline li.progress-inactive { + opacity: 0.5; +} +.progress-timeline .progress-line { + height: 2px; +} +.progress-timeline .progress-line.progress-inactive { + opacity: 0.5; +} /* Forms severity */ .form-control.is-invalid.info { - background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%233498db' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%233498db' stroke='none'/%3e%3c/svg%3e"); } - .form-control.is-invalid.info:focus { - border-color: #3498db; - box-shadow: 0 0 0 0.25rem rgba(52, 152, 219, 0.25); } - + background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%233498db' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%233498db' stroke='none'/%3e%3c/svg%3e"); +} +.form-control.is-invalid.info:focus { + border-color: #3498db; + box-shadow: 0 0 0 0.25rem rgba(52, 152, 219, 0.25); +} .form-control.is-invalid.warning { - background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23f39c12' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23f39c12' stroke='none'/%3e%3c/svg%3e"); } - .form-control.is-invalid.warning:focus { - border-color: #f39c12; - box-shadow: 0 0 0 0.25rem rgba(243, 156, 18, 0.25); } + background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23f39c12' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23f39c12' stroke='none'/%3e%3c/svg%3e"); +} +.form-control.is-invalid.warning:focus { + border-color: #f39c12; + box-shadow: 0 0 0 0.25rem rgba(243, 156, 18, 0.25); +} .form-select.is-invalid:not([multiple]):not([size]).info, -.form-select.is-invalid:not([multiple])[size="1"] -.form-select.is-invalid.info { +.form-select.is-invalid:not([multiple])[size="1"] .form-select.is-invalid.info { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%233498db'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%233498db' stroke='none'/%3e%3c/svg%3e"); - background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); } - .form-select.is-invalid:not([multiple]):not([size]).info:focus, - .form-select.is-invalid:not([multiple])[size="1"] -.form-select.is-invalid.info:focus { - box-shadow: 0 0 0 0.25rem rgba(52, 152, 219, 0.25); } - + background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); +} +.form-select.is-invalid:not([multiple]):not([size]).info:focus, +.form-select.is-invalid:not([multiple])[size="1"] .form-select.is-invalid.info:focus { + box-shadow: 0 0 0 0.25rem rgba(52, 152, 219, 0.25); +} .form-select.is-invalid:not([multiple]):not([size]).warning, -.form-select.is-invalid:not([multiple])[size="1"] -.form-select.is-invalid.warning { +.form-select.is-invalid:not([multiple])[size="1"] .form-select.is-invalid.warning { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23f39c12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23f39c12' stroke='none'/%3e%3c/svg%3e"); - background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); } - .form-select.is-invalid:not([multiple]):not([size]).warning:focus, - .form-select.is-invalid:not([multiple])[size="1"] -.form-select.is-invalid.warning:focus { - box-shadow: 0 0 0 0.25rem rgba(243, 156, 18, 0.25); } + background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); +} +.form-select.is-invalid:not([multiple]):not([size]).warning:focus, +.form-select.is-invalid:not([multiple])[size="1"] .form-select.is-invalid.warning:focus { + box-shadow: 0 0 0 0.25rem rgba(243, 156, 18, 0.25); +} .form-check-input.is-invalid.info { - border-color: #3498db; } - + border-color: #3498db; +} .form-check-input.is-invalid.info:checked { - background-color: #3498db; } - + background-color: #3498db; +} .form-check-input.is-invalid.info ~ .form-check-label { - color: unset; } - + color: unset; +} .form-check-input.is-invalid.info:focus { - box-shadow: 0 0 0 0.2rem rgba(52, 152, 219, 0.25); } - + box-shadow: 0 0 0 0.2rem rgba(52, 152, 219, 0.25); +} .form-check-input.is-invalid.warning { - border-color: #f39c12; } - + border-color: #f39c12; +} .form-check-input.is-invalid.warning:checked { - background-color: #f39c12; } - + background-color: #f39c12; +} .form-check-input.is-invalid.warning ~ .form-check-label { - color: unset; } - + color: unset; +} .form-check-input.is-invalid.warning:focus { - box-shadow: 0 0 0 0.2rem rgba(243, 156, 18, 0.25); } + box-shadow: 0 0 0 0.2rem rgba(243, 156, 18, 0.25); +} /* Utilities */ .mw-75 { - max-width: 75% !important; } + max-width: 75% !important; +} .mw-50 { - max-width: 50% !important; } + max-width: 50% !important; +} .mw-25 { - max-width: 25% !important; } + max-width: 25% !important; +} .mh-75 { - max-height: 75% !important; } + max-height: 75% !important; +} .mh-50 { - max-height: 50% !important; } + max-height: 50% !important; +} .mh-25 { - max-height: 25% !important; } + max-height: 25% !important; +} .p-abs-center-y { top: 50%; - transform: translateY(-50%); } + transform: translateY(-50%); +} .p-abs-center-x { left: 50%; - transform: translateX(-50%); } + transform: translateX(-50%); +} .p-abs-center-both { top: 50%; left: 50%; - transform: translateX(-50%) translateY(-50%); } + transform: translateX(-50%) translateY(-50%); +} /* Body */ body { @@ -290,87 +335,111 @@ body { /* background by SVGBackgrounds.com */ background-attachment: fixed; background-size: cover; - background-blend-mode: soft-light; } + background-blend-mode: soft-light; +} .panel { background-color: #363636; border: 1px solid #454545; - box-shadow: none; } + box-shadow: none; +} .loading-overlay { background-color: #222; - opacity: 0.65; } + opacity: 0.65; +} /* Top navbar */ .top-navbar { - background-color: #375a7f; } + background-color: #375a7f; +} .center-navbar nav.header-breadcrumb { - color: #fff; } + color: #fff; +} header.top-navbar .header-menu > a:hover, header.top-navbar .header-breadcrumb .header-breadcrumb-item > a:hover { - color: #d6d6d6 !important; } + color: #d6d6d6 !important; +} .top-navbar .center-navbar nav.header-breadcrumb li.header-breadcrumb-item a { - color: #fff; } + color: #fff; +} .top-navbar .right-navbar .header-menu a.nav-link { - color: #fff; } + color: #fff; +} .top-navbar .left-navbar .navbar-brand img { - filter: invert(1); } + filter: invert(1); +} .top-navbar .left-navbar .navbar-brand:hover img { - filter: invert(1) drop-shadow(0px 0px 3px #fff); } + filter: invert(1) drop-shadow(0px 0px 3px #fff); +} .top-navbar .composed-app-icon-container > .app-icon { - background-color: #fff; } + background-color: #fff; +} .breadcrumb-link-container { box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.16), 0 2px 6px 0 rgba(0, 0, 0, 0.12); - background-color: #adb5bd; } + background-color: #adb5bd; +} /* Sidebar */ .sidebar { - transition: width .08s linear; + transition: width 0.08s linear; box-shadow: none; - background-color: #444; } + background-color: #444; +} .sidebar ~ main.content:after { - background: #000; } + background: #000; +} .sidebar .sidebar-wrapper { - border-right: 1px solid none; } + border-right: 1px solid none; +} .sidebar .sidebar-wrapper { - border-right: 1px solid rgba(0, 0, 0, 0.125); } + border-right: 1px solid rgba(0, 0, 0, 0.125); +} .sidebar ul.sidebar-elements li > a.sidebar-link { - color: #fff; } + color: #fff; +} .sidebar ul.sidebar-elements li > a.sidebar-link.active { background-color: #595f64; - color: #fff; } + color: #fff; +} .sidebar ul.sidebar-elements li > a.sidebar-link.have-active-child { background-color: #595f64; - color: #fff; } + color: #fff; +} .sidebar ul.sidebar-elements li > a.sidebar-link:hover { background-color: #60676c; - color: #fff; } + color: #fff; +} .sidebar.expanded ul.sidebar-elements li > a.sidebar-link.have-active-child, .sidebar:hover ul.sidebar-elements li > a.sidebar-link.have-active-child { - background-color: unset; } + background-color: unset; +} .sidebar.expanded ul.sidebar-elements li > a.sidebar-link.have-active-child:hover, .sidebar:hover ul.sidebar-elements li > a.sidebar-link.have-active-child:hover { - background-color: #60676c; } + background-color: #60676c; +} ul.sidebar-elements li > a.sidebar-link.active::after { - background-color: var(--cerebrate-color); } + background-color: var(--cerebrate-color); +} .lock-sidebar > a.btn { - background-color: unset; } + background-color: unset; +} diff --git a/webroot/css/themes/theme-default.css b/webroot/css/themes/theme-default.css index d826d86..a43c429 100644 --- a/webroot/css/themes/theme-default.css +++ b/webroot/css/themes/theme-default.css @@ -1,287 +1,332 @@ /* Callout */ .callout { border: 1px solid #e9ecef; - border-radius: .25rem; + border-radius: 0.25rem; background-color: #fff; - box-shadow: 0 0 35px 0 rgba(154, 161, 171, 0.25); } + box-shadow: 0 0 35px 0 rgba(154, 161, 171, 0.25); +} .callout-primary { border-left-color: #0d6efd; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-secondary { border-left-color: #6c757d; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-success { border-left-color: #198754; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-info { border-left-color: #0dcaf0; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-warning { border-left-color: #ffc107; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-danger { border-left-color: #dc3545; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-light { border-left-color: #f8f9fa; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-dark { border-left-color: #212529; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} /* Toasts */ .toast { - min-width: 250px; } + min-width: 250px; +} .toast-primary { color: #04214c; background-color: #b6d4fe; - border-color: #9ec5fe; } - .toast-primary strong { - border-top-color: #85b6fe; } + border-color: #9ec5fe; +} +.toast-primary strong { + border-top-color: #85b6fe; +} .toast-secondary { color: #202326; background-color: #d3d6d8; - border-color: #c4c8cb; } - .toast-secondary strong { - border-top-color: #b6bbbf; } + border-color: #c4c8cb; +} +.toast-secondary strong { + border-top-color: #b6bbbf; +} .toast-success { color: #082919; background-color: #badbcc; - border-color: #a3cfbb; } - .toast-success strong { - border-top-color: #92c6af; } + border-color: #a3cfbb; +} +.toast-success strong { + border-top-color: #92c6af; +} .toast-info { color: #043d48; background-color: #b6effb; - border-color: #9eeaf9; } - .toast-info strong { - border-top-color: #86e5f8; } + border-color: #9eeaf9; +} +.toast-info strong { + border-top-color: #86e5f8; +} .toast-warning { color: #4d3a02; background-color: #ffecb5; - border-color: #ffe69c; } - .toast-warning strong { - border-top-color: #ffe083; } + border-color: #ffe69c; +} +.toast-warning strong { + border-top-color: #ffe083; +} .toast-danger { color: #421015; background-color: #f5c2c7; - border-color: #f1aeb5; } - .toast-danger strong { - border-top-color: #ed98a1; } + border-color: #f1aeb5; +} +.toast-danger strong { + border-top-color: #ed98a1; +} .toast-light { color: #4a4b4b; background-color: #fdfdfe; - border-color: #fcfdfd; } - .toast-light strong { - border-top-color: #edf3f3; } + border-color: #fcfdfd; +} +.toast-light strong { + border-top-color: #edf3f3; +} .toast-dark { color: #0a0b0c; background-color: #bcbebf; - border-color: #a6a8a9; } - .toast-dark strong { - border-top-color: #999b9c; } + border-color: #a6a8a9; +} +.toast-dark strong { + border-top-color: #999b9c; +} /* Dropdown-item */ .dropdown-item.dropdown-item-primary { color: #fff; text-decoration: none; - background-color: #0d6efd; } - + background-color: #0d6efd; +} .dropdown-item.dropdown-item-outline-primary:hover { color: #fff; - background-color: #0d6efd; } - + background-color: #0d6efd; +} .dropdown-item.dropdown-item-secondary { color: #fff; text-decoration: none; - background-color: #6c757d; } - + background-color: #6c757d; +} .dropdown-item.dropdown-item-outline-secondary:hover { color: #fff; - background-color: #6c757d; } - + background-color: #6c757d; +} .dropdown-item.dropdown-item-success { color: #fff; text-decoration: none; - background-color: #198754; } - + background-color: #198754; +} .dropdown-item.dropdown-item-outline-success:hover { color: #fff; - background-color: #198754; } - + background-color: #198754; +} .dropdown-item.dropdown-item-info { color: #000; text-decoration: none; - background-color: #0dcaf0; } - + background-color: #0dcaf0; +} .dropdown-item.dropdown-item-outline-info:hover { color: #000; - background-color: #0dcaf0; } - + background-color: #0dcaf0; +} .dropdown-item.dropdown-item-warning { color: #000; text-decoration: none; - background-color: #ffc107; } - + background-color: #ffc107; +} .dropdown-item.dropdown-item-outline-warning:hover { color: #000; - background-color: #ffc107; } - + background-color: #ffc107; +} .dropdown-item.dropdown-item-danger { color: #fff; text-decoration: none; - background-color: #dc3545; } - + background-color: #dc3545; +} .dropdown-item.dropdown-item-outline-danger:hover { color: #fff; - background-color: #dc3545; } - + background-color: #dc3545; +} .dropdown-item.dropdown-item-light { color: #000; text-decoration: none; - background-color: #f8f9fa; } - + background-color: #f8f9fa; +} .dropdown-item.dropdown-item-outline-light:hover { color: #000; - background-color: #f8f9fa; } - + background-color: #f8f9fa; +} .dropdown-item.dropdown-item-dark { color: #fff; text-decoration: none; - background-color: #212529; } - + background-color: #212529; +} .dropdown-item.dropdown-item-outline-dark:hover { color: #fff; - background-color: #212529; } + background-color: #212529; +} /* Progress Timeline */ .progress-timeline { - padding: 0.2em 0.2em 0.5em 0.2em; } - .progress-timeline ul { - position: relative; - padding: 0; } - .progress-timeline li { - list-style-type: none; - position: relative; } - .progress-timeline li.progress-inactive { - opacity: 0.5; } - .progress-timeline .progress-line { - height: 2px; } - .progress-timeline .progress-line.progress-inactive { - opacity: 0.5; } + padding: 0.2em 0.2em 0.5em 0.2em; +} +.progress-timeline ul { + position: relative; + padding: 0; +} +.progress-timeline li { + list-style-type: none; + position: relative; +} +.progress-timeline li.progress-inactive { + opacity: 0.5; +} +.progress-timeline .progress-line { + height: 2px; +} +.progress-timeline .progress-line.progress-inactive { + opacity: 0.5; +} /* Forms severity */ .form-control.is-invalid.info { - background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%230dcaf0' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%230dcaf0' stroke='none'/%3e%3c/svg%3e"); } - .form-control.is-invalid.info:focus { - border-color: #0dcaf0; - box-shadow: 0 0 0 0.25rem rgba(13, 202, 240, 0.25); } - + background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%230dcaf0' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%230dcaf0' stroke='none'/%3e%3c/svg%3e"); +} +.form-control.is-invalid.info:focus { + border-color: #0dcaf0; + box-shadow: 0 0 0 0.25rem rgba(13, 202, 240, 0.25); +} .form-control.is-invalid.warning { - background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23ffc107' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23ffc107' stroke='none'/%3e%3c/svg%3e"); } - .form-control.is-invalid.warning:focus { - border-color: #ffc107; - box-shadow: 0 0 0 0.25rem rgba(255, 193, 7, 0.25); } + background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23ffc107' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23ffc107' stroke='none'/%3e%3c/svg%3e"); +} +.form-control.is-invalid.warning:focus { + border-color: #ffc107; + box-shadow: 0 0 0 0.25rem rgba(255, 193, 7, 0.25); +} .form-select.is-invalid:not([multiple]):not([size]).info, -.form-select.is-invalid:not([multiple])[size="1"] -.form-select.is-invalid.info { +.form-select.is-invalid:not([multiple])[size="1"] .form-select.is-invalid.info { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%230dcaf0'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%230dcaf0' stroke='none'/%3e%3c/svg%3e"); - background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); } - .form-select.is-invalid:not([multiple]):not([size]).info:focus, - .form-select.is-invalid:not([multiple])[size="1"] -.form-select.is-invalid.info:focus { - box-shadow: 0 0 0 0.25rem rgba(13, 202, 240, 0.25); } - + background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); +} +.form-select.is-invalid:not([multiple]):not([size]).info:focus, +.form-select.is-invalid:not([multiple])[size="1"] .form-select.is-invalid.info:focus { + box-shadow: 0 0 0 0.25rem rgba(13, 202, 240, 0.25); +} .form-select.is-invalid:not([multiple]):not([size]).warning, -.form-select.is-invalid:not([multiple])[size="1"] -.form-select.is-invalid.warning { +.form-select.is-invalid:not([multiple])[size="1"] .form-select.is-invalid.warning { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23ffc107'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23ffc107' stroke='none'/%3e%3c/svg%3e"); - background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); } - .form-select.is-invalid:not([multiple]):not([size]).warning:focus, - .form-select.is-invalid:not([multiple])[size="1"] -.form-select.is-invalid.warning:focus { - box-shadow: 0 0 0 0.25rem rgba(255, 193, 7, 0.25); } + background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); +} +.form-select.is-invalid:not([multiple]):not([size]).warning:focus, +.form-select.is-invalid:not([multiple])[size="1"] .form-select.is-invalid.warning:focus { + box-shadow: 0 0 0 0.25rem rgba(255, 193, 7, 0.25); +} .form-check-input.is-invalid.info { - border-color: #0dcaf0; } - + border-color: #0dcaf0; +} .form-check-input.is-invalid.info:checked { - background-color: #0dcaf0; } - + background-color: #0dcaf0; +} .form-check-input.is-invalid.info ~ .form-check-label { - color: unset; } - + color: unset; +} .form-check-input.is-invalid.info:focus { - box-shadow: 0 0 0 0.2rem rgba(13, 202, 240, 0.25); } - + box-shadow: 0 0 0 0.2rem rgba(13, 202, 240, 0.25); +} .form-check-input.is-invalid.warning { - border-color: #ffc107; } - + border-color: #ffc107; +} .form-check-input.is-invalid.warning:checked { - background-color: #ffc107; } - + background-color: #ffc107; +} .form-check-input.is-invalid.warning ~ .form-check-label { - color: unset; } - + color: unset; +} .form-check-input.is-invalid.warning:focus { - box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.25); } + box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.25); +} /* Utilities */ .mw-75 { - max-width: 75% !important; } + max-width: 75% !important; +} .mw-50 { - max-width: 50% !important; } + max-width: 50% !important; +} .mw-25 { - max-width: 25% !important; } + max-width: 25% !important; +} .mh-75 { - max-height: 75% !important; } + max-height: 75% !important; +} .mh-50 { - max-height: 50% !important; } + max-height: 50% !important; +} .mh-25 { - max-height: 25% !important; } + max-height: 25% !important; +} .p-abs-center-y { top: 50%; - transform: translateY(-50%); } + transform: translateY(-50%); +} .p-abs-center-x { left: 50%; - transform: translateX(-50%); } + transform: translateX(-50%); +} .p-abs-center-both { top: 50%; left: 50%; - transform: translateX(-50%) translateY(-50%); } + transform: translateX(-50%) translateY(-50%); +} /* Body */ body { @@ -290,87 +335,111 @@ body { /* background by SVGBackgrounds.com */ background-attachment: fixed; background-size: cover; - background-blend-mode: normal; } + background-blend-mode: normal; +} .panel { background-color: #fff; border: none; - box-shadow: 0 0 35px 0 rgba(154, 161, 171, 0.25); } + box-shadow: 0 0 35px 0 rgba(154, 161, 171, 0.25); +} .loading-overlay { background-color: #f8f9fa; - opacity: 0.75; } + opacity: 0.75; +} /* Top navbar */ .top-navbar { - background-color: #212529; } + background-color: #212529; +} .center-navbar nav.header-breadcrumb { - color: #fff; } + color: #fff; +} header.top-navbar .header-menu > a:hover, header.top-navbar .header-breadcrumb .header-breadcrumb-item > a:hover { - color: #d6d6d6 !important; } + color: #d6d6d6 !important; +} .top-navbar .center-navbar nav.header-breadcrumb li.header-breadcrumb-item a { - color: #fff; } + color: #fff; +} .top-navbar .right-navbar .header-menu a.nav-link { - color: #fff; } + color: #fff; +} .top-navbar .left-navbar .navbar-brand img { - filter: invert(1); } + filter: invert(1); +} .top-navbar .left-navbar .navbar-brand:hover img { - filter: invert(1) drop-shadow(0px 0px 3px #fff); } + filter: invert(1) drop-shadow(0px 0px 3px #fff); +} .top-navbar .composed-app-icon-container > .app-icon { - background-color: #fff; } + background-color: #fff; +} .breadcrumb-link-container { box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.16), 0 2px 6px 0 rgba(0, 0, 0, 0.12); - background-color: #f8f9fa; } + background-color: #f8f9fa; +} /* Sidebar */ .sidebar { - transition: width .08s linear; + transition: width 0.08s linear; box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.16), 0 2px 6px 0 rgba(0, 0, 0, 0.12); - background-color: #f8f9fa; } + background-color: #f8f9fa; +} .sidebar ~ main.content:after { - background: #000; } + background: #000; +} .sidebar .sidebar-wrapper { - border-right: 1px solid #ddd; } + border-right: 1px solid #ddd; +} .sidebar .sidebar-wrapper { - border-right: 1px solid rgba(0, 0, 0, 0.125); } + border-right: 1px solid rgba(0, 0, 0, 0.125); +} .sidebar ul.sidebar-elements li > a.sidebar-link { - color: #000; } + color: #000; +} .sidebar ul.sidebar-elements li > a.sidebar-link.active { background-color: #dbdbdb; - color: #000; } + color: #000; +} .sidebar ul.sidebar-elements li > a.sidebar-link.have-active-child { background-color: #dbdbdb; - color: #000; } + color: #000; +} .sidebar ul.sidebar-elements li > a.sidebar-link:hover { background-color: #ebebeb; - color: #000; } + color: #000; +} .sidebar.expanded ul.sidebar-elements li > a.sidebar-link.have-active-child, .sidebar:hover ul.sidebar-elements li > a.sidebar-link.have-active-child { - background-color: unset; } + background-color: unset; +} .sidebar.expanded ul.sidebar-elements li > a.sidebar-link.have-active-child:hover, .sidebar:hover ul.sidebar-elements li > a.sidebar-link.have-active-child:hover { - background-color: #ebebeb; } + background-color: #ebebeb; +} ul.sidebar-elements li > a.sidebar-link.active::after { - background-color: var(--cerebrate-color); } + background-color: var(--cerebrate-color); +} .lock-sidebar > a.btn { - background-color: #f8f9fa; } + background-color: #f8f9fa; +} diff --git a/webroot/css/themes/theme-flatly.css b/webroot/css/themes/theme-flatly.css index c94d649..50fbfd9 100644 --- a/webroot/css/themes/theme-flatly.css +++ b/webroot/css/themes/theme-flatly.css @@ -1,287 +1,332 @@ /* Callout */ .callout { border: 1px solid #ecf0f1; - border-radius: .25rem; + border-radius: 0.25rem; background-color: #fff; - box-shadow: 0 0 35px 0 rgba(154, 161, 171, 0.25); } + box-shadow: 0 0 35px 0 rgba(154, 161, 171, 0.25); +} .callout-primary { border-left-color: #2c3e50; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-secondary { border-left-color: #95a5a6; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-success { border-left-color: #18bc9c; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-info { border-left-color: #3498db; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-warning { border-left-color: #f39c12; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-danger { border-left-color: #e74c3c; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-light { border-left-color: #ecf0f1; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-dark { border-left-color: #7b8a8b; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} /* Toasts */ .toast { - min-width: 250px; } + min-width: 250px; +} .toast-primary { color: #0d1318; background-color: #c0c5cb; - border-color: #abb2b9; } - .toast-primary strong { - border-top-color: #9da5ad; } + border-color: #abb2b9; +} +.toast-primary strong { + border-top-color: #9da5ad; +} .toast-secondary { color: #2d3232; background-color: #dfe4e4; - border-color: #d5dbdb; } - .toast-secondary strong { - border-top-color: #c7cfcf; } + border-color: #d5dbdb; +} +.toast-secondary strong { + border-top-color: #c7cfcf; +} .toast-success { color: #07382f; background-color: #baebe1; - border-color: #a3e4d7; } - .toast-success strong { - border-top-color: #8fdece; } + border-color: #a3e4d7; +} +.toast-success strong { + border-top-color: #8fdece; +} .toast-info { color: #102e42; background-color: #c2e0f4; - border-color: #aed6f1; } - .toast-info strong { - border-top-color: #98cbed; } + border-color: #aed6f1; +} +.toast-info strong { + border-top-color: #98cbed; +} .toast-warning { color: #492f05; background-color: #fbe1b8; - border-color: #fad7a0; } - .toast-warning strong { - border-top-color: #f9cd88; } + border-color: #fad7a0; +} +.toast-warning strong { + border-top-color: #f9cd88; +} .toast-danger { color: #451712; background-color: #f8c9c5; - border-color: #f5b7b1; } - .toast-danger strong { - border-top-color: #f2a29a; } + border-color: #f5b7b1; +} +.toast-danger strong { + border-top-color: #f2a29a; +} .toast-light { color: #474848; background-color: #f9fbfb; - border-color: #f7f9f9; } - .toast-light strong { - border-top-color: #e8eeee; } + border-color: #f7f9f9; +} +.toast-light strong { + border-top-color: #e8eeee; +} .toast-dark { color: #25292a; background-color: #d7dcdc; - border-color: #cad0d1; } - .toast-dark strong { - border-top-color: #bcc4c5; } + border-color: #cad0d1; +} +.toast-dark strong { + border-top-color: #bcc4c5; +} /* Dropdown-item */ .dropdown-item.dropdown-item-primary { color: #fff; text-decoration: none; - background-color: #2c3e50; } - + background-color: #2c3e50; +} .dropdown-item.dropdown-item-outline-primary:hover { color: #fff; - background-color: #2c3e50; } - + background-color: #2c3e50; +} .dropdown-item.dropdown-item-secondary { color: #fff; text-decoration: none; - background-color: #95a5a6; } - + background-color: #95a5a6; +} .dropdown-item.dropdown-item-outline-secondary:hover { color: #fff; - background-color: #95a5a6; } - + background-color: #95a5a6; +} .dropdown-item.dropdown-item-success { color: #fff; text-decoration: none; - background-color: #18bc9c; } - + background-color: #18bc9c; +} .dropdown-item.dropdown-item-outline-success:hover { color: #fff; - background-color: #18bc9c; } - + background-color: #18bc9c; +} .dropdown-item.dropdown-item-info { color: #fff; text-decoration: none; - background-color: #3498db; } - + background-color: #3498db; +} .dropdown-item.dropdown-item-outline-info:hover { color: #fff; - background-color: #3498db; } - + background-color: #3498db; +} .dropdown-item.dropdown-item-warning { color: #fff; text-decoration: none; - background-color: #f39c12; } - + background-color: #f39c12; +} .dropdown-item.dropdown-item-outline-warning:hover { color: #fff; - background-color: #f39c12; } - + background-color: #f39c12; +} .dropdown-item.dropdown-item-danger { color: #fff; text-decoration: none; - background-color: #e74c3c; } - + background-color: #e74c3c; +} .dropdown-item.dropdown-item-outline-danger:hover { color: #fff; - background-color: #e74c3c; } - + background-color: #e74c3c; +} .dropdown-item.dropdown-item-light { color: #000; text-decoration: none; - background-color: #ecf0f1; } - + background-color: #ecf0f1; +} .dropdown-item.dropdown-item-outline-light:hover { color: #000; - background-color: #ecf0f1; } - + background-color: #ecf0f1; +} .dropdown-item.dropdown-item-dark { color: #fff; text-decoration: none; - background-color: #7b8a8b; } - + background-color: #7b8a8b; +} .dropdown-item.dropdown-item-outline-dark:hover { color: #fff; - background-color: #7b8a8b; } + background-color: #7b8a8b; +} /* Progress Timeline */ .progress-timeline { - padding: 0.2em 0.2em 0.5em 0.2em; } - .progress-timeline ul { - position: relative; - padding: 0; } - .progress-timeline li { - list-style-type: none; - position: relative; } - .progress-timeline li.progress-inactive { - opacity: 0.5; } - .progress-timeline .progress-line { - height: 2px; } - .progress-timeline .progress-line.progress-inactive { - opacity: 0.5; } + padding: 0.2em 0.2em 0.5em 0.2em; +} +.progress-timeline ul { + position: relative; + padding: 0; +} +.progress-timeline li { + list-style-type: none; + position: relative; +} +.progress-timeline li.progress-inactive { + opacity: 0.5; +} +.progress-timeline .progress-line { + height: 2px; +} +.progress-timeline .progress-line.progress-inactive { + opacity: 0.5; +} /* Forms severity */ .form-control.is-invalid.info { - background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%233498db' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%233498db' stroke='none'/%3e%3c/svg%3e"); } - .form-control.is-invalid.info:focus { - border-color: #3498db; - box-shadow: 0 0 0 0.25rem rgba(52, 152, 219, 0.25); } - + background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%233498db' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%233498db' stroke='none'/%3e%3c/svg%3e"); +} +.form-control.is-invalid.info:focus { + border-color: #3498db; + box-shadow: 0 0 0 0.25rem rgba(52, 152, 219, 0.25); +} .form-control.is-invalid.warning { - background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23f39c12' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23f39c12' stroke='none'/%3e%3c/svg%3e"); } - .form-control.is-invalid.warning:focus { - border-color: #f39c12; - box-shadow: 0 0 0 0.25rem rgba(243, 156, 18, 0.25); } + background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23f39c12' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23f39c12' stroke='none'/%3e%3c/svg%3e"); +} +.form-control.is-invalid.warning:focus { + border-color: #f39c12; + box-shadow: 0 0 0 0.25rem rgba(243, 156, 18, 0.25); +} .form-select.is-invalid:not([multiple]):not([size]).info, -.form-select.is-invalid:not([multiple])[size="1"] -.form-select.is-invalid.info { +.form-select.is-invalid:not([multiple])[size="1"] .form-select.is-invalid.info { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%233498db'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%233498db' stroke='none'/%3e%3c/svg%3e"); - background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); } - .form-select.is-invalid:not([multiple]):not([size]).info:focus, - .form-select.is-invalid:not([multiple])[size="1"] -.form-select.is-invalid.info:focus { - box-shadow: 0 0 0 0.25rem rgba(52, 152, 219, 0.25); } - + background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); +} +.form-select.is-invalid:not([multiple]):not([size]).info:focus, +.form-select.is-invalid:not([multiple])[size="1"] .form-select.is-invalid.info:focus { + box-shadow: 0 0 0 0.25rem rgba(52, 152, 219, 0.25); +} .form-select.is-invalid:not([multiple]):not([size]).warning, -.form-select.is-invalid:not([multiple])[size="1"] -.form-select.is-invalid.warning { +.form-select.is-invalid:not([multiple])[size="1"] .form-select.is-invalid.warning { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23f39c12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23f39c12' stroke='none'/%3e%3c/svg%3e"); - background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); } - .form-select.is-invalid:not([multiple]):not([size]).warning:focus, - .form-select.is-invalid:not([multiple])[size="1"] -.form-select.is-invalid.warning:focus { - box-shadow: 0 0 0 0.25rem rgba(243, 156, 18, 0.25); } + background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); +} +.form-select.is-invalid:not([multiple]):not([size]).warning:focus, +.form-select.is-invalid:not([multiple])[size="1"] .form-select.is-invalid.warning:focus { + box-shadow: 0 0 0 0.25rem rgba(243, 156, 18, 0.25); +} .form-check-input.is-invalid.info { - border-color: #3498db; } - + border-color: #3498db; +} .form-check-input.is-invalid.info:checked { - background-color: #3498db; } - + background-color: #3498db; +} .form-check-input.is-invalid.info ~ .form-check-label { - color: unset; } - + color: unset; +} .form-check-input.is-invalid.info:focus { - box-shadow: 0 0 0 0.2rem rgba(52, 152, 219, 0.25); } - + box-shadow: 0 0 0 0.2rem rgba(52, 152, 219, 0.25); +} .form-check-input.is-invalid.warning { - border-color: #f39c12; } - + border-color: #f39c12; +} .form-check-input.is-invalid.warning:checked { - background-color: #f39c12; } - + background-color: #f39c12; +} .form-check-input.is-invalid.warning ~ .form-check-label { - color: unset; } - + color: unset; +} .form-check-input.is-invalid.warning:focus { - box-shadow: 0 0 0 0.2rem rgba(243, 156, 18, 0.25); } + box-shadow: 0 0 0 0.2rem rgba(243, 156, 18, 0.25); +} /* Utilities */ .mw-75 { - max-width: 75% !important; } + max-width: 75% !important; +} .mw-50 { - max-width: 50% !important; } + max-width: 50% !important; +} .mw-25 { - max-width: 25% !important; } + max-width: 25% !important; +} .mh-75 { - max-height: 75% !important; } + max-height: 75% !important; +} .mh-50 { - max-height: 50% !important; } + max-height: 50% !important; +} .mh-25 { - max-height: 25% !important; } + max-height: 25% !important; +} .p-abs-center-y { top: 50%; - transform: translateY(-50%); } + transform: translateY(-50%); +} .p-abs-center-x { left: 50%; - transform: translateX(-50%); } + transform: translateX(-50%); +} .p-abs-center-both { top: 50%; left: 50%; - transform: translateX(-50%) translateY(-50%); } + transform: translateX(-50%) translateY(-50%); +} /* Body */ body { @@ -290,87 +335,111 @@ body { /* background by SVGBackgrounds.com */ background-attachment: fixed; background-size: cover; - background-blend-mode: normal; } + background-blend-mode: normal; +} .panel { background-color: #fff; border: none; - box-shadow: 0 0 35px 0 rgba(154, 161, 171, 0.25); } + box-shadow: 0 0 35px 0 rgba(154, 161, 171, 0.25); +} .loading-overlay { background-color: #ecf0f1; - opacity: 0.75; } + opacity: 0.75; +} /* Top navbar */ .top-navbar { - background-color: #2c3e50; } + background-color: #2c3e50; +} .center-navbar nav.header-breadcrumb { - color: #fff; } + color: #fff; +} header.top-navbar .header-menu > a:hover, header.top-navbar .header-breadcrumb .header-breadcrumb-item > a:hover { - color: #d6d6d6 !important; } + color: #d6d6d6 !important; +} .top-navbar .center-navbar nav.header-breadcrumb li.header-breadcrumb-item a { - color: #fff; } + color: #fff; +} .top-navbar .right-navbar .header-menu a.nav-link { - color: #fff; } + color: #fff; +} .top-navbar .left-navbar .navbar-brand img { - filter: invert(1); } + filter: invert(1); +} .top-navbar .left-navbar .navbar-brand:hover img { - filter: invert(1) drop-shadow(0px 0px 3px #fff); } + filter: invert(1) drop-shadow(0px 0px 3px #fff); +} .top-navbar .composed-app-icon-container > .app-icon { - background-color: #fff; } + background-color: #fff; +} .breadcrumb-link-container { box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.16), 0 2px 6px 0 rgba(0, 0, 0, 0.12); - background-color: #ecf0f1; } + background-color: #ecf0f1; +} /* Sidebar */ .sidebar { - transition: width .08s linear; + transition: width 0.08s linear; box-shadow: none; - background-color: #ecf0f1; } + background-color: #ecf0f1; +} .sidebar ~ main.content:after { - background: #000; } + background: #000; +} .sidebar .sidebar-wrapper { - border-right: 1px solid none; } + border-right: 1px solid none; +} .sidebar .sidebar-wrapper { - border-right: 1px solid rgba(0, 0, 0, 0.125); } + border-right: 1px solid rgba(0, 0, 0, 0.125); +} .sidebar ul.sidebar-elements li > a.sidebar-link { - color: #000; } + color: #000; +} .sidebar ul.sidebar-elements li > a.sidebar-link.active { background-color: #dbdbdb; - color: #18bc9c; } + color: #18bc9c; +} .sidebar ul.sidebar-elements li > a.sidebar-link.have-active-child { background-color: #dbdbdb; - color: #18bc9c; } + color: #18bc9c; +} .sidebar ul.sidebar-elements li > a.sidebar-link:hover { background-color: #ebebeb; - color: #18bc9c; } + color: #18bc9c; +} .sidebar.expanded ul.sidebar-elements li > a.sidebar-link.have-active-child, .sidebar:hover ul.sidebar-elements li > a.sidebar-link.have-active-child { - background-color: unset; } + background-color: unset; +} .sidebar.expanded ul.sidebar-elements li > a.sidebar-link.have-active-child:hover, .sidebar:hover ul.sidebar-elements li > a.sidebar-link.have-active-child:hover { - background-color: #ebebeb; } + background-color: #ebebeb; +} ul.sidebar-elements li > a.sidebar-link.active::after { - background-color: #18bc9c; } + background-color: #18bc9c; +} .lock-sidebar > a.btn { - background-color: unset; } + background-color: unset; +} diff --git a/webroot/css/themes/theme-minty.css b/webroot/css/themes/theme-minty.css index 6948503..c003c4b 100644 --- a/webroot/css/themes/theme-minty.css +++ b/webroot/css/themes/theme-minty.css @@ -1,287 +1,332 @@ /* Callout */ .callout { border: 1px solid #ecf0f1; - border-radius: .25rem; + border-radius: 0.25rem; background-color: #fff; - box-shadow: 0 0 35px 0 rgba(154, 161, 171, 0.25); } + box-shadow: 0 0 35px 0 rgba(154, 161, 171, 0.25); +} .callout-primary { border-left-color: #2c3e50; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-secondary { border-left-color: #95a5a6; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-success { border-left-color: #18bc9c; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-info { border-left-color: #3498db; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-warning { border-left-color: #f39c12; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-danger { border-left-color: #e74c3c; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-light { border-left-color: #ecf0f1; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-dark { border-left-color: #7b8a8b; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} /* Toasts */ .toast { - min-width: 250px; } + min-width: 250px; +} .toast-primary { color: #0d1318; background-color: #c0c5cb; - border-color: #abb2b9; } - .toast-primary strong { - border-top-color: #9da5ad; } + border-color: #abb2b9; +} +.toast-primary strong { + border-top-color: #9da5ad; +} .toast-secondary { color: #2d3232; background-color: #dfe4e4; - border-color: #d5dbdb; } - .toast-secondary strong { - border-top-color: #c7cfcf; } + border-color: #d5dbdb; +} +.toast-secondary strong { + border-top-color: #c7cfcf; +} .toast-success { color: #07382f; background-color: #baebe1; - border-color: #a3e4d7; } - .toast-success strong { - border-top-color: #8fdece; } + border-color: #a3e4d7; +} +.toast-success strong { + border-top-color: #8fdece; +} .toast-info { color: #102e42; background-color: #c2e0f4; - border-color: #aed6f1; } - .toast-info strong { - border-top-color: #98cbed; } + border-color: #aed6f1; +} +.toast-info strong { + border-top-color: #98cbed; +} .toast-warning { color: #492f05; background-color: #fbe1b8; - border-color: #fad7a0; } - .toast-warning strong { - border-top-color: #f9cd88; } + border-color: #fad7a0; +} +.toast-warning strong { + border-top-color: #f9cd88; +} .toast-danger { color: #451712; background-color: #f8c9c5; - border-color: #f5b7b1; } - .toast-danger strong { - border-top-color: #f2a29a; } + border-color: #f5b7b1; +} +.toast-danger strong { + border-top-color: #f2a29a; +} .toast-light { color: #474848; background-color: #f9fbfb; - border-color: #f7f9f9; } - .toast-light strong { - border-top-color: #e8eeee; } + border-color: #f7f9f9; +} +.toast-light strong { + border-top-color: #e8eeee; +} .toast-dark { color: #25292a; background-color: #d7dcdc; - border-color: #cad0d1; } - .toast-dark strong { - border-top-color: #bcc4c5; } + border-color: #cad0d1; +} +.toast-dark strong { + border-top-color: #bcc4c5; +} /* Dropdown-item */ .dropdown-item.dropdown-item-primary { color: #fff; text-decoration: none; - background-color: #2c3e50; } - + background-color: #2c3e50; +} .dropdown-item.dropdown-item-outline-primary:hover { color: #fff; - background-color: #2c3e50; } - + background-color: #2c3e50; +} .dropdown-item.dropdown-item-secondary { color: #fff; text-decoration: none; - background-color: #95a5a6; } - + background-color: #95a5a6; +} .dropdown-item.dropdown-item-outline-secondary:hover { color: #fff; - background-color: #95a5a6; } - + background-color: #95a5a6; +} .dropdown-item.dropdown-item-success { color: #fff; text-decoration: none; - background-color: #18bc9c; } - + background-color: #18bc9c; +} .dropdown-item.dropdown-item-outline-success:hover { color: #fff; - background-color: #18bc9c; } - + background-color: #18bc9c; +} .dropdown-item.dropdown-item-info { color: #fff; text-decoration: none; - background-color: #3498db; } - + background-color: #3498db; +} .dropdown-item.dropdown-item-outline-info:hover { color: #fff; - background-color: #3498db; } - + background-color: #3498db; +} .dropdown-item.dropdown-item-warning { color: #fff; text-decoration: none; - background-color: #f39c12; } - + background-color: #f39c12; +} .dropdown-item.dropdown-item-outline-warning:hover { color: #fff; - background-color: #f39c12; } - + background-color: #f39c12; +} .dropdown-item.dropdown-item-danger { color: #fff; text-decoration: none; - background-color: #e74c3c; } - + background-color: #e74c3c; +} .dropdown-item.dropdown-item-outline-danger:hover { color: #fff; - background-color: #e74c3c; } - + background-color: #e74c3c; +} .dropdown-item.dropdown-item-light { color: #000; text-decoration: none; - background-color: #ecf0f1; } - + background-color: #ecf0f1; +} .dropdown-item.dropdown-item-outline-light:hover { color: #000; - background-color: #ecf0f1; } - + background-color: #ecf0f1; +} .dropdown-item.dropdown-item-dark { color: #fff; text-decoration: none; - background-color: #7b8a8b; } - + background-color: #7b8a8b; +} .dropdown-item.dropdown-item-outline-dark:hover { color: #fff; - background-color: #7b8a8b; } + background-color: #7b8a8b; +} /* Progress Timeline */ .progress-timeline { - padding: 0.2em 0.2em 0.5em 0.2em; } - .progress-timeline ul { - position: relative; - padding: 0; } - .progress-timeline li { - list-style-type: none; - position: relative; } - .progress-timeline li.progress-inactive { - opacity: 0.5; } - .progress-timeline .progress-line { - height: 2px; } - .progress-timeline .progress-line.progress-inactive { - opacity: 0.5; } + padding: 0.2em 0.2em 0.5em 0.2em; +} +.progress-timeline ul { + position: relative; + padding: 0; +} +.progress-timeline li { + list-style-type: none; + position: relative; +} +.progress-timeline li.progress-inactive { + opacity: 0.5; +} +.progress-timeline .progress-line { + height: 2px; +} +.progress-timeline .progress-line.progress-inactive { + opacity: 0.5; +} /* Forms severity */ .form-control.is-invalid.info { - background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%233498db' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%233498db' stroke='none'/%3e%3c/svg%3e"); } - .form-control.is-invalid.info:focus { - border-color: #3498db; - box-shadow: 0 0 0 0.25rem rgba(52, 152, 219, 0.25); } - + background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%233498db' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%233498db' stroke='none'/%3e%3c/svg%3e"); +} +.form-control.is-invalid.info:focus { + border-color: #3498db; + box-shadow: 0 0 0 0.25rem rgba(52, 152, 219, 0.25); +} .form-control.is-invalid.warning { - background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23f39c12' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23f39c12' stroke='none'/%3e%3c/svg%3e"); } - .form-control.is-invalid.warning:focus { - border-color: #f39c12; - box-shadow: 0 0 0 0.25rem rgba(243, 156, 18, 0.25); } + background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23f39c12' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23f39c12' stroke='none'/%3e%3c/svg%3e"); +} +.form-control.is-invalid.warning:focus { + border-color: #f39c12; + box-shadow: 0 0 0 0.25rem rgba(243, 156, 18, 0.25); +} .form-select.is-invalid:not([multiple]):not([size]).info, -.form-select.is-invalid:not([multiple])[size="1"] -.form-select.is-invalid.info { +.form-select.is-invalid:not([multiple])[size="1"] .form-select.is-invalid.info { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%233498db'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%233498db' stroke='none'/%3e%3c/svg%3e"); - background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); } - .form-select.is-invalid:not([multiple]):not([size]).info:focus, - .form-select.is-invalid:not([multiple])[size="1"] -.form-select.is-invalid.info:focus { - box-shadow: 0 0 0 0.25rem rgba(52, 152, 219, 0.25); } - + background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); +} +.form-select.is-invalid:not([multiple]):not([size]).info:focus, +.form-select.is-invalid:not([multiple])[size="1"] .form-select.is-invalid.info:focus { + box-shadow: 0 0 0 0.25rem rgba(52, 152, 219, 0.25); +} .form-select.is-invalid:not([multiple]):not([size]).warning, -.form-select.is-invalid:not([multiple])[size="1"] -.form-select.is-invalid.warning { +.form-select.is-invalid:not([multiple])[size="1"] .form-select.is-invalid.warning { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23f39c12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23f39c12' stroke='none'/%3e%3c/svg%3e"); - background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); } - .form-select.is-invalid:not([multiple]):not([size]).warning:focus, - .form-select.is-invalid:not([multiple])[size="1"] -.form-select.is-invalid.warning:focus { - box-shadow: 0 0 0 0.25rem rgba(243, 156, 18, 0.25); } + background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); +} +.form-select.is-invalid:not([multiple]):not([size]).warning:focus, +.form-select.is-invalid:not([multiple])[size="1"] .form-select.is-invalid.warning:focus { + box-shadow: 0 0 0 0.25rem rgba(243, 156, 18, 0.25); +} .form-check-input.is-invalid.info { - border-color: #3498db; } - + border-color: #3498db; +} .form-check-input.is-invalid.info:checked { - background-color: #3498db; } - + background-color: #3498db; +} .form-check-input.is-invalid.info ~ .form-check-label { - color: unset; } - + color: unset; +} .form-check-input.is-invalid.info:focus { - box-shadow: 0 0 0 0.2rem rgba(52, 152, 219, 0.25); } - + box-shadow: 0 0 0 0.2rem rgba(52, 152, 219, 0.25); +} .form-check-input.is-invalid.warning { - border-color: #f39c12; } - + border-color: #f39c12; +} .form-check-input.is-invalid.warning:checked { - background-color: #f39c12; } - + background-color: #f39c12; +} .form-check-input.is-invalid.warning ~ .form-check-label { - color: unset; } - + color: unset; +} .form-check-input.is-invalid.warning:focus { - box-shadow: 0 0 0 0.2rem rgba(243, 156, 18, 0.25); } + box-shadow: 0 0 0 0.2rem rgba(243, 156, 18, 0.25); +} /* Utilities */ .mw-75 { - max-width: 75% !important; } + max-width: 75% !important; +} .mw-50 { - max-width: 50% !important; } + max-width: 50% !important; +} .mw-25 { - max-width: 25% !important; } + max-width: 25% !important; +} .mh-75 { - max-height: 75% !important; } + max-height: 75% !important; +} .mh-50 { - max-height: 50% !important; } + max-height: 50% !important; +} .mh-25 { - max-height: 25% !important; } + max-height: 25% !important; +} .p-abs-center-y { top: 50%; - transform: translateY(-50%); } + transform: translateY(-50%); +} .p-abs-center-x { left: 50%; - transform: translateX(-50%); } + transform: translateX(-50%); +} .p-abs-center-both { top: 50%; left: 50%; - transform: translateX(-50%) translateY(-50%); } + transform: translateX(-50%) translateY(-50%); +} /* Body */ body { @@ -290,87 +335,111 @@ body { /* background by SVGBackgrounds.com */ background-attachment: fixed; background-size: cover; - background-blend-mode: normal; } + background-blend-mode: normal; +} .panel { background-color: #fff; border: none; - box-shadow: 0 0 35px 0 rgba(154, 161, 171, 0.25); } + box-shadow: 0 0 35px 0 rgba(154, 161, 171, 0.25); +} .loading-overlay { background-color: #ecf0f1; - opacity: 0.65; } + opacity: 0.65; +} /* Top navbar */ .top-navbar { - background-color: #2c3e50; } + background-color: #2c3e50; +} .center-navbar nav.header-breadcrumb { - color: #fff; } + color: #fff; +} header.top-navbar .header-menu > a:hover, header.top-navbar .header-breadcrumb .header-breadcrumb-item > a:hover { - color: #d6d6d6 !important; } + color: #d6d6d6 !important; +} .top-navbar .center-navbar nav.header-breadcrumb li.header-breadcrumb-item a { - color: #fff; } + color: #fff; +} .top-navbar .right-navbar .header-menu a.nav-link { - color: #fff; } + color: #fff; +} .top-navbar .left-navbar .navbar-brand img { - filter: invert(1); } + filter: invert(1); +} .top-navbar .left-navbar .navbar-brand:hover img { - filter: invert(1) drop-shadow(0px 0px 3px #fff); } + filter: invert(1) drop-shadow(0px 0px 3px #fff); +} .top-navbar .composed-app-icon-container > .app-icon { - background-color: #fff; } + background-color: #fff; +} .breadcrumb-link-container { box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.16), 0 2px 6px 0 rgba(0, 0, 0, 0.12); - background-color: #ecf0f1; } + background-color: #ecf0f1; +} /* Sidebar */ .sidebar { - transition: width .08s linear; + transition: width 0.08s linear; box-shadow: none; - background-color: #ecf0f1; } + background-color: #ecf0f1; +} .sidebar ~ main.content:after { - background: #000; } + background: #000; +} .sidebar .sidebar-wrapper { - border-right: 1px solid none; } + border-right: 1px solid none; +} .sidebar .sidebar-wrapper { - border-right: 1px solid rgba(0, 0, 0, 0.125); } + border-right: 1px solid rgba(0, 0, 0, 0.125); +} .sidebar ul.sidebar-elements li > a.sidebar-link { - color: #343a40; } + color: #343a40; +} .sidebar ul.sidebar-elements li > a.sidebar-link.active { background-color: #dbdbdb; - color: #18bc9c; } + color: #18bc9c; +} .sidebar ul.sidebar-elements li > a.sidebar-link.have-active-child { background-color: #dbdbdb; - color: #18bc9c; } + color: #18bc9c; +} .sidebar ul.sidebar-elements li > a.sidebar-link:hover { background-color: #ebebeb; - color: #18bc9c; } + color: #18bc9c; +} .sidebar.expanded ul.sidebar-elements li > a.sidebar-link.have-active-child, .sidebar:hover ul.sidebar-elements li > a.sidebar-link.have-active-child { - background-color: unset; } + background-color: unset; +} .sidebar.expanded ul.sidebar-elements li > a.sidebar-link.have-active-child:hover, .sidebar:hover ul.sidebar-elements li > a.sidebar-link.have-active-child:hover { - background-color: #ebebeb; } + background-color: #ebebeb; +} ul.sidebar-elements li > a.sidebar-link.active::after { - background-color: #18bc9c; } + background-color: #18bc9c; +} .lock-sidebar > a.btn { - background-color: unset; } + background-color: unset; +} diff --git a/webroot/css/themes/theme-quartz.css b/webroot/css/themes/theme-quartz.css index 71469f2..83280db 100644 --- a/webroot/css/themes/theme-quartz.css +++ b/webroot/css/themes/theme-quartz.css @@ -1,371 +1,439 @@ /* Callout */ .callout { border: 1px solid #e9e9e8; - border-radius: .25rem; + border-radius: 0.25rem; background-color: transparent; - box-shadow: 0 0 35px 0 rgba(154, 161, 171, 0.25); } + box-shadow: 0 0 35px 0 rgba(154, 161, 171, 0.25); +} .callout-primary { border-left-color: #e83283; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-secondary { border-left-color: rgba(255, 255, 255, 0.4); - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-success { border-left-color: #41d7a7; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-info { border-left-color: #39cbfb; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-warning { border-left-color: #ffc107; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-danger { border-left-color: #fd7e14; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-light { border-left-color: #e9e9e8; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-dark { border-left-color: #212529; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} /* Toasts */ .toast { - min-width: 250px; } + min-width: 250px; +} .toast-primary { color: #460f27; background-color: #f8c2da; - border-color: #f6adcd; } - .toast-primary strong { - border-top-color: #f396bf; } + border-color: #f6adcd; +} +.toast-primary strong { + border-top-color: #f396bf; +} .toast-secondary { color: rgba(25, 25, 25, 0.82); background-color: rgba(255, 255, 255, 0.82); - border-color: rgba(255, 255, 255, 0.76); } - .toast-secondary strong { - border-top-color: rgba(242, 242, 242, 0.76); } + border-color: rgba(255, 255, 255, 0.76); +} +.toast-secondary strong { + border-top-color: rgba(242, 242, 242, 0.76); +} .toast-success { color: #144132; background-color: #c6f3e5; - border-color: #b3efdc; } - .toast-success strong { - border-top-color: #9eebd2; } + border-color: #b3efdc; +} +.toast-success strong { + border-top-color: #9eebd2; +} .toast-info { color: #113d4b; background-color: #c4effe; - border-color: #b0eafd; } - .toast-info strong { - border-top-color: #97e3fc; } + border-color: #b0eafd; +} +.toast-info strong { + border-top-color: #97e3fc; +} .toast-warning { color: #4d3a02; background-color: #ffecb5; - border-color: #ffe69c; } - .toast-warning strong { - border-top-color: #ffe083; } + border-color: #ffe69c; +} +.toast-warning strong { + border-top-color: #ffe083; +} .toast-danger { color: #4c2606; background-color: #fed8b9; - border-color: #fecba1; } - .toast-danger strong { - border-top-color: #febd88; } + border-color: #fecba1; +} +.toast-danger strong { + border-top-color: #febd88; +} .toast-light { color: #464646; background-color: #f8f8f8; - border-color: #f6f6f6; } - .toast-light strong { - border-top-color: #e9e9e9; } + border-color: #f6f6f6; +} +.toast-light strong { + border-top-color: #e9e9e9; +} .toast-dark { color: #0a0b0c; background-color: #bcbebf; - border-color: #a6a8a9; } - .toast-dark strong { - border-top-color: #999b9c; } + border-color: #a6a8a9; +} +.toast-dark strong { + border-top-color: #999b9c; +} /* Dropdown-item */ .dropdown-item.dropdown-item-primary { color: #fff; text-decoration: none; - background-color: #e83283; } - + background-color: #e83283; +} .dropdown-item.dropdown-item-outline-primary:hover { color: #fff; - background-color: #e83283; } - + background-color: #e83283; +} .dropdown-item.dropdown-item-secondary { color: #000; text-decoration: none; - background-color: rgba(255, 255, 255, 0.4); } - + background-color: rgba(255, 255, 255, 0.4); +} .dropdown-item.dropdown-item-outline-secondary:hover { color: #000; - background-color: rgba(255, 255, 255, 0.4); } - + background-color: rgba(255, 255, 255, 0.4); +} .dropdown-item.dropdown-item-success { color: #fff; text-decoration: none; - background-color: #41d7a7; } - + background-color: #41d7a7; +} .dropdown-item.dropdown-item-outline-success:hover { color: #fff; - background-color: #41d7a7; } - + background-color: #41d7a7; +} .dropdown-item.dropdown-item-info { color: #fff; text-decoration: none; - background-color: #39cbfb; } - + background-color: #39cbfb; +} .dropdown-item.dropdown-item-outline-info:hover { color: #fff; - background-color: #39cbfb; } - + background-color: #39cbfb; +} .dropdown-item.dropdown-item-warning { color: #fff; text-decoration: none; - background-color: #ffc107; } - + background-color: #ffc107; +} .dropdown-item.dropdown-item-outline-warning:hover { color: #fff; - background-color: #ffc107; } - + background-color: #ffc107; +} .dropdown-item.dropdown-item-danger { color: #fff; text-decoration: none; - background-color: #fd7e14; } - + background-color: #fd7e14; +} .dropdown-item.dropdown-item-outline-danger:hover { color: #fff; - background-color: #fd7e14; } - + background-color: #fd7e14; +} .dropdown-item.dropdown-item-light { color: #000; text-decoration: none; - background-color: #e9e9e8; } - + background-color: #e9e9e8; +} .dropdown-item.dropdown-item-outline-light:hover { color: #000; - background-color: #e9e9e8; } - + background-color: #e9e9e8; +} .dropdown-item.dropdown-item-dark { color: #fff; text-decoration: none; - background-color: #212529; } - + background-color: #212529; +} .dropdown-item.dropdown-item-outline-dark:hover { color: #fff; - background-color: #212529; } + background-color: #212529; +} /* Progress Timeline */ .progress-timeline { - padding: 0.2em 0.2em 0.5em 0.2em; } - .progress-timeline ul { - position: relative; - padding: 0; } - .progress-timeline li { - list-style-type: none; - position: relative; } - .progress-timeline li.progress-inactive { - opacity: 0.5; } - .progress-timeline .progress-line { - height: 2px; } - .progress-timeline .progress-line.progress-inactive { - opacity: 0.5; } + padding: 0.2em 0.2em 0.5em 0.2em; +} +.progress-timeline ul { + position: relative; + padding: 0; +} +.progress-timeline li { + list-style-type: none; + position: relative; +} +.progress-timeline li.progress-inactive { + opacity: 0.5; +} +.progress-timeline .progress-line { + height: 2px; +} +.progress-timeline .progress-line.progress-inactive { + opacity: 0.5; +} /* Forms severity */ .form-control.is-invalid.info { - background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%2339cbfb' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%2339cbfb' stroke='none'/%3e%3c/svg%3e"); } - .form-control.is-invalid.info:focus { - border-color: #39cbfb; - box-shadow: 0 0 0 0.25rem rgba(57, 203, 251, 0.25); } - + background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%2339cbfb' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%2339cbfb' stroke='none'/%3e%3c/svg%3e"); +} +.form-control.is-invalid.info:focus { + border-color: #39cbfb; + box-shadow: 0 0 0 0.25rem rgba(57, 203, 251, 0.25); +} .form-control.is-invalid.warning { - background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23ffc107' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23ffc107' stroke='none'/%3e%3c/svg%3e"); } - .form-control.is-invalid.warning:focus { - border-color: #ffc107; - box-shadow: 0 0 0 0.25rem rgba(255, 193, 7, 0.25); } + background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23ffc107' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23ffc107' stroke='none'/%3e%3c/svg%3e"); +} +.form-control.is-invalid.warning:focus { + border-color: #ffc107; + box-shadow: 0 0 0 0.25rem rgba(255, 193, 7, 0.25); +} .form-select.is-invalid:not([multiple]):not([size]).info, -.form-select.is-invalid:not([multiple])[size="1"] -.form-select.is-invalid.info { +.form-select.is-invalid:not([multiple])[size="1"] .form-select.is-invalid.info { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%2339cbfb'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%2339cbfb' stroke='none'/%3e%3c/svg%3e"); - background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); } - .form-select.is-invalid:not([multiple]):not([size]).info:focus, - .form-select.is-invalid:not([multiple])[size="1"] -.form-select.is-invalid.info:focus { - box-shadow: 0 0 0 0.25rem rgba(57, 203, 251, 0.25); } - + background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); +} +.form-select.is-invalid:not([multiple]):not([size]).info:focus, +.form-select.is-invalid:not([multiple])[size="1"] .form-select.is-invalid.info:focus { + box-shadow: 0 0 0 0.25rem rgba(57, 203, 251, 0.25); +} .form-select.is-invalid:not([multiple]):not([size]).warning, -.form-select.is-invalid:not([multiple])[size="1"] -.form-select.is-invalid.warning { +.form-select.is-invalid:not([multiple])[size="1"] .form-select.is-invalid.warning { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23ffc107'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23ffc107' stroke='none'/%3e%3c/svg%3e"); - background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); } - .form-select.is-invalid:not([multiple]):not([size]).warning:focus, - .form-select.is-invalid:not([multiple])[size="1"] -.form-select.is-invalid.warning:focus { - box-shadow: 0 0 0 0.25rem rgba(255, 193, 7, 0.25); } + background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); +} +.form-select.is-invalid:not([multiple]):not([size]).warning:focus, +.form-select.is-invalid:not([multiple])[size="1"] .form-select.is-invalid.warning:focus { + box-shadow: 0 0 0 0.25rem rgba(255, 193, 7, 0.25); +} .form-check-input.is-invalid.info { - border-color: #39cbfb; } - + border-color: #39cbfb; +} .form-check-input.is-invalid.info:checked { - background-color: #39cbfb; } - + background-color: #39cbfb; +} .form-check-input.is-invalid.info ~ .form-check-label { - color: unset; } - + color: unset; +} .form-check-input.is-invalid.info:focus { - box-shadow: 0 0 0 0.2rem rgba(57, 203, 251, 0.25); } - + box-shadow: 0 0 0 0.2rem rgba(57, 203, 251, 0.25); +} .form-check-input.is-invalid.warning { - border-color: #ffc107; } - + border-color: #ffc107; +} .form-check-input.is-invalid.warning:checked { - background-color: #ffc107; } - + background-color: #ffc107; +} .form-check-input.is-invalid.warning ~ .form-check-label { - color: unset; } - + color: unset; +} .form-check-input.is-invalid.warning:focus { - box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.25); } + box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.25); +} /* Utilities */ .mw-75 { - max-width: 75% !important; } + max-width: 75% !important; +} .mw-50 { - max-width: 50% !important; } + max-width: 50% !important; +} .mw-25 { - max-width: 25% !important; } + max-width: 25% !important; +} .mh-75 { - max-height: 75% !important; } + max-height: 75% !important; +} .mh-50 { - max-height: 50% !important; } + max-height: 50% !important; +} .mh-25 { - max-height: 25% !important; } + max-height: 25% !important; +} .p-abs-center-y { top: 50%; - transform: translateY(-50%); } + transform: translateY(-50%); +} .p-abs-center-x { left: 50%; - transform: translateX(-50%); } + transform: translateX(-50%); +} .p-abs-center-both { top: 50%; left: 50%; - transform: translateX(-50%) translateY(-50%); } + transform: translateX(-50%) translateY(-50%); +} /* Body */ .panel { background-color: transparent; border: none; - box-shadow: 0 0 35px 0 rgba(154, 161, 171, 0.25); } + box-shadow: 0 0 35px 0 rgba(154, 161, 171, 0.25); +} .loading-overlay { background-color: #e9e9e8; - opacity: 0.35; } + opacity: 0.35; +} /* Top navbar */ .top-navbar { - background-color: #e83283; } + background-color: #e83283; +} .center-navbar nav.header-breadcrumb { - color: #fff; } + color: #fff; +} header.top-navbar .header-menu > a:hover, header.top-navbar .header-breadcrumb .header-breadcrumb-item > a:hover { - color: #d6d6d6 !important; } + color: #d6d6d6 !important; +} .top-navbar .center-navbar nav.header-breadcrumb li.header-breadcrumb-item a { - color: #fff; } + color: #fff; +} .top-navbar .right-navbar .header-menu a.nav-link { - color: #fff; } + color: #fff; +} .top-navbar .left-navbar .navbar-brand img { - filter: invert(1); } + filter: invert(1); +} .top-navbar .left-navbar .navbar-brand:hover img { - filter: invert(1) drop-shadow(0px 0px 3px #fff); } + filter: invert(1) drop-shadow(0px 0px 3px #fff); +} .top-navbar .composed-app-icon-container > .app-icon { - background-color: #fff; } + background-color: #fff; +} .breadcrumb-link-container { box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.16), 0 2px 6px 0 rgba(0, 0, 0, 0.12); - background-color: rgba(255, 255, 255, 0.4); } + background-color: rgba(255, 255, 255, 0.4); +} /* Sidebar */ .sidebar { - transition: width .08s linear; + transition: width 0.08s linear; box-shadow: none; - background-color: rgba(255, 255, 255, 0.4); } + background-color: rgba(255, 255, 255, 0.4); +} .sidebar ~ main.content:after { - background: #000; } + background: #000; +} .sidebar .sidebar-wrapper { - border-right: 1px solid none; } + border-right: 1px solid none; +} .sidebar .sidebar-wrapper { - border-right: 1px solid rgba(0, 0, 0, 0.125); } + border-right: 1px solid rgba(0, 0, 0, 0.125); +} .sidebar ul.sidebar-elements li > a.sidebar-link { - color: #fff; } + color: #fff; +} .sidebar ul.sidebar-elements li > a.sidebar-link.active { background-color: #fff; - color: #343a40; } + color: #343a40; +} .sidebar ul.sidebar-elements li > a.sidebar-link.have-active-child { background-color: #fff; - color: #343a40; } + color: #343a40; +} .sidebar ul.sidebar-elements li > a.sidebar-link:hover { background-color: #fff; - color: #343a40; } + color: #343a40; +} .sidebar.expanded ul.sidebar-elements li > a.sidebar-link.have-active-child, .sidebar:hover ul.sidebar-elements li > a.sidebar-link.have-active-child { - background-color: unset; } + background-color: unset; +} .sidebar.expanded ul.sidebar-elements li > a.sidebar-link.have-active-child:hover, .sidebar:hover ul.sidebar-elements li > a.sidebar-link.have-active-child:hover { - background-color: #fff; } + background-color: #fff; +} ul.sidebar-elements li > a.sidebar-link.active::after { - background-color: #e83283; } + background-color: #e83283; +} .lock-sidebar > a.btn { - background-color: rgba(255, 255, 255, 0.4); } + background-color: rgba(255, 255, 255, 0.4); +} .btn { display: inline-block; @@ -382,427 +450,485 @@ ul.sidebar-elements li > a.sidebar-link.active::after { padding: 0.75rem 1.5rem; font-size: 1rem; border-radius: 0.5rem; - transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; } - @media (prefers-reduced-motion: reduce) { - .btn { - transition: none; } } - .btn:hover { - color: #fff; } - .btn-check:focus + .btn, .btn:focus { - outline: 0; - box-shadow: 0 0 0 0.25rem rgba(232, 50, 131, 0.25); } - .btn:disabled, .btn.disabled, - fieldset:disabled .btn { - pointer-events: none; - opacity: 0.65; } + transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; +} +@media (prefers-reduced-motion: reduce) { + .btn { + transition: none; + } +} +.btn:hover { + color: #fff; +} +.btn-check:focus + .btn, .btn:focus { + outline: 0; + box-shadow: 0 0 0 0.25rem rgba(232, 50, 131, 0.25); +} +.btn:disabled, .btn.disabled, fieldset:disabled .btn { + pointer-events: none; + opacity: 0.65; +} .btn-primary { color: #fff; background-color: #e83283; - border-color: #e83283; } - .btn-primary:hover { - color: #fff; - background-color: #c52b6f; - border-color: #ba2869; } - .btn-check:focus + .btn-primary, .btn-primary:focus { - color: #fff; - background-color: #c52b6f; - border-color: #ba2869; - box-shadow: 0 0 0 0.25rem rgba(235, 81, 150, 0.5); } - .btn-check:checked + .btn-primary, - .btn-check:active + .btn-primary, .btn-primary:active, .btn-primary.active, - .show > .btn-primary.dropdown-toggle { - color: #fff; - background-color: #ba2869; - border-color: #ae2662; } - .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(235, 81, 150, 0.5); } - .btn-primary:disabled, .btn-primary.disabled { - color: #fff; - background-color: #e83283; - border-color: #e83283; } + border-color: #e83283; +} +.btn-primary:hover { + color: #fff; + background-color: #c52b6f; + border-color: #ba2869; +} +.btn-check:focus + .btn-primary, .btn-primary:focus { + color: #fff; + background-color: #c52b6f; + border-color: #ba2869; + box-shadow: 0 0 0 0.25rem rgba(235, 81, 150, 0.5); +} +.btn-check:checked + .btn-primary, .btn-check:active + .btn-primary, .btn-primary:active, .btn-primary.active, .show > .btn-primary.dropdown-toggle { + color: #fff; + background-color: #ba2869; + border-color: #ae2662; +} +.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(235, 81, 150, 0.5); +} +.btn-primary:disabled, .btn-primary.disabled { + color: #fff; + background-color: #e83283; + border-color: #e83283; +} .btn-secondary { color: #000; background-color: rgba(255, 255, 255, 0.4); - border-color: rgba(255, 255, 255, 0.4); } - .btn-secondary:hover { - color: #000; - background-color: rgba(255, 255, 255, 0.49); - border-color: rgba(255, 255, 255, 0.46); } - .btn-check:focus + .btn-secondary, .btn-secondary:focus { - color: #000; - background-color: rgba(255, 255, 255, 0.49); - border-color: rgba(255, 255, 255, 0.46); - box-shadow: 0 0 0 0.25rem rgba(149, 149, 149, 0.5); } - .btn-check:checked + .btn-secondary, - .btn-check:active + .btn-secondary, .btn-secondary:active, .btn-secondary.active, - .show > .btn-secondary.dropdown-toggle { - color: #000; - background-color: rgba(255, 255, 255, 0.52); - border-color: rgba(255, 255, 255, 0.46); } - .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(149, 149, 149, 0.5); } - .btn-secondary:disabled, .btn-secondary.disabled { - color: #000; - background-color: rgba(255, 255, 255, 0.4); - border-color: rgba(255, 255, 255, 0.4); } + border-color: rgba(255, 255, 255, 0.4); +} +.btn-secondary:hover { + color: #000; + background-color: rgba(255, 255, 255, 0.49); + border-color: rgba(255, 255, 255, 0.46); +} +.btn-check:focus + .btn-secondary, .btn-secondary:focus { + color: #000; + background-color: rgba(255, 255, 255, 0.49); + border-color: rgba(255, 255, 255, 0.46); + box-shadow: 0 0 0 0.25rem rgba(149, 149, 149, 0.5); +} +.btn-check:checked + .btn-secondary, .btn-check:active + .btn-secondary, .btn-secondary:active, .btn-secondary.active, .show > .btn-secondary.dropdown-toggle { + color: #000; + background-color: rgba(255, 255, 255, 0.52); + border-color: rgba(255, 255, 255, 0.46); +} +.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(149, 149, 149, 0.5); +} +.btn-secondary:disabled, .btn-secondary.disabled { + color: #000; + background-color: rgba(255, 255, 255, 0.4); + border-color: rgba(255, 255, 255, 0.4); +} .btn-success { color: #fff; background-color: #41d7a7; - border-color: #41d7a7; } - .btn-success:hover { - color: #fff; - background-color: #37b78e; - border-color: #34ac86; } - .btn-check:focus + .btn-success, .btn-success:focus { - color: #fff; - background-color: #37b78e; - border-color: #34ac86; - box-shadow: 0 0 0 0.25rem rgba(94, 221, 180, 0.5); } - .btn-check:checked + .btn-success, - .btn-check:active + .btn-success, .btn-success:active, .btn-success.active, - .show > .btn-success.dropdown-toggle { - color: #fff; - background-color: #34ac86; - border-color: #31a17d; } - .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(94, 221, 180, 0.5); } - .btn-success:disabled, .btn-success.disabled { - color: #fff; - background-color: #41d7a7; - border-color: #41d7a7; } + border-color: #41d7a7; +} +.btn-success:hover { + color: #fff; + background-color: #37b78e; + border-color: #34ac86; +} +.btn-check:focus + .btn-success, .btn-success:focus { + color: #fff; + background-color: #37b78e; + border-color: #34ac86; + box-shadow: 0 0 0 0.25rem rgba(94, 221, 180, 0.5); +} +.btn-check:checked + .btn-success, .btn-check:active + .btn-success, .btn-success:active, .btn-success.active, .show > .btn-success.dropdown-toggle { + color: #fff; + background-color: #34ac86; + border-color: #31a17d; +} +.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(94, 221, 180, 0.5); +} +.btn-success:disabled, .btn-success.disabled { + color: #fff; + background-color: #41d7a7; + border-color: #41d7a7; +} .btn-info { color: #fff; background-color: #39cbfb; - border-color: #39cbfb; } - .btn-info:hover { - color: #fff; - background-color: #30add5; - border-color: #2ea2c9; } - .btn-check:focus + .btn-info, .btn-info:focus { - color: #fff; - background-color: #30add5; - border-color: #2ea2c9; - box-shadow: 0 0 0 0.25rem rgba(87, 211, 252, 0.5); } - .btn-check:checked + .btn-info, - .btn-check:active + .btn-info, .btn-info:active, .btn-info.active, - .show > .btn-info.dropdown-toggle { - color: #fff; - background-color: #2ea2c9; - border-color: #2b98bc; } - .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(87, 211, 252, 0.5); } - .btn-info:disabled, .btn-info.disabled { - color: #fff; - background-color: #39cbfb; - border-color: #39cbfb; } + border-color: #39cbfb; +} +.btn-info:hover { + color: #fff; + background-color: #30add5; + border-color: #2ea2c9; +} +.btn-check:focus + .btn-info, .btn-info:focus { + color: #fff; + background-color: #30add5; + border-color: #2ea2c9; + box-shadow: 0 0 0 0.25rem rgba(87, 211, 252, 0.5); +} +.btn-check:checked + .btn-info, .btn-check:active + .btn-info, .btn-info:active, .btn-info.active, .show > .btn-info.dropdown-toggle { + color: #fff; + background-color: #2ea2c9; + border-color: #2b98bc; +} +.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(87, 211, 252, 0.5); +} +.btn-info:disabled, .btn-info.disabled { + color: #fff; + background-color: #39cbfb; + border-color: #39cbfb; +} .btn-warning { color: #fff; background-color: #ffc107; - border-color: #ffc107; } - .btn-warning:hover { - color: #fff; - background-color: #d9a406; - border-color: #cc9a06; } - .btn-check:focus + .btn-warning, .btn-warning:focus { - color: #fff; - background-color: #d9a406; - border-color: #cc9a06; - box-shadow: 0 0 0 0.25rem rgba(255, 202, 44, 0.5); } - .btn-check:checked + .btn-warning, - .btn-check:active + .btn-warning, .btn-warning:active, .btn-warning.active, - .show > .btn-warning.dropdown-toggle { - color: #fff; - background-color: #cc9a06; - border-color: #bf9105; } - .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(255, 202, 44, 0.5); } - .btn-warning:disabled, .btn-warning.disabled { - color: #fff; - background-color: #ffc107; - border-color: #ffc107; } + border-color: #ffc107; +} +.btn-warning:hover { + color: #fff; + background-color: #d9a406; + border-color: #cc9a06; +} +.btn-check:focus + .btn-warning, .btn-warning:focus { + color: #fff; + background-color: #d9a406; + border-color: #cc9a06; + box-shadow: 0 0 0 0.25rem rgba(255, 202, 44, 0.5); +} +.btn-check:checked + .btn-warning, .btn-check:active + .btn-warning, .btn-warning:active, .btn-warning.active, .show > .btn-warning.dropdown-toggle { + color: #fff; + background-color: #cc9a06; + border-color: #bf9105; +} +.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(255, 202, 44, 0.5); +} +.btn-warning:disabled, .btn-warning.disabled { + color: #fff; + background-color: #ffc107; + border-color: #ffc107; +} .btn-danger { color: #fff; background-color: #fd7e14; - border-color: #fd7e14; } - .btn-danger:hover { - color: #fff; - background-color: #d76b11; - border-color: #ca6510; } - .btn-check:focus + .btn-danger, .btn-danger:focus { - color: #fff; - background-color: #d76b11; - border-color: #ca6510; - box-shadow: 0 0 0 0.25rem rgba(253, 145, 55, 0.5); } - .btn-check:checked + .btn-danger, - .btn-check:active + .btn-danger, .btn-danger:active, .btn-danger.active, - .show > .btn-danger.dropdown-toggle { - color: #fff; - background-color: #ca6510; - border-color: #be5f0f; } - .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(253, 145, 55, 0.5); } - .btn-danger:disabled, .btn-danger.disabled { - color: #fff; - background-color: #fd7e14; - border-color: #fd7e14; } + border-color: #fd7e14; +} +.btn-danger:hover { + color: #fff; + background-color: #d76b11; + border-color: #ca6510; +} +.btn-check:focus + .btn-danger, .btn-danger:focus { + color: #fff; + background-color: #d76b11; + border-color: #ca6510; + box-shadow: 0 0 0 0.25rem rgba(253, 145, 55, 0.5); +} +.btn-check:checked + .btn-danger, .btn-check:active + .btn-danger, .btn-danger:active, .btn-danger.active, .show > .btn-danger.dropdown-toggle { + color: #fff; + background-color: #ca6510; + border-color: #be5f0f; +} +.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(253, 145, 55, 0.5); +} +.btn-danger:disabled, .btn-danger.disabled { + color: #fff; + background-color: #fd7e14; + border-color: #fd7e14; +} .btn-light { color: #000; background-color: #e9e9e8; - border-color: #e9e9e8; } - .btn-light:hover { - color: #000; - background-color: #ececeb; - border-color: #ebebea; } - .btn-check:focus + .btn-light, .btn-light:focus { - color: #000; - background-color: #ececeb; - border-color: #ebebea; - box-shadow: 0 0 0 0.25rem rgba(198, 198, 197, 0.5); } - .btn-check:checked + .btn-light, - .btn-check:active + .btn-light, .btn-light:active, .btn-light.active, - .show > .btn-light.dropdown-toggle { - color: #000; - background-color: #ededed; - border-color: #ebebea; } - .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(198, 198, 197, 0.5); } - .btn-light:disabled, .btn-light.disabled { - color: #000; - background-color: #e9e9e8; - border-color: #e9e9e8; } + border-color: #e9e9e8; +} +.btn-light:hover { + color: #000; + background-color: #ececeb; + border-color: #ebebea; +} +.btn-check:focus + .btn-light, .btn-light:focus { + color: #000; + background-color: #ececeb; + border-color: #ebebea; + box-shadow: 0 0 0 0.25rem rgba(198, 198, 197, 0.5); +} +.btn-check:checked + .btn-light, .btn-check:active + .btn-light, .btn-light:active, .btn-light.active, .show > .btn-light.dropdown-toggle { + color: #000; + background-color: #ededed; + border-color: #ebebea; +} +.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(198, 198, 197, 0.5); +} +.btn-light:disabled, .btn-light.disabled { + color: #000; + background-color: #e9e9e8; + border-color: #e9e9e8; +} .btn-dark { color: #fff; background-color: #212529; - border-color: #212529; } - .btn-dark:hover { - color: #fff; - background-color: #1c1f23; - border-color: #1a1e21; } - .btn-check:focus + .btn-dark, .btn-dark:focus { - color: #fff; - background-color: #1c1f23; - border-color: #1a1e21; - box-shadow: 0 0 0 0.25rem rgba(66, 70, 73, 0.5); } - .btn-check:checked + .btn-dark, - .btn-check:active + .btn-dark, .btn-dark:active, .btn-dark.active, - .show > .btn-dark.dropdown-toggle { - color: #fff; - background-color: #1a1e21; - border-color: #191c1f; } - .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(66, 70, 73, 0.5); } - .btn-dark:disabled, .btn-dark.disabled { - color: #fff; - background-color: #212529; - border-color: #212529; } + border-color: #212529; +} +.btn-dark:hover { + color: #fff; + background-color: #1c1f23; + border-color: #1a1e21; +} +.btn-check:focus + .btn-dark, .btn-dark:focus { + color: #fff; + background-color: #1c1f23; + border-color: #1a1e21; + box-shadow: 0 0 0 0.25rem rgba(66, 70, 73, 0.5); +} +.btn-check:checked + .btn-dark, .btn-check:active + .btn-dark, .btn-dark:active, .btn-dark.active, .show > .btn-dark.dropdown-toggle { + color: #fff; + background-color: #1a1e21; + border-color: #191c1f; +} +.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(66, 70, 73, 0.5); +} +.btn-dark:disabled, .btn-dark.disabled { + color: #fff; + background-color: #212529; + border-color: #212529; +} .btn-outline-primary { color: #e83283; - border-color: #e83283; } - .btn-outline-primary:hover { - color: #fff; - background-color: #e83283; - border-color: #e83283; } - .btn-check:focus + .btn-outline-primary, .btn-outline-primary:focus { - box-shadow: 0 0 0 0.25rem rgba(232, 50, 131, 0.5); } - .btn-check:checked + .btn-outline-primary, - .btn-check:active + .btn-outline-primary, .btn-outline-primary:active, .btn-outline-primary.active, .btn-outline-primary.dropdown-toggle.show { - color: #fff; - background-color: #e83283; - border-color: #e83283; } - .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(232, 50, 131, 0.5); } - .btn-outline-primary:disabled, .btn-outline-primary.disabled { - color: #e83283; - background-color: transparent; } + border-color: #e83283; +} +.btn-outline-primary:hover { + color: #fff; + background-color: #e83283; + border-color: #e83283; +} +.btn-check:focus + .btn-outline-primary, .btn-outline-primary:focus { + box-shadow: 0 0 0 0.25rem rgba(232, 50, 131, 0.5); +} +.btn-check:checked + .btn-outline-primary, .btn-check:active + .btn-outline-primary, .btn-outline-primary:active, .btn-outline-primary.active, .btn-outline-primary.dropdown-toggle.show { + color: #fff; + background-color: #e83283; + border-color: #e83283; +} +.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(232, 50, 131, 0.5); +} +.btn-outline-primary:disabled, .btn-outline-primary.disabled { + color: #e83283; + background-color: transparent; +} .btn-outline-secondary { color: rgba(255, 255, 255, 0.4); - border-color: rgba(255, 255, 255, 0.4); } - .btn-outline-secondary:hover { - color: #000; - background-color: rgba(255, 255, 255, 0.4); - border-color: rgba(255, 255, 255, 0.4); } - .btn-check:focus + .btn-outline-secondary, .btn-outline-secondary:focus { - box-shadow: 0 0 0 0.25rem rgba(255, 255, 255, 0.5); } - .btn-check:checked + .btn-outline-secondary, - .btn-check:active + .btn-outline-secondary, .btn-outline-secondary:active, .btn-outline-secondary.active, .btn-outline-secondary.dropdown-toggle.show { - color: #000; - background-color: rgba(255, 255, 255, 0.4); - border-color: rgba(255, 255, 255, 0.4); } - .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(255, 255, 255, 0.5); } - .btn-outline-secondary:disabled, .btn-outline-secondary.disabled { - color: rgba(255, 255, 255, 0.4); - background-color: transparent; } + border-color: rgba(255, 255, 255, 0.4); +} +.btn-outline-secondary:hover { + color: #000; + background-color: rgba(255, 255, 255, 0.4); + border-color: rgba(255, 255, 255, 0.4); +} +.btn-check:focus + .btn-outline-secondary, .btn-outline-secondary:focus { + box-shadow: 0 0 0 0.25rem rgba(255, 255, 255, 0.5); +} +.btn-check:checked + .btn-outline-secondary, .btn-check:active + .btn-outline-secondary, .btn-outline-secondary:active, .btn-outline-secondary.active, .btn-outline-secondary.dropdown-toggle.show { + color: #000; + background-color: rgba(255, 255, 255, 0.4); + border-color: rgba(255, 255, 255, 0.4); +} +.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(255, 255, 255, 0.5); +} +.btn-outline-secondary:disabled, .btn-outline-secondary.disabled { + color: rgba(255, 255, 255, 0.4); + background-color: transparent; +} .btn-outline-success { color: #41d7a7; - border-color: #41d7a7; } - .btn-outline-success:hover { - color: #fff; - background-color: #41d7a7; - border-color: #41d7a7; } - .btn-check:focus + .btn-outline-success, .btn-outline-success:focus { - box-shadow: 0 0 0 0.25rem rgba(65, 215, 167, 0.5); } - .btn-check:checked + .btn-outline-success, - .btn-check:active + .btn-outline-success, .btn-outline-success:active, .btn-outline-success.active, .btn-outline-success.dropdown-toggle.show { - color: #fff; - background-color: #41d7a7; - border-color: #41d7a7; } - .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(65, 215, 167, 0.5); } - .btn-outline-success:disabled, .btn-outline-success.disabled { - color: #41d7a7; - background-color: transparent; } + border-color: #41d7a7; +} +.btn-outline-success:hover { + color: #fff; + background-color: #41d7a7; + border-color: #41d7a7; +} +.btn-check:focus + .btn-outline-success, .btn-outline-success:focus { + box-shadow: 0 0 0 0.25rem rgba(65, 215, 167, 0.5); +} +.btn-check:checked + .btn-outline-success, .btn-check:active + .btn-outline-success, .btn-outline-success:active, .btn-outline-success.active, .btn-outline-success.dropdown-toggle.show { + color: #fff; + background-color: #41d7a7; + border-color: #41d7a7; +} +.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(65, 215, 167, 0.5); +} +.btn-outline-success:disabled, .btn-outline-success.disabled { + color: #41d7a7; + background-color: transparent; +} .btn-outline-info { color: #39cbfb; - border-color: #39cbfb; } - .btn-outline-info:hover { - color: #fff; - background-color: #39cbfb; - border-color: #39cbfb; } - .btn-check:focus + .btn-outline-info, .btn-outline-info:focus { - box-shadow: 0 0 0 0.25rem rgba(57, 203, 251, 0.5); } - .btn-check:checked + .btn-outline-info, - .btn-check:active + .btn-outline-info, .btn-outline-info:active, .btn-outline-info.active, .btn-outline-info.dropdown-toggle.show { - color: #fff; - background-color: #39cbfb; - border-color: #39cbfb; } - .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(57, 203, 251, 0.5); } - .btn-outline-info:disabled, .btn-outline-info.disabled { - color: #39cbfb; - background-color: transparent; } + border-color: #39cbfb; +} +.btn-outline-info:hover { + color: #fff; + background-color: #39cbfb; + border-color: #39cbfb; +} +.btn-check:focus + .btn-outline-info, .btn-outline-info:focus { + box-shadow: 0 0 0 0.25rem rgba(57, 203, 251, 0.5); +} +.btn-check:checked + .btn-outline-info, .btn-check:active + .btn-outline-info, .btn-outline-info:active, .btn-outline-info.active, .btn-outline-info.dropdown-toggle.show { + color: #fff; + background-color: #39cbfb; + border-color: #39cbfb; +} +.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(57, 203, 251, 0.5); +} +.btn-outline-info:disabled, .btn-outline-info.disabled { + color: #39cbfb; + background-color: transparent; +} .btn-outline-warning { color: #ffc107; - border-color: #ffc107; } - .btn-outline-warning:hover { - color: #fff; - background-color: #ffc107; - border-color: #ffc107; } - .btn-check:focus + .btn-outline-warning, .btn-outline-warning:focus { - box-shadow: 0 0 0 0.25rem rgba(255, 193, 7, 0.5); } - .btn-check:checked + .btn-outline-warning, - .btn-check:active + .btn-outline-warning, .btn-outline-warning:active, .btn-outline-warning.active, .btn-outline-warning.dropdown-toggle.show { - color: #fff; - background-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 { - box-shadow: 0 0 0 0.25rem rgba(255, 193, 7, 0.5); } - .btn-outline-warning:disabled, .btn-outline-warning.disabled { - color: #ffc107; - background-color: transparent; } + border-color: #ffc107; +} +.btn-outline-warning:hover { + color: #fff; + background-color: #ffc107; + border-color: #ffc107; +} +.btn-check:focus + .btn-outline-warning, .btn-outline-warning:focus { + box-shadow: 0 0 0 0.25rem rgba(255, 193, 7, 0.5); +} +.btn-check:checked + .btn-outline-warning, .btn-check:active + .btn-outline-warning, .btn-outline-warning:active, .btn-outline-warning.active, .btn-outline-warning.dropdown-toggle.show { + color: #fff; + background-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 { + box-shadow: 0 0 0 0.25rem rgba(255, 193, 7, 0.5); +} +.btn-outline-warning:disabled, .btn-outline-warning.disabled { + color: #ffc107; + background-color: transparent; +} .btn-outline-danger { color: #fd7e14; - border-color: #fd7e14; } - .btn-outline-danger:hover { - color: #fff; - background-color: #fd7e14; - border-color: #fd7e14; } - .btn-check:focus + .btn-outline-danger, .btn-outline-danger:focus { - box-shadow: 0 0 0 0.25rem rgba(253, 126, 20, 0.5); } - .btn-check:checked + .btn-outline-danger, - .btn-check:active + .btn-outline-danger, .btn-outline-danger:active, .btn-outline-danger.active, .btn-outline-danger.dropdown-toggle.show { - color: #fff; - background-color: #fd7e14; - border-color: #fd7e14; } - .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(253, 126, 20, 0.5); } - .btn-outline-danger:disabled, .btn-outline-danger.disabled { - color: #fd7e14; - background-color: transparent; } + border-color: #fd7e14; +} +.btn-outline-danger:hover { + color: #fff; + background-color: #fd7e14; + border-color: #fd7e14; +} +.btn-check:focus + .btn-outline-danger, .btn-outline-danger:focus { + box-shadow: 0 0 0 0.25rem rgba(253, 126, 20, 0.5); +} +.btn-check:checked + .btn-outline-danger, .btn-check:active + .btn-outline-danger, .btn-outline-danger:active, .btn-outline-danger.active, .btn-outline-danger.dropdown-toggle.show { + color: #fff; + background-color: #fd7e14; + border-color: #fd7e14; +} +.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(253, 126, 20, 0.5); +} +.btn-outline-danger:disabled, .btn-outline-danger.disabled { + color: #fd7e14; + background-color: transparent; +} .btn-outline-light { color: #e9e9e8; - border-color: #e9e9e8; } - .btn-outline-light:hover { - color: #000; - background-color: #e9e9e8; - border-color: #e9e9e8; } - .btn-check:focus + .btn-outline-light, .btn-outline-light:focus { - box-shadow: 0 0 0 0.25rem rgba(233, 233, 232, 0.5); } - .btn-check:checked + .btn-outline-light, - .btn-check:active + .btn-outline-light, .btn-outline-light:active, .btn-outline-light.active, .btn-outline-light.dropdown-toggle.show { - color: #000; - background-color: #e9e9e8; - border-color: #e9e9e8; } - .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(233, 233, 232, 0.5); } - .btn-outline-light:disabled, .btn-outline-light.disabled { - color: #e9e9e8; - background-color: transparent; } + border-color: #e9e9e8; +} +.btn-outline-light:hover { + color: #000; + background-color: #e9e9e8; + border-color: #e9e9e8; +} +.btn-check:focus + .btn-outline-light, .btn-outline-light:focus { + box-shadow: 0 0 0 0.25rem rgba(233, 233, 232, 0.5); +} +.btn-check:checked + .btn-outline-light, .btn-check:active + .btn-outline-light, .btn-outline-light:active, .btn-outline-light.active, .btn-outline-light.dropdown-toggle.show { + color: #000; + background-color: #e9e9e8; + border-color: #e9e9e8; +} +.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(233, 233, 232, 0.5); +} +.btn-outline-light:disabled, .btn-outline-light.disabled { + color: #e9e9e8; + background-color: transparent; +} .btn-outline-dark { color: #212529; - border-color: #212529; } - .btn-outline-dark:hover { - color: #fff; - background-color: #212529; - border-color: #212529; } - .btn-check:focus + .btn-outline-dark, .btn-outline-dark:focus { - box-shadow: 0 0 0 0.25rem rgba(33, 37, 41, 0.5); } - .btn-check:checked + .btn-outline-dark, - .btn-check:active + .btn-outline-dark, .btn-outline-dark:active, .btn-outline-dark.active, .btn-outline-dark.dropdown-toggle.show { - color: #fff; - background-color: #212529; - border-color: #212529; } - .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(33, 37, 41, 0.5); } - .btn-outline-dark:disabled, .btn-outline-dark.disabled { - color: #212529; - background-color: transparent; } + border-color: #212529; +} +.btn-outline-dark:hover { + color: #fff; + background-color: #212529; + border-color: #212529; +} +.btn-check:focus + .btn-outline-dark, .btn-outline-dark:focus { + box-shadow: 0 0 0 0.25rem rgba(33, 37, 41, 0.5); +} +.btn-check:checked + .btn-outline-dark, .btn-check:active + .btn-outline-dark, .btn-outline-dark:active, .btn-outline-dark.active, .btn-outline-dark.dropdown-toggle.show { + color: #fff; + background-color: #212529; + border-color: #212529; +} +.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(33, 37, 41, 0.5); +} +.btn-outline-dark:disabled, .btn-outline-dark.disabled { + color: #212529; + background-color: transparent; +} .btn-link { font-weight: 400; color: #fff; - text-decoration: underline; } - .btn-link:hover { - color: #cccccc; } - .btn-link:disabled, .btn-link.disabled { - color: #6c757d; } + text-decoration: underline; +} +.btn-link:hover { + color: #cccccc; +} +.btn-link:disabled, .btn-link.disabled { + color: #6c757d; +} .btn-lg { padding: 0.5rem 1rem; font-size: 1.25rem; - border-radius: 0.7rem; } + border-radius: 0.7rem; +} .btn-sm { padding: 0.25rem 0.5rem; font-size: 0.875rem; - border-radius: 0.6rem; } + border-radius: 0.6rem; +} diff --git a/webroot/css/themes/theme-slate.css b/webroot/css/themes/theme-slate.css index d8b5ba6..0d722d6 100644 --- a/webroot/css/themes/theme-slate.css +++ b/webroot/css/themes/theme-slate.css @@ -1,283 +1,332 @@ /* Callout */ .callout { border: 1px solid #e9ecef; - border-radius: .25rem; + border-radius: 0.25rem; background-color: #363636; - box-shadow: none; } + box-shadow: none; +} .callout-primary { border-left-color: #3a3f44; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-secondary { border-left-color: #7a8288; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-success { border-left-color: #62c462; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-info { border-left-color: #5bc0de; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-warning { border-left-color: #f89406; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-danger { border-left-color: #ee5f5b; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-light { border-left-color: #e9ecef; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-dark { border-left-color: #272b30; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} /* Toasts */ .toast { - min-width: 250px; } + min-width: 250px; +} .toast-primary { color: #111314; background-color: #c4c5c7; - border-color: #b0b2b4; } - .toast-primary strong { - border-top-color: #a3a5a8; } + border-color: #b0b2b4; +} +.toast-primary strong { + border-top-color: #a3a5a8; +} .toast-secondary { color: #252729; background-color: #d7dadb; - border-color: #cacdcf; } - .toast-secondary strong { - border-top-color: #bdc0c3; } + border-color: #cacdcf; +} +.toast-secondary strong { + border-top-color: #bdc0c3; +} .toast-success { color: #1d3b1d; background-color: #d0edd0; - border-color: #c0e7c0; } - .toast-success strong { - border-top-color: #aee0ae; } + border-color: #c0e7c0; +} +.toast-success strong { + border-top-color: #aee0ae; +} .toast-info { color: #1b3a43; background-color: #ceecf5; - border-color: #bde6f2; } - .toast-info strong { - border-top-color: #a8deee; } + border-color: #bde6f2; +} +.toast-info strong { + border-top-color: #a8deee; +} .toast-warning { color: #4a2c02; background-color: #fddfb4; - border-color: #fcd49b; } - .toast-warning strong { - border-top-color: #fbc982; } + border-color: #fcd49b; +} +.toast-warning strong { + border-top-color: #fbc982; +} .toast-danger { color: #471d1b; background-color: #facfce; - border-color: #f8bfbd; } - .toast-danger strong { - border-top-color: #f6a9a6; } + border-color: #f8bfbd; +} +.toast-danger strong { + border-top-color: #f6a9a6; +} .toast-light { color: #464748; background-color: #f8f9fa; - border-color: #f6f7f9; } - .toast-light strong { - border-top-color: #e7e9ef; } + border-color: #f6f7f9; +} +.toast-light strong { + border-top-color: #e7e9ef; +} .toast-dark { color: #0c0d0e; background-color: #bebfc1; - border-color: #a9aaac; } - .toast-dark strong { - border-top-color: #9c9d9f; } + border-color: #a9aaac; +} +.toast-dark strong { + border-top-color: #9c9d9f; +} /* Dropdown-item */ .dropdown-item.dropdown-item-primary { color: #fff; text-decoration: none; - background-color: #3a3f44; } - + background-color: #3a3f44; +} .dropdown-item.dropdown-item-outline-primary:hover { color: #fff; - background-color: #3a3f44; } - + background-color: #3a3f44; +} .dropdown-item.dropdown-item-secondary { color: #fff; text-decoration: none; - background-color: #7a8288; } - + background-color: #7a8288; +} .dropdown-item.dropdown-item-outline-secondary:hover { color: #fff; - background-color: #7a8288; } - + background-color: #7a8288; +} .dropdown-item.dropdown-item-success { color: #fff; text-decoration: none; - background-color: #62c462; } - + background-color: #62c462; +} .dropdown-item.dropdown-item-outline-success:hover { color: #fff; - background-color: #62c462; } - + background-color: #62c462; +} .dropdown-item.dropdown-item-info { color: #fff; text-decoration: none; - background-color: #5bc0de; } - + background-color: #5bc0de; +} .dropdown-item.dropdown-item-outline-info:hover { color: #fff; - background-color: #5bc0de; } - + background-color: #5bc0de; +} .dropdown-item.dropdown-item-warning { color: #fff; text-decoration: none; - background-color: #f89406; } - + background-color: #f89406; +} .dropdown-item.dropdown-item-outline-warning:hover { color: #fff; - background-color: #f89406; } - + background-color: #f89406; +} .dropdown-item.dropdown-item-danger { color: #fff; text-decoration: none; - background-color: #ee5f5b; } - + background-color: #ee5f5b; +} .dropdown-item.dropdown-item-outline-danger:hover { color: #fff; - background-color: #ee5f5b; } - + background-color: #ee5f5b; +} .dropdown-item.dropdown-item-light { color: #000; text-decoration: none; - background-color: #e9ecef; } - + background-color: #e9ecef; +} .dropdown-item.dropdown-item-outline-light:hover { color: #000; - background-color: #e9ecef; } - + background-color: #e9ecef; +} .dropdown-item.dropdown-item-dark { color: #fff; text-decoration: none; - background-color: #272b30; } - + background-color: #272b30; +} .dropdown-item.dropdown-item-outline-dark:hover { color: #fff; - background-color: #272b30; } + background-color: #272b30; +} /* Progress Timeline */ .progress-timeline { - padding: 0.2em 0.2em 0.5em 0.2em; } - .progress-timeline ul { - position: relative; - padding: 0; } - .progress-timeline li { - list-style-type: none; - position: relative; } - .progress-timeline li.progress-inactive { - opacity: 0.5; } - .progress-timeline .progress-line { - height: 2px; } - .progress-timeline .progress-line.progress-inactive { - opacity: 0.5; } + padding: 0.2em 0.2em 0.5em 0.2em; +} +.progress-timeline ul { + position: relative; + padding: 0; +} +.progress-timeline li { + list-style-type: none; + position: relative; +} +.progress-timeline li.progress-inactive { + opacity: 0.5; +} +.progress-timeline .progress-line { + height: 2px; +} +.progress-timeline .progress-line.progress-inactive { + opacity: 0.5; +} /* Forms severity */ .form-control.is-invalid.info { - background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%235bc0de' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%235bc0de' stroke='none'/%3e%3c/svg%3e"); } - .form-control.is-invalid.info:focus { - border-color: #5bc0de; - box-shadow: 0 0 0 0.25rem rgba(91, 192, 222, 0.25); } - + background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%235bc0de' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%235bc0de' stroke='none'/%3e%3c/svg%3e"); +} +.form-control.is-invalid.info:focus { + border-color: #5bc0de; + box-shadow: 0 0 0 0.25rem rgba(91, 192, 222, 0.25); +} .form-control.is-invalid.warning { - background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23f89406' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23f89406' stroke='none'/%3e%3c/svg%3e"); } - .form-control.is-invalid.warning:focus { - border-color: #f89406; - box-shadow: 0 0 0 0.25rem rgba(248, 148, 6, 0.25); } + background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23f89406' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23f89406' stroke='none'/%3e%3c/svg%3e"); +} +.form-control.is-invalid.warning:focus { + border-color: #f89406; + box-shadow: 0 0 0 0.25rem rgba(248, 148, 6, 0.25); +} .form-select.is-invalid:not([multiple]):not([size]).info, .form-select.is-invalid:not([multiple])[size="1"] .form-select.is-invalid.info { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%235bc0de'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%235bc0de' stroke='none'/%3e%3c/svg%3e"); - background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); } - .form-select.is-invalid:not([multiple]):not([size]).info:focus, - .form-select.is-invalid:not([multiple])[size="1"] .form-select.is-invalid.info:focus { - box-shadow: 0 0 0 0.25rem rgba(91, 192, 222, 0.25); } - + background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); +} +.form-select.is-invalid:not([multiple]):not([size]).info:focus, +.form-select.is-invalid:not([multiple])[size="1"] .form-select.is-invalid.info:focus { + box-shadow: 0 0 0 0.25rem rgba(91, 192, 222, 0.25); +} .form-select.is-invalid:not([multiple]):not([size]).warning, .form-select.is-invalid:not([multiple])[size="1"] .form-select.is-invalid.warning { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23f89406'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23f89406' stroke='none'/%3e%3c/svg%3e"); - background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); } - .form-select.is-invalid:not([multiple]):not([size]).warning:focus, - .form-select.is-invalid:not([multiple])[size="1"] .form-select.is-invalid.warning:focus { - box-shadow: 0 0 0 0.25rem rgba(248, 148, 6, 0.25); } + background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); +} +.form-select.is-invalid:not([multiple]):not([size]).warning:focus, +.form-select.is-invalid:not([multiple])[size="1"] .form-select.is-invalid.warning:focus { + box-shadow: 0 0 0 0.25rem rgba(248, 148, 6, 0.25); +} .form-check-input.is-invalid.info { - border-color: #5bc0de; } - + border-color: #5bc0de; +} .form-check-input.is-invalid.info:checked { - background-color: #5bc0de; } - + background-color: #5bc0de; +} .form-check-input.is-invalid.info ~ .form-check-label { - color: unset; } - + color: unset; +} .form-check-input.is-invalid.info:focus { - box-shadow: 0 0 0 0.2rem rgba(91, 192, 222, 0.25); } - + box-shadow: 0 0 0 0.2rem rgba(91, 192, 222, 0.25); +} .form-check-input.is-invalid.warning { - border-color: #f89406; } - + border-color: #f89406; +} .form-check-input.is-invalid.warning:checked { - background-color: #f89406; } - + background-color: #f89406; +} .form-check-input.is-invalid.warning ~ .form-check-label { - color: unset; } - + color: unset; +} .form-check-input.is-invalid.warning:focus { - box-shadow: 0 0 0 0.2rem rgba(248, 148, 6, 0.25); } + box-shadow: 0 0 0 0.2rem rgba(248, 148, 6, 0.25); +} /* Utilities */ .mw-75 { - max-width: 75% !important; } + max-width: 75% !important; +} .mw-50 { - max-width: 50% !important; } + max-width: 50% !important; +} .mw-25 { - max-width: 25% !important; } + max-width: 25% !important; +} .mh-75 { - max-height: 75% !important; } + max-height: 75% !important; +} .mh-50 { - max-height: 50% !important; } + max-height: 50% !important; +} .mh-25 { - max-height: 25% !important; } + max-height: 25% !important; +} .p-abs-center-y { top: 50%; - transform: translateY(-50%); } + transform: translateY(-50%); +} .p-abs-center-x { left: 50%; - transform: translateX(-50%); } + transform: translateX(-50%); +} .p-abs-center-both { top: 50%; left: 50%; - transform: translateX(-50%) translateY(-50%); } + transform: translateX(-50%) translateY(-50%); +} /* Body */ body { @@ -286,90 +335,114 @@ body { /* background by SVGBackgrounds.com */ background-attachment: fixed; background-size: cover; - background-blend-mode: normal; } + background-blend-mode: normal; +} .panel { background-color: #363636; border: 1px solid #454545; - box-shadow: none; } + box-shadow: none; +} .loading-overlay { background-color: #272b30; - opacity: 0.65; } + opacity: 0.65; +} /* Top navbar */ .top-navbar { - background-color: #3a3f44; } + background-color: #3a3f44; +} .center-navbar nav.header-breadcrumb { - color: #fff; } + color: #fff; +} header.top-navbar .header-menu > a:hover, header.top-navbar .header-breadcrumb .header-breadcrumb-item > a:hover { - color: #d6d6d6 !important; } + color: #d6d6d6 !important; +} .top-navbar .center-navbar nav.header-breadcrumb li.header-breadcrumb-item a { - color: #fff; } + color: #fff; +} .top-navbar .right-navbar .header-menu a.nav-link { - color: #fff; } + color: #fff; +} .top-navbar .left-navbar .navbar-brand img { - filter: invert(1); } + filter: invert(1); +} .top-navbar .left-navbar .navbar-brand:hover img { - filter: invert(1) drop-shadow(0px 0px 3px #fff); } + filter: invert(1) drop-shadow(0px 0px 3px #fff); +} .top-navbar .composed-app-icon-container > .app-icon { - background-color: #fff; } + background-color: #fff; +} .breadcrumb-link-container { box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.16), 0 2px 6px 0 rgba(0, 0, 0, 0.12); - background-color: #e9ecef; } + background-color: #e9ecef; +} /* Sidebar */ .sidebar { - transition: width .08s linear; + transition: width 0.08s linear; box-shadow: none; - background-color: #7a8288; } + background-color: #7a8288; +} .sidebar ~ main.content:after { - background: #000; } + background: #000; +} .sidebar .sidebar-wrapper { - border-right: 1px solid none; } + border-right: 1px solid none; +} .sidebar .sidebar-wrapper { - border-right: 1px solid rgba(0, 0, 0, 0.125); } + border-right: 1px solid rgba(0, 0, 0, 0.125); +} .sidebar ul.sidebar-elements li > a.sidebar-link { - color: #fff; } + color: #fff; +} .sidebar ul.sidebar-elements li > a.sidebar-link.active { background-color: #595f64; - color: #fff; } + color: #fff; +} .sidebar ul.sidebar-elements li > a.sidebar-link.have-active-child { background-color: #595f64; - color: #fff; } + color: #fff; +} .sidebar ul.sidebar-elements li > a.sidebar-link:hover { background-color: #60676c; - color: #fff; } + color: #fff; +} .sidebar.expanded ul.sidebar-elements li > a.sidebar-link.have-active-child, .sidebar:hover ul.sidebar-elements li > a.sidebar-link.have-active-child { - background-color: unset; } + background-color: unset; +} .sidebar.expanded ul.sidebar-elements li > a.sidebar-link.have-active-child:hover, .sidebar:hover ul.sidebar-elements li > a.sidebar-link.have-active-child:hover { - background-color: #60676c; } + background-color: #60676c; +} ul.sidebar-elements li > a.sidebar-link.active::after { - background-color: var(--cerebrate-color); } + background-color: var(--cerebrate-color); +} .lock-sidebar > a.btn { - background-color: #7a8288; } + background-color: #7a8288; +} .btn { display: inline-block; @@ -386,455 +459,518 @@ ul.sidebar-elements li > a.sidebar-link.active::after { padding: 0.375rem 0.75rem; font-size: 1rem; border-radius: 0.25rem; - transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; } - @media (prefers-reduced-motion: reduce) { - .btn { - transition: none; } } - .btn:hover { - color: #aaa; } - .btn-check:focus + .btn, .btn:focus { - outline: 0; - box-shadow: 0 0 0 0.25rem rgba(58, 63, 68, 0.25); } - .btn:disabled, .btn.disabled, - fieldset:disabled .btn { - pointer-events: none; - opacity: 0.65; } + transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; +} +@media (prefers-reduced-motion: reduce) { + .btn { + transition: none; + } +} +.btn:hover { + color: #aaa; +} +.btn-check:focus + .btn, .btn:focus { + outline: 0; + box-shadow: 0 0 0 0.25rem rgba(58, 63, 68, 0.25); +} +.btn:disabled, .btn.disabled, fieldset:disabled .btn { + pointer-events: none; + opacity: 0.65; +} .btn-primary { color: #fff; background-color: #3a3f44; - border-color: #3a3f44; } - .btn-primary:hover { - color: #fff; - background-color: #31363a; - border-color: #2e3236; } - .btn-check:focus + .btn-primary, .btn-primary:focus { - color: #fff; - background-color: #31363a; - border-color: #2e3236; - box-shadow: 0 0 0 0.25rem rgba(88, 92, 96, 0.5); } - .btn-check:checked + .btn-primary, - .btn-check:active + .btn-primary, .btn-primary:active, .btn-primary.active, - .show > .btn-primary.dropdown-toggle { - color: #fff; - background-color: #2e3236; - border-color: #2c2f33; } - .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(88, 92, 96, 0.5); } - .btn-primary:disabled, .btn-primary.disabled { - color: #fff; - background-color: #3a3f44; - border-color: #3a3f44; } + border-color: #3a3f44; +} +.btn-primary:hover { + color: #fff; + background-color: #31363a; + border-color: #2e3236; +} +.btn-check:focus + .btn-primary, .btn-primary:focus { + color: #fff; + background-color: #31363a; + border-color: #2e3236; + box-shadow: 0 0 0 0.25rem rgba(88, 92, 96, 0.5); +} +.btn-check:checked + .btn-primary, .btn-check:active + .btn-primary, .btn-primary:active, .btn-primary.active, .show > .btn-primary.dropdown-toggle { + color: #fff; + background-color: #2e3236; + border-color: #2c2f33; +} +.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(88, 92, 96, 0.5); +} +.btn-primary:disabled, .btn-primary.disabled { + color: #fff; + background-color: #3a3f44; + border-color: #3a3f44; +} .btn-secondary { color: #fff; background-color: #7a8288; - border-color: #7a8288; } - .btn-secondary:hover { - color: #fff; - background-color: #686f74; - border-color: #62686d; } - .btn-check:focus + .btn-secondary, .btn-secondary:focus { - color: #fff; - background-color: #686f74; - border-color: #62686d; - box-shadow: 0 0 0 0.25rem rgba(142, 149, 154, 0.5); } - .btn-check:checked + .btn-secondary, - .btn-check:active + .btn-secondary, .btn-secondary:active, .btn-secondary.active, - .show > .btn-secondary.dropdown-toggle { - color: #fff; - background-color: #62686d; - border-color: #5c6266; } - .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(142, 149, 154, 0.5); } - .btn-secondary:disabled, .btn-secondary.disabled { - color: #fff; - background-color: #7a8288; - border-color: #7a8288; } + border-color: #7a8288; +} +.btn-secondary:hover { + color: #fff; + background-color: #686f74; + border-color: #62686d; +} +.btn-check:focus + .btn-secondary, .btn-secondary:focus { + color: #fff; + background-color: #686f74; + border-color: #62686d; + box-shadow: 0 0 0 0.25rem rgba(142, 149, 154, 0.5); +} +.btn-check:checked + .btn-secondary, .btn-check:active + .btn-secondary, .btn-secondary:active, .btn-secondary.active, .show > .btn-secondary.dropdown-toggle { + color: #fff; + background-color: #62686d; + border-color: #5c6266; +} +.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(142, 149, 154, 0.5); +} +.btn-secondary:disabled, .btn-secondary.disabled { + color: #fff; + background-color: #7a8288; + border-color: #7a8288; +} .btn-success { color: #fff; background-color: #62c462; - border-color: #62c462; } - .btn-success:hover { - color: #fff; - background-color: #53a753; - border-color: #4e9d4e; } - .btn-check:focus + .btn-success, .btn-success:focus { - color: #fff; - background-color: #53a753; - border-color: #4e9d4e; - box-shadow: 0 0 0 0.25rem rgba(122, 205, 122, 0.5); } - .btn-check:checked + .btn-success, - .btn-check:active + .btn-success, .btn-success:active, .btn-success.active, - .show > .btn-success.dropdown-toggle { - color: #fff; - background-color: #4e9d4e; - border-color: #4a934a; } - .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(122, 205, 122, 0.5); } - .btn-success:disabled, .btn-success.disabled { - color: #fff; - background-color: #62c462; - border-color: #62c462; } + border-color: #62c462; +} +.btn-success:hover { + color: #fff; + background-color: #53a753; + border-color: #4e9d4e; +} +.btn-check:focus + .btn-success, .btn-success:focus { + color: #fff; + background-color: #53a753; + border-color: #4e9d4e; + box-shadow: 0 0 0 0.25rem rgba(122, 205, 122, 0.5); +} +.btn-check:checked + .btn-success, .btn-check:active + .btn-success, .btn-success:active, .btn-success.active, .show > .btn-success.dropdown-toggle { + color: #fff; + background-color: #4e9d4e; + border-color: #4a934a; +} +.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(122, 205, 122, 0.5); +} +.btn-success:disabled, .btn-success.disabled { + color: #fff; + background-color: #62c462; + border-color: #62c462; +} .btn-info { color: #fff; background-color: #5bc0de; - border-color: #5bc0de; } - .btn-info:hover { - color: #fff; - background-color: #4da3bd; - border-color: #499ab2; } - .btn-check:focus + .btn-info, .btn-info:focus { - color: #fff; - background-color: #4da3bd; - border-color: #499ab2; - box-shadow: 0 0 0 0.25rem rgba(116, 201, 227, 0.5); } - .btn-check:checked + .btn-info, - .btn-check:active + .btn-info, .btn-info:active, .btn-info.active, - .show > .btn-info.dropdown-toggle { - color: #fff; - background-color: #499ab2; - border-color: #4490a7; } - .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(116, 201, 227, 0.5); } - .btn-info:disabled, .btn-info.disabled { - color: #fff; - background-color: #5bc0de; - border-color: #5bc0de; } + border-color: #5bc0de; +} +.btn-info:hover { + color: #fff; + background-color: #4da3bd; + border-color: #499ab2; +} +.btn-check:focus + .btn-info, .btn-info:focus { + color: #fff; + background-color: #4da3bd; + border-color: #499ab2; + box-shadow: 0 0 0 0.25rem rgba(116, 201, 227, 0.5); +} +.btn-check:checked + .btn-info, .btn-check:active + .btn-info, .btn-info:active, .btn-info.active, .show > .btn-info.dropdown-toggle { + color: #fff; + background-color: #499ab2; + border-color: #4490a7; +} +.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(116, 201, 227, 0.5); +} +.btn-info:disabled, .btn-info.disabled { + color: #fff; + background-color: #5bc0de; + border-color: #5bc0de; +} .btn-warning { color: #fff; background-color: #f89406; - border-color: #f89406; } - .btn-warning:hover { - color: #fff; - background-color: #d37e05; - border-color: #c67605; } - .btn-check:focus + .btn-warning, .btn-warning:focus { - color: #fff; - background-color: #d37e05; - border-color: #c67605; - box-shadow: 0 0 0 0.25rem rgba(249, 164, 43, 0.5); } - .btn-check:checked + .btn-warning, - .btn-check:active + .btn-warning, .btn-warning:active, .btn-warning.active, - .show > .btn-warning.dropdown-toggle { - color: #fff; - background-color: #c67605; - border-color: #ba6f05; } - .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(249, 164, 43, 0.5); } - .btn-warning:disabled, .btn-warning.disabled { - color: #fff; - background-color: #f89406; - border-color: #f89406; } + border-color: #f89406; +} +.btn-warning:hover { + color: #fff; + background-color: #d37e05; + border-color: #c67605; +} +.btn-check:focus + .btn-warning, .btn-warning:focus { + color: #fff; + background-color: #d37e05; + border-color: #c67605; + box-shadow: 0 0 0 0.25rem rgba(249, 164, 43, 0.5); +} +.btn-check:checked + .btn-warning, .btn-check:active + .btn-warning, .btn-warning:active, .btn-warning.active, .show > .btn-warning.dropdown-toggle { + color: #fff; + background-color: #c67605; + border-color: #ba6f05; +} +.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(249, 164, 43, 0.5); +} +.btn-warning:disabled, .btn-warning.disabled { + color: #fff; + background-color: #f89406; + border-color: #f89406; +} .btn-danger { color: #fff; background-color: #ee5f5b; - border-color: #ee5f5b; } - .btn-danger:hover { - color: #fff; - background-color: #ca514d; - border-color: #be4c49; } - .btn-check:focus + .btn-danger, .btn-danger:focus { - color: #fff; - background-color: #ca514d; - border-color: #be4c49; - box-shadow: 0 0 0 0.25rem rgba(241, 119, 116, 0.5); } - .btn-check:checked + .btn-danger, - .btn-check:active + .btn-danger, .btn-danger:active, .btn-danger.active, - .show > .btn-danger.dropdown-toggle { - color: #fff; - background-color: #be4c49; - border-color: #b34744; } - .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(241, 119, 116, 0.5); } - .btn-danger:disabled, .btn-danger.disabled { - color: #fff; - background-color: #ee5f5b; - border-color: #ee5f5b; } + border-color: #ee5f5b; +} +.btn-danger:hover { + color: #fff; + background-color: #ca514d; + border-color: #be4c49; +} +.btn-check:focus + .btn-danger, .btn-danger:focus { + color: #fff; + background-color: #ca514d; + border-color: #be4c49; + box-shadow: 0 0 0 0.25rem rgba(241, 119, 116, 0.5); +} +.btn-check:checked + .btn-danger, .btn-check:active + .btn-danger, .btn-danger:active, .btn-danger.active, .show > .btn-danger.dropdown-toggle { + color: #fff; + background-color: #be4c49; + border-color: #b34744; +} +.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(241, 119, 116, 0.5); +} +.btn-danger:disabled, .btn-danger.disabled { + color: #fff; + background-color: #ee5f5b; + border-color: #ee5f5b; +} .btn-light { color: #000; background-color: #e9ecef; - border-color: #e9ecef; } - .btn-light:hover { - color: #000; - background-color: #eceff1; - border-color: #ebeef1; } - .btn-check:focus + .btn-light, .btn-light:focus { - color: #000; - background-color: #eceff1; - border-color: #ebeef1; - box-shadow: 0 0 0 0.25rem rgba(198, 201, 203, 0.5); } - .btn-check:checked + .btn-light, - .btn-check:active + .btn-light, .btn-light:active, .btn-light.active, - .show > .btn-light.dropdown-toggle { - color: #000; - background-color: #edf0f2; - border-color: #ebeef1; } - .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(198, 201, 203, 0.5); } - .btn-light:disabled, .btn-light.disabled { - color: #000; - background-color: #e9ecef; - border-color: #e9ecef; } + border-color: #e9ecef; +} +.btn-light:hover { + color: #000; + background-color: #eceff1; + border-color: #ebeef1; +} +.btn-check:focus + .btn-light, .btn-light:focus { + color: #000; + background-color: #eceff1; + border-color: #ebeef1; + box-shadow: 0 0 0 0.25rem rgba(198, 201, 203, 0.5); +} +.btn-check:checked + .btn-light, .btn-check:active + .btn-light, .btn-light:active, .btn-light.active, .show > .btn-light.dropdown-toggle { + color: #000; + background-color: #edf0f2; + border-color: #ebeef1; +} +.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(198, 201, 203, 0.5); +} +.btn-light:disabled, .btn-light.disabled { + color: #000; + background-color: #e9ecef; + border-color: #e9ecef; +} .btn-dark { color: #fff; background-color: #272b30; - border-color: #272b30; } - .btn-dark:hover { - color: #fff; - background-color: #212529; - border-color: #1f2226; } - .btn-check:focus + .btn-dark, .btn-dark:focus { - color: #fff; - background-color: #212529; - border-color: #1f2226; - box-shadow: 0 0 0 0.25rem rgba(71, 75, 79, 0.5); } - .btn-check:checked + .btn-dark, - .btn-check:active + .btn-dark, .btn-dark:active, .btn-dark.active, - .show > .btn-dark.dropdown-toggle { - color: #fff; - background-color: #1f2226; - border-color: #1d2024; } - .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(71, 75, 79, 0.5); } - .btn-dark:disabled, .btn-dark.disabled { - color: #fff; - background-color: #272b30; - border-color: #272b30; } + border-color: #272b30; +} +.btn-dark:hover { + color: #fff; + background-color: #212529; + border-color: #1f2226; +} +.btn-check:focus + .btn-dark, .btn-dark:focus { + color: #fff; + background-color: #212529; + border-color: #1f2226; + box-shadow: 0 0 0 0.25rem rgba(71, 75, 79, 0.5); +} +.btn-check:checked + .btn-dark, .btn-check:active + .btn-dark, .btn-dark:active, .btn-dark.active, .show > .btn-dark.dropdown-toggle { + color: #fff; + background-color: #1f2226; + border-color: #1d2024; +} +.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(71, 75, 79, 0.5); +} +.btn-dark:disabled, .btn-dark.disabled { + color: #fff; + background-color: #272b30; + border-color: #272b30; +} .btn-outline-primary { color: #3a3f44; - border-color: #3a3f44; } - .btn-outline-primary:hover { - color: #fff; - background-color: #3a3f44; - border-color: #3a3f44; } - .btn-check:focus + .btn-outline-primary, .btn-outline-primary:focus { - box-shadow: 0 0 0 0.25rem rgba(58, 63, 68, 0.5); } - .btn-check:checked + .btn-outline-primary, - .btn-check:active + .btn-outline-primary, .btn-outline-primary:active, .btn-outline-primary.active, .btn-outline-primary.dropdown-toggle.show { - color: #fff; - background-color: #3a3f44; - border-color: #3a3f44; } - .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(58, 63, 68, 0.5); } - .btn-outline-primary:disabled, .btn-outline-primary.disabled { - color: #3a3f44; - background-color: transparent; } + border-color: #3a3f44; +} +.btn-outline-primary:hover { + color: #fff; + background-color: #3a3f44; + border-color: #3a3f44; +} +.btn-check:focus + .btn-outline-primary, .btn-outline-primary:focus { + box-shadow: 0 0 0 0.25rem rgba(58, 63, 68, 0.5); +} +.btn-check:checked + .btn-outline-primary, .btn-check:active + .btn-outline-primary, .btn-outline-primary:active, .btn-outline-primary.active, .btn-outline-primary.dropdown-toggle.show { + color: #fff; + background-color: #3a3f44; + border-color: #3a3f44; +} +.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(58, 63, 68, 0.5); +} +.btn-outline-primary:disabled, .btn-outline-primary.disabled { + color: #3a3f44; + background-color: transparent; +} .btn-outline-secondary { color: #7a8288; - border-color: #7a8288; } - .btn-outline-secondary:hover { - color: #fff; - background-color: #7a8288; - border-color: #7a8288; } - .btn-check:focus + .btn-outline-secondary, .btn-outline-secondary:focus { - box-shadow: 0 0 0 0.25rem rgba(122, 130, 136, 0.5); } - .btn-check:checked + .btn-outline-secondary, - .btn-check:active + .btn-outline-secondary, .btn-outline-secondary:active, .btn-outline-secondary.active, .btn-outline-secondary.dropdown-toggle.show { - color: #fff; - background-color: #7a8288; - border-color: #7a8288; } - .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(122, 130, 136, 0.5); } - .btn-outline-secondary:disabled, .btn-outline-secondary.disabled { - color: #7a8288; - background-color: transparent; } + border-color: #7a8288; +} +.btn-outline-secondary:hover { + color: #fff; + background-color: #7a8288; + border-color: #7a8288; +} +.btn-check:focus + .btn-outline-secondary, .btn-outline-secondary:focus { + box-shadow: 0 0 0 0.25rem rgba(122, 130, 136, 0.5); +} +.btn-check:checked + .btn-outline-secondary, .btn-check:active + .btn-outline-secondary, .btn-outline-secondary:active, .btn-outline-secondary.active, .btn-outline-secondary.dropdown-toggle.show { + color: #fff; + background-color: #7a8288; + border-color: #7a8288; +} +.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(122, 130, 136, 0.5); +} +.btn-outline-secondary:disabled, .btn-outline-secondary.disabled { + color: #7a8288; + background-color: transparent; +} .btn-outline-success { color: #62c462; - border-color: #62c462; } - .btn-outline-success:hover { - color: #fff; - background-color: #62c462; - border-color: #62c462; } - .btn-check:focus + .btn-outline-success, .btn-outline-success:focus { - box-shadow: 0 0 0 0.25rem rgba(98, 196, 98, 0.5); } - .btn-check:checked + .btn-outline-success, - .btn-check:active + .btn-outline-success, .btn-outline-success:active, .btn-outline-success.active, .btn-outline-success.dropdown-toggle.show { - color: #fff; - background-color: #62c462; - border-color: #62c462; } - .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(98, 196, 98, 0.5); } - .btn-outline-success:disabled, .btn-outline-success.disabled { - color: #62c462; - background-color: transparent; } + border-color: #62c462; +} +.btn-outline-success:hover { + color: #fff; + background-color: #62c462; + border-color: #62c462; +} +.btn-check:focus + .btn-outline-success, .btn-outline-success:focus { + box-shadow: 0 0 0 0.25rem rgba(98, 196, 98, 0.5); +} +.btn-check:checked + .btn-outline-success, .btn-check:active + .btn-outline-success, .btn-outline-success:active, .btn-outline-success.active, .btn-outline-success.dropdown-toggle.show { + color: #fff; + background-color: #62c462; + border-color: #62c462; +} +.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(98, 196, 98, 0.5); +} +.btn-outline-success:disabled, .btn-outline-success.disabled { + color: #62c462; + background-color: transparent; +} .btn-outline-info { color: #5bc0de; - border-color: #5bc0de; } - .btn-outline-info:hover { - color: #fff; - background-color: #5bc0de; - border-color: #5bc0de; } - .btn-check:focus + .btn-outline-info, .btn-outline-info:focus { - box-shadow: 0 0 0 0.25rem rgba(91, 192, 222, 0.5); } - .btn-check:checked + .btn-outline-info, - .btn-check:active + .btn-outline-info, .btn-outline-info:active, .btn-outline-info.active, .btn-outline-info.dropdown-toggle.show { - color: #fff; - background-color: #5bc0de; - border-color: #5bc0de; } - .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(91, 192, 222, 0.5); } - .btn-outline-info:disabled, .btn-outline-info.disabled { - color: #5bc0de; - background-color: transparent; } + border-color: #5bc0de; +} +.btn-outline-info:hover { + color: #fff; + background-color: #5bc0de; + border-color: #5bc0de; +} +.btn-check:focus + .btn-outline-info, .btn-outline-info:focus { + box-shadow: 0 0 0 0.25rem rgba(91, 192, 222, 0.5); +} +.btn-check:checked + .btn-outline-info, .btn-check:active + .btn-outline-info, .btn-outline-info:active, .btn-outline-info.active, .btn-outline-info.dropdown-toggle.show { + color: #fff; + background-color: #5bc0de; + border-color: #5bc0de; +} +.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(91, 192, 222, 0.5); +} +.btn-outline-info:disabled, .btn-outline-info.disabled { + color: #5bc0de; + background-color: transparent; +} .btn-outline-warning { color: #f89406; - border-color: #f89406; } - .btn-outline-warning:hover { - color: #fff; - background-color: #f89406; - border-color: #f89406; } - .btn-check:focus + .btn-outline-warning, .btn-outline-warning:focus { - box-shadow: 0 0 0 0.25rem rgba(248, 148, 6, 0.5); } - .btn-check:checked + .btn-outline-warning, - .btn-check:active + .btn-outline-warning, .btn-outline-warning:active, .btn-outline-warning.active, .btn-outline-warning.dropdown-toggle.show { - color: #fff; - background-color: #f89406; - border-color: #f89406; } - .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(248, 148, 6, 0.5); } - .btn-outline-warning:disabled, .btn-outline-warning.disabled { - color: #f89406; - background-color: transparent; } + border-color: #f89406; +} +.btn-outline-warning:hover { + color: #fff; + background-color: #f89406; + border-color: #f89406; +} +.btn-check:focus + .btn-outline-warning, .btn-outline-warning:focus { + box-shadow: 0 0 0 0.25rem rgba(248, 148, 6, 0.5); +} +.btn-check:checked + .btn-outline-warning, .btn-check:active + .btn-outline-warning, .btn-outline-warning:active, .btn-outline-warning.active, .btn-outline-warning.dropdown-toggle.show { + color: #fff; + background-color: #f89406; + border-color: #f89406; +} +.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(248, 148, 6, 0.5); +} +.btn-outline-warning:disabled, .btn-outline-warning.disabled { + color: #f89406; + background-color: transparent; +} .btn-outline-danger { color: #ee5f5b; - border-color: #ee5f5b; } - .btn-outline-danger:hover { - color: #fff; - background-color: #ee5f5b; - border-color: #ee5f5b; } - .btn-check:focus + .btn-outline-danger, .btn-outline-danger:focus { - box-shadow: 0 0 0 0.25rem rgba(238, 95, 91, 0.5); } - .btn-check:checked + .btn-outline-danger, - .btn-check:active + .btn-outline-danger, .btn-outline-danger:active, .btn-outline-danger.active, .btn-outline-danger.dropdown-toggle.show { - color: #fff; - background-color: #ee5f5b; - border-color: #ee5f5b; } - .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(238, 95, 91, 0.5); } - .btn-outline-danger:disabled, .btn-outline-danger.disabled { - color: #ee5f5b; - background-color: transparent; } + border-color: #ee5f5b; +} +.btn-outline-danger:hover { + color: #fff; + background-color: #ee5f5b; + border-color: #ee5f5b; +} +.btn-check:focus + .btn-outline-danger, .btn-outline-danger:focus { + box-shadow: 0 0 0 0.25rem rgba(238, 95, 91, 0.5); +} +.btn-check:checked + .btn-outline-danger, .btn-check:active + .btn-outline-danger, .btn-outline-danger:active, .btn-outline-danger.active, .btn-outline-danger.dropdown-toggle.show { + color: #fff; + background-color: #ee5f5b; + border-color: #ee5f5b; +} +.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(238, 95, 91, 0.5); +} +.btn-outline-danger:disabled, .btn-outline-danger.disabled { + color: #ee5f5b; + background-color: transparent; +} .btn-outline-light { color: #e9ecef; - border-color: #e9ecef; } - .btn-outline-light:hover { - color: #000; - background-color: #e9ecef; - border-color: #e9ecef; } - .btn-check:focus + .btn-outline-light, .btn-outline-light:focus { - box-shadow: 0 0 0 0.25rem rgba(233, 236, 239, 0.5); } - .btn-check:checked + .btn-outline-light, - .btn-check:active + .btn-outline-light, .btn-outline-light:active, .btn-outline-light.active, .btn-outline-light.dropdown-toggle.show { - color: #000; - background-color: #e9ecef; - border-color: #e9ecef; } - .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(233, 236, 239, 0.5); } - .btn-outline-light:disabled, .btn-outline-light.disabled { - color: #e9ecef; - background-color: transparent; } + border-color: #e9ecef; +} +.btn-outline-light:hover { + color: #000; + background-color: #e9ecef; + border-color: #e9ecef; +} +.btn-check:focus + .btn-outline-light, .btn-outline-light:focus { + box-shadow: 0 0 0 0.25rem rgba(233, 236, 239, 0.5); +} +.btn-check:checked + .btn-outline-light, .btn-check:active + .btn-outline-light, .btn-outline-light:active, .btn-outline-light.active, .btn-outline-light.dropdown-toggle.show { + color: #000; + background-color: #e9ecef; + border-color: #e9ecef; +} +.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(233, 236, 239, 0.5); +} +.btn-outline-light:disabled, .btn-outline-light.disabled { + color: #e9ecef; + background-color: transparent; +} .btn-outline-dark { color: #272b30; - border-color: #272b30; } - .btn-outline-dark:hover { - color: #fff; - background-color: #272b30; - border-color: #272b30; } - .btn-check:focus + .btn-outline-dark, .btn-outline-dark:focus { - box-shadow: 0 0 0 0.25rem rgba(39, 43, 48, 0.5); } - .btn-check:checked + .btn-outline-dark, - .btn-check:active + .btn-outline-dark, .btn-outline-dark:active, .btn-outline-dark.active, .btn-outline-dark.dropdown-toggle.show { - color: #fff; - background-color: #272b30; - border-color: #272b30; } - .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(39, 43, 48, 0.5); } - .btn-outline-dark:disabled, .btn-outline-dark.disabled { - color: #272b30; - background-color: transparent; } + border-color: #272b30; +} +.btn-outline-dark:hover { + color: #fff; + background-color: #272b30; + border-color: #272b30; +} +.btn-check:focus + .btn-outline-dark, .btn-outline-dark:focus { + box-shadow: 0 0 0 0.25rem rgba(39, 43, 48, 0.5); +} +.btn-check:checked + .btn-outline-dark, .btn-check:active + .btn-outline-dark, .btn-outline-dark:active, .btn-outline-dark.active, .btn-outline-dark.dropdown-toggle.show { + color: #fff; + background-color: #272b30; + border-color: #272b30; +} +.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(39, 43, 48, 0.5); +} +.btn-outline-dark:disabled, .btn-outline-dark.disabled { + color: #272b30; + background-color: transparent; +} .btn-link { font-weight: 400; color: #fff; - text-decoration: underline; } - .btn-link:hover { - color: #cccccc; } - .btn-link:disabled, .btn-link.disabled { - color: #7a8288; } + text-decoration: underline; +} +.btn-link:hover { + color: #cccccc; +} +.btn-link:disabled, .btn-link.disabled { + color: #7a8288; +} .btn-lg { padding: 0.5rem 1rem; font-size: 1.25rem; - border-radius: 0.3rem; } + border-radius: 0.3rem; +} .btn-sm { padding: 0.25rem 0.5rem; font-size: 0.875rem; - border-radius: 0.2rem; } + border-radius: 0.2rem; +} .form-label { - margin-bottom: 0.5rem; } + margin-bottom: 0.5rem; +} .col-form-label { padding-top: calc(0.375rem + 1px); padding-bottom: calc(0.375rem + 1px); margin-bottom: 0; font-size: inherit; - line-height: 1.5; } + line-height: 1.5; +} .col-form-label-lg { padding-top: calc(0.5rem + 1px); padding-bottom: calc(0.5rem + 1px); - font-size: 1.25rem; } + font-size: 1.25rem; +} .col-form-label-sm { padding-top: calc(0.25rem + 1px); padding-bottom: calc(0.25rem + 1px); - font-size: 0.875rem; } + font-size: 0.875rem; +} .form-text { margin-top: 0.25rem; font-size: 0.875em; - color: #7a8288; } + color: #7a8288; +} .form-control { display: block; @@ -849,64 +985,81 @@ ul.sidebar-elements li > a.sidebar-link.active::after { border: 1px solid #ced4da; appearance: none; border-radius: 0.25rem; - transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; } - @media (prefers-reduced-motion: reduce) { - .form-control { - transition: none; } } - .form-control[type="file"] { - overflow: hidden; } - .form-control[type="file"]:not(:disabled):not([readonly]) { - cursor: pointer; } - .form-control:focus { - color: #272b30; - background-color: #fff; - border-color: #9d9fa2; - outline: 0; - box-shadow: 0 0 0 0.25rem rgba(58, 63, 68, 0.25); } - .form-control::-webkit-date-and-time-value { - height: 1.5em; } - .form-control::placeholder { - color: #7a8288; - opacity: 1; } - .form-control:disabled, .form-control[readonly] { - background-color: #ccc; - opacity: 1; } + transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; +} +@media (prefers-reduced-motion: reduce) { + .form-control { + transition: none; + } +} +.form-control[type=file] { + overflow: hidden; +} +.form-control[type=file]:not(:disabled):not([readonly]) { + cursor: pointer; +} +.form-control:focus { + color: #272b30; + background-color: #fff; + border-color: #9d9fa2; + outline: 0; + box-shadow: 0 0 0 0.25rem rgba(58, 63, 68, 0.25); +} +.form-control::-webkit-date-and-time-value { + height: 1.5em; +} +.form-control::placeholder { + color: #7a8288; + opacity: 1; +} +.form-control:disabled, .form-control[readonly] { + background-color: #ccc; + opacity: 1; +} +.form-control::file-selector-button { + padding: 0.375rem 0.75rem; + margin: -0.375rem -0.75rem; + margin-inline-end: 0.75rem; + color: #272b30; + background-color: #e9ecef; + pointer-events: none; + border-color: inherit; + border-style: solid; + border-width: 0; + border-inline-end-width: 1px; + border-radius: 0; + transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; +} +@media (prefers-reduced-motion: reduce) { .form-control::file-selector-button { - padding: 0.375rem 0.75rem; - margin: -0.375rem -0.75rem; - margin-inline-end: 0.75rem; - color: #272b30; - background-color: #e9ecef; - pointer-events: none; - border-color: inherit; - border-style: solid; - border-width: 0; - border-inline-end-width: 1px; - border-radius: 0; - transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; } - @media (prefers-reduced-motion: reduce) { - .form-control::file-selector-button { - transition: none; } } - .form-control:hover:not(:disabled):not([readonly])::file-selector-button { - background-color: #dde0e3; } + transition: none; + } +} +.form-control:hover:not(:disabled):not([readonly])::file-selector-button { + background-color: #dde0e3; +} +.form-control::-webkit-file-upload-button { + padding: 0.375rem 0.75rem; + margin: -0.375rem -0.75rem; + margin-inline-end: 0.75rem; + color: #272b30; + background-color: #e9ecef; + pointer-events: none; + border-color: inherit; + border-style: solid; + border-width: 0; + border-inline-end-width: 1px; + border-radius: 0; + transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; +} +@media (prefers-reduced-motion: reduce) { .form-control::-webkit-file-upload-button { - padding: 0.375rem 0.75rem; - margin: -0.375rem -0.75rem; - margin-inline-end: 0.75rem; - color: #272b30; - background-color: #e9ecef; - pointer-events: none; - border-color: inherit; - border-style: solid; - border-width: 0; - border-inline-end-width: 1px; - border-radius: 0; - transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; } - @media (prefers-reduced-motion: reduce) { - .form-control::-webkit-file-upload-button { - transition: none; } } - .form-control:hover:not(:disabled):not([readonly])::-webkit-file-upload-button { - background-color: #dde0e3; } + transition: none; + } +} +.form-control:hover:not(:disabled):not([readonly])::-webkit-file-upload-button { + background-color: #dde0e3; +} .form-control-plaintext { display: block; @@ -917,60 +1070,73 @@ ul.sidebar-elements li > a.sidebar-link.active::after { color: #aaa; background-color: transparent; border: solid transparent; - border-width: 1px 0; } - .form-control-plaintext.form-control-sm, .form-control-plaintext.form-control-lg { - padding-right: 0; - padding-left: 0; } + border-width: 1px 0; +} +.form-control-plaintext.form-control-sm, .form-control-plaintext.form-control-lg { + padding-right: 0; + padding-left: 0; +} .form-control-sm { min-height: calc(1.5em + 0.5rem + 2px); padding: 0.25rem 0.5rem; font-size: 0.875rem; - border-radius: 0.2rem; } - .form-control-sm::file-selector-button { - padding: 0.25rem 0.5rem; - margin: -0.25rem -0.5rem; - margin-inline-end: 0.5rem; } - .form-control-sm::-webkit-file-upload-button { - padding: 0.25rem 0.5rem; - margin: -0.25rem -0.5rem; - margin-inline-end: 0.5rem; } + border-radius: 0.2rem; +} +.form-control-sm::file-selector-button { + padding: 0.25rem 0.5rem; + margin: -0.25rem -0.5rem; + margin-inline-end: 0.5rem; +} +.form-control-sm::-webkit-file-upload-button { + padding: 0.25rem 0.5rem; + margin: -0.25rem -0.5rem; + margin-inline-end: 0.5rem; +} .form-control-lg { min-height: calc(1.5em + 1rem + 2px); padding: 0.5rem 1rem; font-size: 1.25rem; - border-radius: 0.3rem; } - .form-control-lg::file-selector-button { - padding: 0.5rem 1rem; - margin: -0.5rem -1rem; - margin-inline-end: 1rem; } - .form-control-lg::-webkit-file-upload-button { - padding: 0.5rem 1rem; - margin: -0.5rem -1rem; - margin-inline-end: 1rem; } + border-radius: 0.3rem; +} +.form-control-lg::file-selector-button { + padding: 0.5rem 1rem; + margin: -0.5rem -1rem; + margin-inline-end: 1rem; +} +.form-control-lg::-webkit-file-upload-button { + padding: 0.5rem 1rem; + margin: -0.5rem -1rem; + margin-inline-end: 1rem; +} textarea.form-control { - min-height: calc(1.5em + 0.75rem + 2px); } - + min-height: calc(1.5em + 0.75rem + 2px); +} textarea.form-control-sm { - min-height: calc(1.5em + 0.5rem + 2px); } - + min-height: calc(1.5em + 0.5rem + 2px); +} textarea.form-control-lg { - min-height: calc(1.5em + 1rem + 2px); } + min-height: calc(1.5em + 1rem + 2px); +} .form-control-color { width: 3rem; height: auto; - padding: 0.375rem; } - .form-control-color:not(:disabled):not([readonly]) { - cursor: pointer; } - .form-control-color::-moz-color-swatch { - height: 1.5em; - border-radius: 0.25rem; } - .form-control-color::-webkit-color-swatch { - height: 1.5em; - border-radius: 0.25rem; } + padding: 0.375rem; +} +.form-control-color:not(:disabled):not([readonly]) { + cursor: pointer; +} +.form-control-color::-moz-color-swatch { + height: 1.5em; + border-radius: 0.25rem; +} +.form-control-color::-webkit-color-swatch { + height: 1.5em; + border-radius: 0.25rem; +} .form-select { display: block; @@ -989,43 +1155,56 @@ textarea.form-control-lg { border: 1px solid #ced4da; border-radius: 0.25rem; transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; - appearance: none; } - @media (prefers-reduced-motion: reduce) { - .form-select { - transition: none; } } - .form-select:focus { - border-color: #9d9fa2; - outline: 0; - box-shadow: 0 0 0 0.25rem rgba(58, 63, 68, 0.25); } - .form-select[multiple], .form-select[size]:not([size="1"]) { - padding-right: 0.75rem; - background-image: none; } - .form-select:disabled { - background-color: #e9ecef; } - .form-select:-moz-focusring { - color: transparent; - text-shadow: 0 0 0 #272b30; } + appearance: none; +} +@media (prefers-reduced-motion: reduce) { + .form-select { + transition: none; + } +} +.form-select:focus { + border-color: #9d9fa2; + outline: 0; + box-shadow: 0 0 0 0.25rem rgba(58, 63, 68, 0.25); +} +.form-select[multiple], .form-select[size]:not([size="1"]) { + padding-right: 0.75rem; + background-image: none; +} +.form-select:disabled { + background-color: #e9ecef; +} +.form-select:-moz-focusring { + color: transparent; + text-shadow: 0 0 0 #272b30; +} .form-select-sm { padding-top: 0.25rem; padding-bottom: 0.25rem; padding-left: 0.5rem; - font-size: 0.875rem; } + font-size: 0.875rem; + border-radius: 0.2rem; +} .form-select-lg { padding-top: 0.5rem; padding-bottom: 0.5rem; padding-left: 1rem; - font-size: 1.25rem; } + font-size: 1.25rem; + border-radius: 0.3rem; +} .form-check { display: block; min-height: 1.5rem; padding-left: 1.5em; - margin-bottom: 0.125rem; } - .form-check .form-check-input { - float: left; - margin-left: -1.5em; } + margin-bottom: 0.125rem; +} +.form-check .form-check-input { + float: left; + margin-left: -1.5em; +} .form-check-input { width: 1em; @@ -1038,191 +1217,246 @@ textarea.form-control-lg { background-size: contain; border: 1px solid rgba(0, 0, 0, 0.25); appearance: none; - color-adjust: exact; } - .form-check-input[type="checkbox"] { - border-radius: 0.25em; } - .form-check-input[type="radio"] { - border-radius: 50%; } - .form-check-input:active { - filter: brightness(90%); } - .form-check-input:focus { - border-color: #9d9fa2; - outline: 0; - box-shadow: 0 0 0 0.25rem rgba(58, 63, 68, 0.25); } - .form-check-input:checked { - background-color: #3a3f44; - border-color: #3a3f44; } - .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"); } - .form-check-input:checked[type="radio"] { - 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 { - background-color: #3a3f44; - border-color: #3a3f44; - 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 { - pointer-events: none; - filter: none; - opacity: 0.5; } - .form-check-input[disabled] ~ .form-check-label, .form-check-input:disabled ~ .form-check-label { - opacity: 0.5; } + color-adjust: exact; +} +.form-check-input[type=checkbox] { + border-radius: 0.25em; +} +.form-check-input[type=radio] { + border-radius: 50%; +} +.form-check-input:active { + filter: brightness(90%); +} +.form-check-input:focus { + border-color: #9d9fa2; + outline: 0; + box-shadow: 0 0 0 0.25rem rgba(58, 63, 68, 0.25); +} +.form-check-input:checked { + background-color: #3a3f44; + border-color: #3a3f44; +} +.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"); +} +.form-check-input:checked[type=radio] { + 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 { + background-color: #3a3f44; + border-color: #3a3f44; + 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 { + pointer-events: none; + filter: none; + opacity: 0.5; +} +.form-check-input[disabled] ~ .form-check-label, .form-check-input:disabled ~ .form-check-label { + opacity: 0.5; +} .form-switch { - padding-left: 2.5em; } + padding-left: 2.5em; +} +.form-switch .form-check-input { + width: 2em; + 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-position: left center; + border-radius: 2em; + transition: background-position 0.15s ease-in-out; +} +@media (prefers-reduced-motion: reduce) { .form-switch .form-check-input { - width: 2em; - 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-position: left center; - border-radius: 2em; - transition: background-position 0.15s ease-in-out; } - @media (prefers-reduced-motion: reduce) { - .form-switch .form-check-input { - transition: none; } } - .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='%239d9fa2'/%3e%3c/svg%3e"); } - .form-switch .form-check-input:checked { - background-position: right center; - 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='%23fff'/%3e%3c/svg%3e"); } + transition: none; + } +} +.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='%239d9fa2'/%3e%3c/svg%3e"); +} +.form-switch .form-check-input:checked { + background-position: right center; + 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='%23fff'/%3e%3c/svg%3e"); +} .form-check-inline { display: inline-block; - margin-right: 1rem; } + margin-right: 1rem; +} .btn-check { position: absolute; clip: rect(0, 0, 0, 0); - pointer-events: none; } - .btn-check[disabled] + .btn, .btn-check:disabled + .btn { - pointer-events: none; - filter: none; - opacity: 0.65; } + pointer-events: none; +} +.btn-check[disabled] + .btn, .btn-check:disabled + .btn { + pointer-events: none; + filter: none; + opacity: 0.65; +} .form-range { width: 100%; height: 1.5rem; padding: 0; background-color: transparent; - appearance: none; } - .form-range:focus { - outline: 0; } - .form-range:focus::-webkit-slider-thumb { - box-shadow: 0 0 0 1px #272b30, 0 0 0 0.25rem rgba(58, 63, 68, 0.25); } - .form-range:focus::-moz-range-thumb { - box-shadow: 0 0 0 1px #272b30, 0 0 0 0.25rem rgba(58, 63, 68, 0.25); } - .form-range::-moz-focus-outer { - border: 0; } + appearance: none; +} +.form-range:focus { + outline: 0; +} +.form-range:focus::-webkit-slider-thumb { + box-shadow: 0 0 0 1px #272b30, 0 0 0 0.25rem rgba(58, 63, 68, 0.25); +} +.form-range:focus::-moz-range-thumb { + box-shadow: 0 0 0 1px #272b30, 0 0 0 0.25rem rgba(58, 63, 68, 0.25); +} +.form-range::-moz-focus-outer { + border: 0; +} +.form-range::-webkit-slider-thumb { + width: 1rem; + height: 1rem; + margin-top: -0.25rem; + background-color: #3a3f44; + border: 0; + border-radius: 1rem; + transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; + appearance: none; +} +@media (prefers-reduced-motion: reduce) { .form-range::-webkit-slider-thumb { - width: 1rem; - height: 1rem; - margin-top: -0.25rem; - background-color: #3a3f44; - border: 0; - border-radius: 1rem; - transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; - appearance: none; } - @media (prefers-reduced-motion: reduce) { - .form-range::-webkit-slider-thumb { - transition: none; } } - .form-range::-webkit-slider-thumb:active { - background-color: #c4c5c7; } - .form-range::-webkit-slider-runnable-track { - width: 100%; - height: 0.5rem; - color: transparent; - cursor: pointer; - background-color: #dee2e6; - border-color: transparent; - border-radius: 1rem; } + transition: none; + } +} +.form-range::-webkit-slider-thumb:active { + background-color: #c4c5c7; +} +.form-range::-webkit-slider-runnable-track { + width: 100%; + height: 0.5rem; + color: transparent; + cursor: pointer; + background-color: #dee2e6; + border-color: transparent; + border-radius: 1rem; +} +.form-range::-moz-range-thumb { + width: 1rem; + height: 1rem; + background-color: #3a3f44; + border: 0; + border-radius: 1rem; + transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; + appearance: none; +} +@media (prefers-reduced-motion: reduce) { .form-range::-moz-range-thumb { - width: 1rem; - height: 1rem; - background-color: #3a3f44; - border: 0; - border-radius: 1rem; - transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; - appearance: none; } - @media (prefers-reduced-motion: reduce) { - .form-range::-moz-range-thumb { - transition: none; } } - .form-range::-moz-range-thumb:active { - background-color: #c4c5c7; } - .form-range::-moz-range-track { - width: 100%; - height: 0.5rem; - color: transparent; - cursor: pointer; - background-color: #dee2e6; - border-color: transparent; - border-radius: 1rem; } - .form-range:disabled { - pointer-events: none; } - .form-range:disabled::-webkit-slider-thumb { - background-color: #999; } - .form-range:disabled::-moz-range-thumb { - background-color: #999; } + transition: none; + } +} +.form-range::-moz-range-thumb:active { + background-color: #c4c5c7; +} +.form-range::-moz-range-track { + width: 100%; + height: 0.5rem; + color: transparent; + cursor: pointer; + background-color: #dee2e6; + border-color: transparent; + border-radius: 1rem; +} +.form-range:disabled { + pointer-events: none; +} +.form-range:disabled::-webkit-slider-thumb { + background-color: #999; +} +.form-range:disabled::-moz-range-thumb { + background-color: #999; +} .form-floating { - position: relative; } - .form-floating > .form-control, - .form-floating > .form-select { - height: calc(3.5rem + 2px); - line-height: 1.25; } + position: relative; +} +.form-floating > .form-control, +.form-floating > .form-select { + height: calc(3.5rem + 2px); + line-height: 1.25; +} +.form-floating > label { + position: absolute; + top: 0; + left: 0; + height: 100%; + padding: 1rem 0.75rem; + pointer-events: none; + border: 1px solid transparent; + transform-origin: 0 0; + transition: opacity 0.1s ease-in-out, transform 0.1s ease-in-out; +} +@media (prefers-reduced-motion: reduce) { .form-floating > label { - position: absolute; - top: 0; - left: 0; - height: 100%; - padding: 1rem 0.75rem; - pointer-events: none; - border: 1px solid transparent; - transform-origin: 0 0; - transition: opacity 0.1s ease-in-out, transform 0.1s ease-in-out; } - @media (prefers-reduced-motion: reduce) { - .form-floating > label { - transition: none; } } - .form-floating > .form-control { - padding: 1rem 0.75rem; } - .form-floating > .form-control::placeholder { - color: transparent; } - .form-floating > .form-control:focus, .form-floating > .form-control:not(:placeholder-shown) { - padding-top: 1.625rem; - padding-bottom: 0.625rem; } - .form-floating > .form-control:-webkit-autofill { - padding-top: 1.625rem; - padding-bottom: 0.625rem; } - .form-floating > .form-select { - padding-top: 1.625rem; - padding-bottom: 0.625rem; } - .form-floating > .form-control:focus ~ label, - .form-floating > .form-control:not(:placeholder-shown) ~ label, - .form-floating > .form-select ~ label { - opacity: 0.65; - transform: scale(0.85) translateY(-0.5rem) translateX(0.15rem); } - .form-floating > .form-control:-webkit-autofill ~ label { - opacity: 0.65; - transform: scale(0.85) translateY(-0.5rem) translateX(0.15rem); } + transition: none; + } +} +.form-floating > .form-control { + padding: 1rem 0.75rem; +} +.form-floating > .form-control::placeholder { + color: transparent; +} +.form-floating > .form-control:focus, .form-floating > .form-control:not(:placeholder-shown) { + padding-top: 1.625rem; + padding-bottom: 0.625rem; +} +.form-floating > .form-control:-webkit-autofill { + padding-top: 1.625rem; + padding-bottom: 0.625rem; +} +.form-floating > .form-select { + padding-top: 1.625rem; + padding-bottom: 0.625rem; +} +.form-floating > .form-control:focus ~ label, +.form-floating > .form-control:not(:placeholder-shown) ~ label, +.form-floating > .form-select ~ label { + opacity: 0.65; + transform: scale(0.85) translateY(-0.5rem) translateX(0.15rem); +} +.form-floating > .form-control:-webkit-autofill ~ label { + opacity: 0.65; + transform: scale(0.85) translateY(-0.5rem) translateX(0.15rem); +} .input-group { position: relative; display: flex; flex-wrap: wrap; align-items: stretch; - width: 100%; } - .input-group > .form-control, - .input-group > .form-select { - position: relative; - flex: 1 1 auto; - width: 1%; - min-width: 0; } - .input-group > .form-control:focus, - .input-group > .form-select:focus { - z-index: 3; } - .input-group .btn { - position: relative; - z-index: 2; } - .input-group .btn:focus { - z-index: 3; } + width: 100%; +} +.input-group > .form-control, +.input-group > .form-select { + position: relative; + flex: 1 1 auto; + width: 1%; + min-width: 0; +} +.input-group > .form-control:focus, +.input-group > .form-select:focus { + z-index: 3; +} +.input-group .btn { + position: relative; + z-index: 2; +} +.input-group .btn:focus { + z-index: 3; +} .input-group-text { display: flex; @@ -1236,7 +1470,8 @@ textarea.form-control-lg { white-space: nowrap; background-color: #e9ecef; border: 1px solid #ced4da; - border-radius: 0.25rem; } + border-radius: 0.25rem; +} .input-group-lg > .form-control, .input-group-lg > .form-select, @@ -1244,7 +1479,8 @@ textarea.form-control-lg { .input-group-lg > .btn { padding: 0.5rem 1rem; font-size: 1.25rem; - border-radius: 0.3rem; } + border-radius: 0.3rem; +} .input-group-sm > .form-control, .input-group-sm > .form-select, @@ -1252,33 +1488,37 @@ textarea.form-control-lg { .input-group-sm > .btn { padding: 0.25rem 0.5rem; font-size: 0.875rem; - border-radius: 0.2rem; } + border-radius: 0.2rem; +} .input-group-lg > .form-select, .input-group-sm > .form-select { - padding-right: 3rem; } + padding-right: 3rem; +} .input-group:not(.has-validation) > :not(:last-child):not(.dropdown-toggle):not(.dropdown-menu), -.input-group:not(.has-validation) > .dropdown-toggle:nth-last-child(n + 3) { +.input-group:not(.has-validation) > .dropdown-toggle:nth-last-child(n+3) { border-top-right-radius: 0; - border-bottom-right-radius: 0; } - -.input-group.has-validation > :nth-last-child(n + 3):not(.dropdown-toggle):not(.dropdown-menu), -.input-group.has-validation > .dropdown-toggle:nth-last-child(n + 4) { + border-bottom-right-radius: 0; +} +.input-group.has-validation > :nth-last-child(n+3):not(.dropdown-toggle):not(.dropdown-menu), +.input-group.has-validation > .dropdown-toggle:nth-last-child(n+4) { border-top-right-radius: 0; - border-bottom-right-radius: 0; } - + border-bottom-right-radius: 0; +} .input-group > :not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback) { margin-left: -1px; border-top-left-radius: 0; - border-bottom-left-radius: 0; } + border-bottom-left-radius: 0; +} .valid-feedback { display: none; width: 100%; margin-top: 0.25rem; font-size: 0.875em; - color: #62c462; } + color: #62c462; +} .valid-tooltip { position: absolute; @@ -1287,17 +1527,19 @@ textarea.form-control-lg { display: none; max-width: 100%; padding: 0.25rem 0.5rem; - margin-top: .1rem; + margin-top: 0.1rem; font-size: 0.875rem; color: #fff; background-color: rgba(98, 196, 98, 0.9); - border-radius: 0.25rem; } + border-radius: 0.25rem; +} .was-validated :valid ~ .valid-feedback, .was-validated :valid ~ .valid-tooltip, .is-valid ~ .valid-feedback, .is-valid ~ .valid-tooltip { - display: block; } + display: block; +} .was-validated .form-control:valid, .form-control.is-valid { border-color: #62c462; @@ -1305,53 +1547,67 @@ textarea.form-control-lg { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%2362c462' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e"); background-repeat: no-repeat; background-position: right calc(0.375em + 0.1875rem) center; - background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); } - .was-validated .form-control:valid:focus, .form-control.is-valid:focus { - border-color: #62c462; - box-shadow: 0 0 0 0.25rem rgba(98, 196, 98, 0.25); } + background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); +} +.was-validated .form-control:valid:focus, .form-control.is-valid:focus { + border-color: #62c462; + box-shadow: 0 0 0 0.25rem rgba(98, 196, 98, 0.25); +} .was-validated textarea.form-control:valid, textarea.form-control.is-valid { padding-right: calc(1.5em + 0.75rem); - background-position: top calc(0.375em + 0.1875rem) right calc(0.375em + 0.1875rem); } + background-position: top calc(0.375em + 0.1875rem) right calc(0.375em + 0.1875rem); +} .was-validated .form-select:valid, .form-select.is-valid { - border-color: #62c462; } - .was-validated .form-select:valid:not([multiple]):not([size]), .was-validated .form-select:valid:not([multiple])[size="1"], .form-select.is-valid:not([multiple]):not([size]), .form-select.is-valid:not([multiple])[size="1"] { - padding-right: 4.125rem; - 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='%233a3f44' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e"), url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%2362c462' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e"); - background-position: right 0.75rem center, center right 2.25rem; - background-size: 16px 12px, calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); } - .was-validated .form-select:valid:focus, .form-select.is-valid:focus { - border-color: #62c462; - box-shadow: 0 0 0 0.25rem rgba(98, 196, 98, 0.25); } + border-color: #62c462; +} +.was-validated .form-select:valid:not([multiple]):not([size]), .was-validated .form-select:valid:not([multiple])[size="1"], .form-select.is-valid:not([multiple]):not([size]), .form-select.is-valid:not([multiple])[size="1"] { + padding-right: 4.125rem; + 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='%233a3f44' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e"), url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%2362c462' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e"); + background-position: right 0.75rem center, center right 2.25rem; + background-size: 16px 12px, calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); +} +.was-validated .form-select:valid:focus, .form-select.is-valid:focus { + border-color: #62c462; + box-shadow: 0 0 0 0.25rem rgba(98, 196, 98, 0.25); +} .was-validated .form-check-input:valid, .form-check-input.is-valid { - border-color: #62c462; } - .was-validated .form-check-input:valid:checked, .form-check-input.is-valid:checked { - background-color: #62c462; } - .was-validated .form-check-input:valid:focus, .form-check-input.is-valid:focus { - box-shadow: 0 0 0 0.25rem rgba(98, 196, 98, 0.25); } - .was-validated .form-check-input:valid ~ .form-check-label, .form-check-input.is-valid ~ .form-check-label { - color: #62c462; } + border-color: #62c462; +} +.was-validated .form-check-input:valid:checked, .form-check-input.is-valid:checked { + background-color: #62c462; +} +.was-validated .form-check-input:valid:focus, .form-check-input.is-valid:focus { + box-shadow: 0 0 0 0.25rem rgba(98, 196, 98, 0.25); +} +.was-validated .form-check-input:valid ~ .form-check-label, .form-check-input.is-valid ~ .form-check-label { + color: #62c462; +} .form-check-inline .form-check-input ~ .valid-feedback { - margin-left: .5em; } + margin-left: 0.5em; +} -.was-validated .input-group .form-control:valid, .input-group .form-control.is-valid, .was-validated -.input-group .form-select:valid, +.was-validated .input-group .form-control:valid, .input-group .form-control.is-valid, +.was-validated .input-group .form-select:valid, .input-group .form-select.is-valid { - z-index: 1; } - .was-validated .input-group .form-control:valid:focus, .input-group .form-control.is-valid:focus, .was-validated - .input-group .form-select:valid:focus, - .input-group .form-select.is-valid:focus { - z-index: 3; } + z-index: 1; +} +.was-validated .input-group .form-control:valid:focus, .input-group .form-control.is-valid:focus, +.was-validated .input-group .form-select:valid:focus, +.input-group .form-select.is-valid:focus { + z-index: 3; +} .invalid-feedback { display: none; width: 100%; margin-top: 0.25rem; font-size: 0.875em; - color: #ee5f5b; } + color: #ee5f5b; +} .invalid-tooltip { position: absolute; @@ -1360,17 +1616,19 @@ textarea.form-control-lg { display: none; max-width: 100%; padding: 0.25rem 0.5rem; - margin-top: .1rem; + margin-top: 0.1rem; font-size: 0.875rem; color: #fff; background-color: rgba(238, 95, 91, 0.9); - border-radius: 0.25rem; } + border-radius: 0.25rem; +} .was-validated :invalid ~ .invalid-feedback, .was-validated :invalid ~ .invalid-tooltip, .is-invalid ~ .invalid-feedback, .is-invalid ~ .invalid-tooltip { - display: block; } + display: block; +} .was-validated .form-control:invalid, .form-control.is-invalid { border-color: #ee5f5b; @@ -1378,46 +1636,59 @@ textarea.form-control-lg { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23ee5f5b'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23ee5f5b' stroke='none'/%3e%3c/svg%3e"); background-repeat: no-repeat; background-position: right calc(0.375em + 0.1875rem) center; - background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); } - .was-validated .form-control:invalid:focus, .form-control.is-invalid:focus { - border-color: #ee5f5b; - box-shadow: 0 0 0 0.25rem rgba(238, 95, 91, 0.25); } + background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); +} +.was-validated .form-control:invalid:focus, .form-control.is-invalid:focus { + border-color: #ee5f5b; + box-shadow: 0 0 0 0.25rem rgba(238, 95, 91, 0.25); +} .was-validated textarea.form-control:invalid, textarea.form-control.is-invalid { padding-right: calc(1.5em + 0.75rem); - background-position: top calc(0.375em + 0.1875rem) right calc(0.375em + 0.1875rem); } + background-position: top calc(0.375em + 0.1875rem) right calc(0.375em + 0.1875rem); +} .was-validated .form-select:invalid, .form-select.is-invalid { - border-color: #ee5f5b; } - .was-validated .form-select:invalid:not([multiple]):not([size]), .was-validated .form-select:invalid:not([multiple])[size="1"], .form-select.is-invalid:not([multiple]):not([size]), .form-select.is-invalid:not([multiple])[size="1"] { - padding-right: 4.125rem; - 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='%233a3f44' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e"), url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23ee5f5b'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23ee5f5b' stroke='none'/%3e%3c/svg%3e"); - background-position: right 0.75rem center, center right 2.25rem; - background-size: 16px 12px, calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); } - .was-validated .form-select:invalid:focus, .form-select.is-invalid:focus { - border-color: #ee5f5b; - box-shadow: 0 0 0 0.25rem rgba(238, 95, 91, 0.25); } + border-color: #ee5f5b; +} +.was-validated .form-select:invalid:not([multiple]):not([size]), .was-validated .form-select:invalid:not([multiple])[size="1"], .form-select.is-invalid:not([multiple]):not([size]), .form-select.is-invalid:not([multiple])[size="1"] { + padding-right: 4.125rem; + 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='%233a3f44' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e"), url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23ee5f5b'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23ee5f5b' stroke='none'/%3e%3c/svg%3e"); + background-position: right 0.75rem center, center right 2.25rem; + background-size: 16px 12px, calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); +} +.was-validated .form-select:invalid:focus, .form-select.is-invalid:focus { + border-color: #ee5f5b; + box-shadow: 0 0 0 0.25rem rgba(238, 95, 91, 0.25); +} .was-validated .form-check-input:invalid, .form-check-input.is-invalid { - border-color: #ee5f5b; } - .was-validated .form-check-input:invalid:checked, .form-check-input.is-invalid:checked { - background-color: #ee5f5b; } - .was-validated .form-check-input:invalid:focus, .form-check-input.is-invalid:focus { - box-shadow: 0 0 0 0.25rem rgba(238, 95, 91, 0.25); } - .was-validated .form-check-input:invalid ~ .form-check-label, .form-check-input.is-invalid ~ .form-check-label { - color: #ee5f5b; } + border-color: #ee5f5b; +} +.was-validated .form-check-input:invalid:checked, .form-check-input.is-invalid:checked { + background-color: #ee5f5b; +} +.was-validated .form-check-input:invalid:focus, .form-check-input.is-invalid:focus { + box-shadow: 0 0 0 0.25rem rgba(238, 95, 91, 0.25); +} +.was-validated .form-check-input:invalid ~ .form-check-label, .form-check-input.is-invalid ~ .form-check-label { + color: #ee5f5b; +} .form-check-inline .form-check-input ~ .invalid-feedback { - margin-left: .5em; } + margin-left: 0.5em; +} -.was-validated .input-group .form-control:invalid, .input-group .form-control.is-invalid, .was-validated -.input-group .form-select:invalid, +.was-validated .input-group .form-control:invalid, .input-group .form-control.is-invalid, +.was-validated .input-group .form-select:invalid, .input-group .form-select.is-invalid { - z-index: 2; } - .was-validated .input-group .form-control:invalid:focus, .input-group .form-control.is-invalid:focus, .was-validated - .input-group .form-select:invalid:focus, - .input-group .form-select.is-invalid:focus { - z-index: 3; } + z-index: 2; +} +.was-validated .input-group .form-control:invalid:focus, .input-group .form-control.is-invalid:focus, +.was-validated .input-group .form-select:invalid:focus, +.input-group .form-select.is-invalid:focus { + z-index: 3; +} .navbar { position: relative; @@ -1426,42 +1697,48 @@ textarea.form-control-lg { align-items: center; justify-content: space-between; padding-top: 0; - padding-bottom: 0; } - .navbar > .container, - .navbar > .container-fluid, .navbar > .container-sm, .navbar > .container-md, .navbar > .container-lg, .navbar > .container-xl, .navbar > .container-xxl { - display: flex; - flex-wrap: inherit; - align-items: center; - justify-content: space-between; } - + padding-bottom: 0; +} +.navbar > .container-xxl, .navbar > .container-xl, .navbar > .container-lg, .navbar > .container-md, .navbar > .container-sm, .navbar > .container, +.navbar > .container-fluid { + display: flex; + flex-wrap: inherit; + align-items: center; + justify-content: space-between; +} .navbar-brand { padding-top: 0.3125rem; padding-bottom: 0.3125rem; margin-right: 1rem; font-size: 1.25rem; text-decoration: none; - white-space: nowrap; } - + white-space: nowrap; +} .navbar-nav { display: flex; flex-direction: column; padding-left: 0; margin-bottom: 0; - list-style: none; } - .navbar-nav .nav-link { - padding-right: 0; - padding-left: 0; } - .navbar-nav .dropdown-menu { - position: static; } + list-style: none; +} +.navbar-nav .nav-link { + padding-right: 0; + padding-left: 0; +} +.navbar-nav .dropdown-menu { + position: static; +} .navbar-text { padding-top: 0.5rem; - padding-bottom: 0.5rem; } + padding-bottom: 0.5rem; +} .navbar-collapse { flex-basis: 100%; flex-grow: 1; - align-items: center; } + align-items: center; +} .navbar-toggler { padding: 0.25rem 0.75rem; @@ -1470,16 +1747,21 @@ textarea.form-control-lg { background-color: transparent; border: 1px solid transparent; border-radius: 0.25rem; - transition: box-shadow 0.15s ease-in-out; } - @media (prefers-reduced-motion: reduce) { - .navbar-toggler { - transition: none; } } - .navbar-toggler:hover { - text-decoration: none; } - .navbar-toggler:focus { - text-decoration: none; - outline: 0; - box-shadow: 0 0 0 0.25rem; } + transition: box-shadow 0.15s ease-in-out; +} +@media (prefers-reduced-motion: reduce) { + .navbar-toggler { + transition: none; + } +} +.navbar-toggler:hover { + text-decoration: none; +} +.navbar-toggler:focus { + text-decoration: none; + outline: 0; + box-shadow: 0 0 0 0.25rem; +} .navbar-toggler-icon { display: inline-block; @@ -1488,242 +1770,43 @@ textarea.form-control-lg { vertical-align: middle; background-repeat: no-repeat; background-position: center; - background-size: 100%; } + background-size: 100%; +} .navbar-nav-scroll { max-height: var(--bs-scroll-height, 75vh); - overflow-y: auto; } + overflow-y: auto; +} @media (min-width: 576px) { .navbar-expand-sm { flex-wrap: nowrap; - justify-content: flex-start; } - .navbar-expand-sm .navbar-nav { - flex-direction: row; } - .navbar-expand-sm .navbar-nav .dropdown-menu { - position: absolute; } - .navbar-expand-sm .navbar-nav .nav-link { - padding-right: 0.5rem; - padding-left: 0.5rem; } - .navbar-expand-sm .navbar-nav-scroll { - overflow: visible; } - .navbar-expand-sm .navbar-collapse { - display: flex !important; - flex-basis: auto; } - .navbar-expand-sm .navbar-toggler { - display: none; } - .navbar-expand-sm .offcanvas-header { - display: none; } - .navbar-expand-sm .offcanvas { - position: inherit; - bottom: 0; - z-index: 1000; - flex-grow: 1; - visibility: visible !important; - background-color: transparent; - border-right: 0; - border-left: 0; - transition: none; - transform: none; } - .navbar-expand-sm .offcanvas-top, - .navbar-expand-sm .offcanvas-bottom { - height: auto; - border-top: 0; - border-bottom: 0; } - .navbar-expand-sm .offcanvas-body { - display: flex; - flex-grow: 0; - padding: 0; - overflow-y: visible; } } - -@media (min-width: 768px) { - .navbar-expand-md { - flex-wrap: nowrap; - justify-content: flex-start; } - .navbar-expand-md .navbar-nav { - flex-direction: row; } - .navbar-expand-md .navbar-nav .dropdown-menu { - position: absolute; } - .navbar-expand-md .navbar-nav .nav-link { - padding-right: 0.5rem; - padding-left: 0.5rem; } - .navbar-expand-md .navbar-nav-scroll { - overflow: visible; } - .navbar-expand-md .navbar-collapse { - display: flex !important; - flex-basis: auto; } - .navbar-expand-md .navbar-toggler { - display: none; } - .navbar-expand-md .offcanvas-header { - display: none; } - .navbar-expand-md .offcanvas { - position: inherit; - bottom: 0; - z-index: 1000; - flex-grow: 1; - visibility: visible !important; - background-color: transparent; - border-right: 0; - border-left: 0; - transition: none; - transform: none; } - .navbar-expand-md .offcanvas-top, - .navbar-expand-md .offcanvas-bottom { - height: auto; - border-top: 0; - border-bottom: 0; } - .navbar-expand-md .offcanvas-body { - display: flex; - flex-grow: 0; - padding: 0; - overflow-y: visible; } } - -@media (min-width: 992px) { - .navbar-expand-lg { - flex-wrap: nowrap; - justify-content: flex-start; } - .navbar-expand-lg .navbar-nav { - flex-direction: row; } - .navbar-expand-lg .navbar-nav .dropdown-menu { - position: absolute; } - .navbar-expand-lg .navbar-nav .nav-link { - padding-right: 0.5rem; - padding-left: 0.5rem; } - .navbar-expand-lg .navbar-nav-scroll { - overflow: visible; } - .navbar-expand-lg .navbar-collapse { - display: flex !important; - flex-basis: auto; } - .navbar-expand-lg .navbar-toggler { - display: none; } - .navbar-expand-lg .offcanvas-header { - display: none; } - .navbar-expand-lg .offcanvas { - position: inherit; - bottom: 0; - z-index: 1000; - flex-grow: 1; - visibility: visible !important; - background-color: transparent; - border-right: 0; - border-left: 0; - transition: none; - transform: none; } - .navbar-expand-lg .offcanvas-top, - .navbar-expand-lg .offcanvas-bottom { - height: auto; - border-top: 0; - border-bottom: 0; } - .navbar-expand-lg .offcanvas-body { - display: flex; - flex-grow: 0; - padding: 0; - overflow-y: visible; } } - -@media (min-width: 1200px) { - .navbar-expand-xl { - flex-wrap: nowrap; - justify-content: flex-start; } - .navbar-expand-xl .navbar-nav { - flex-direction: row; } - .navbar-expand-xl .navbar-nav .dropdown-menu { - position: absolute; } - .navbar-expand-xl .navbar-nav .nav-link { - padding-right: 0.5rem; - padding-left: 0.5rem; } - .navbar-expand-xl .navbar-nav-scroll { - overflow: visible; } - .navbar-expand-xl .navbar-collapse { - display: flex !important; - flex-basis: auto; } - .navbar-expand-xl .navbar-toggler { - display: none; } - .navbar-expand-xl .offcanvas-header { - display: none; } - .navbar-expand-xl .offcanvas { - position: inherit; - bottom: 0; - z-index: 1000; - flex-grow: 1; - visibility: visible !important; - background-color: transparent; - border-right: 0; - border-left: 0; - transition: none; - transform: none; } - .navbar-expand-xl .offcanvas-top, - .navbar-expand-xl .offcanvas-bottom { - height: auto; - border-top: 0; - border-bottom: 0; } - .navbar-expand-xl .offcanvas-body { - display: flex; - flex-grow: 0; - padding: 0; - overflow-y: visible; } } - -@media (min-width: 1400px) { - .navbar-expand-xxl { - flex-wrap: nowrap; - justify-content: flex-start; } - .navbar-expand-xxl .navbar-nav { - flex-direction: row; } - .navbar-expand-xxl .navbar-nav .dropdown-menu { - position: absolute; } - .navbar-expand-xxl .navbar-nav .nav-link { - padding-right: 0.5rem; - padding-left: 0.5rem; } - .navbar-expand-xxl .navbar-nav-scroll { - overflow: visible; } - .navbar-expand-xxl .navbar-collapse { - display: flex !important; - flex-basis: auto; } - .navbar-expand-xxl .navbar-toggler { - display: none; } - .navbar-expand-xxl .offcanvas-header { - display: none; } - .navbar-expand-xxl .offcanvas { - position: inherit; - bottom: 0; - z-index: 1000; - flex-grow: 1; - visibility: visible !important; - background-color: transparent; - border-right: 0; - border-left: 0; - transition: none; - transform: none; } - .navbar-expand-xxl .offcanvas-top, - .navbar-expand-xxl .offcanvas-bottom { - height: auto; - border-top: 0; - border-bottom: 0; } - .navbar-expand-xxl .offcanvas-body { - display: flex; - flex-grow: 0; - padding: 0; - overflow-y: visible; } } - -.navbar-expand { - flex-wrap: nowrap; - justify-content: flex-start; } - .navbar-expand .navbar-nav { - flex-direction: row; } - .navbar-expand .navbar-nav .dropdown-menu { - position: absolute; } - .navbar-expand .navbar-nav .nav-link { - padding-right: 0.5rem; - padding-left: 0.5rem; } - .navbar-expand .navbar-nav-scroll { - overflow: visible; } - .navbar-expand .navbar-collapse { + justify-content: flex-start; + } + .navbar-expand-sm .navbar-nav { + flex-direction: row; + } + .navbar-expand-sm .navbar-nav .dropdown-menu { + position: absolute; + } + .navbar-expand-sm .navbar-nav .nav-link { + padding-right: 0.5rem; + padding-left: 0.5rem; + } + .navbar-expand-sm .navbar-nav-scroll { + overflow: visible; + } + .navbar-expand-sm .navbar-collapse { display: flex !important; - flex-basis: auto; } - .navbar-expand .navbar-toggler { - display: none; } - .navbar-expand .offcanvas-header { - display: none; } - .navbar-expand .offcanvas { + flex-basis: auto; + } + .navbar-expand-sm .navbar-toggler { + display: none; + } + .navbar-expand-sm .offcanvas-header { + display: none; + } + .navbar-expand-sm .offcanvas { position: inherit; bottom: 0; z-index: 1000; @@ -1733,74 +1816,351 @@ textarea.form-control-lg { border-right: 0; border-left: 0; transition: none; - transform: none; } - .navbar-expand .offcanvas-top, - .navbar-expand .offcanvas-bottom { + transform: none; + } + .navbar-expand-sm .offcanvas-top, +.navbar-expand-sm .offcanvas-bottom { height: auto; border-top: 0; - border-bottom: 0; } - .navbar-expand .offcanvas-body { + border-bottom: 0; + } + .navbar-expand-sm .offcanvas-body { display: flex; flex-grow: 0; padding: 0; - overflow-y: visible; } + overflow-y: visible; + } +} +@media (min-width: 768px) { + .navbar-expand-md { + flex-wrap: nowrap; + justify-content: flex-start; + } + .navbar-expand-md .navbar-nav { + flex-direction: row; + } + .navbar-expand-md .navbar-nav .dropdown-menu { + position: absolute; + } + .navbar-expand-md .navbar-nav .nav-link { + padding-right: 0.5rem; + padding-left: 0.5rem; + } + .navbar-expand-md .navbar-nav-scroll { + overflow: visible; + } + .navbar-expand-md .navbar-collapse { + display: flex !important; + flex-basis: auto; + } + .navbar-expand-md .navbar-toggler { + display: none; + } + .navbar-expand-md .offcanvas-header { + display: none; + } + .navbar-expand-md .offcanvas { + position: inherit; + bottom: 0; + z-index: 1000; + flex-grow: 1; + visibility: visible !important; + background-color: transparent; + border-right: 0; + border-left: 0; + transition: none; + transform: none; + } + .navbar-expand-md .offcanvas-top, +.navbar-expand-md .offcanvas-bottom { + height: auto; + border-top: 0; + border-bottom: 0; + } + .navbar-expand-md .offcanvas-body { + display: flex; + flex-grow: 0; + padding: 0; + overflow-y: visible; + } +} +@media (min-width: 992px) { + .navbar-expand-lg { + flex-wrap: nowrap; + justify-content: flex-start; + } + .navbar-expand-lg .navbar-nav { + flex-direction: row; + } + .navbar-expand-lg .navbar-nav .dropdown-menu { + position: absolute; + } + .navbar-expand-lg .navbar-nav .nav-link { + padding-right: 0.5rem; + padding-left: 0.5rem; + } + .navbar-expand-lg .navbar-nav-scroll { + overflow: visible; + } + .navbar-expand-lg .navbar-collapse { + display: flex !important; + flex-basis: auto; + } + .navbar-expand-lg .navbar-toggler { + display: none; + } + .navbar-expand-lg .offcanvas-header { + display: none; + } + .navbar-expand-lg .offcanvas { + position: inherit; + bottom: 0; + z-index: 1000; + flex-grow: 1; + visibility: visible !important; + background-color: transparent; + border-right: 0; + border-left: 0; + transition: none; + transform: none; + } + .navbar-expand-lg .offcanvas-top, +.navbar-expand-lg .offcanvas-bottom { + height: auto; + border-top: 0; + border-bottom: 0; + } + .navbar-expand-lg .offcanvas-body { + display: flex; + flex-grow: 0; + padding: 0; + overflow-y: visible; + } +} +@media (min-width: 1200px) { + .navbar-expand-xl { + flex-wrap: nowrap; + justify-content: flex-start; + } + .navbar-expand-xl .navbar-nav { + flex-direction: row; + } + .navbar-expand-xl .navbar-nav .dropdown-menu { + position: absolute; + } + .navbar-expand-xl .navbar-nav .nav-link { + padding-right: 0.5rem; + padding-left: 0.5rem; + } + .navbar-expand-xl .navbar-nav-scroll { + overflow: visible; + } + .navbar-expand-xl .navbar-collapse { + display: flex !important; + flex-basis: auto; + } + .navbar-expand-xl .navbar-toggler { + display: none; + } + .navbar-expand-xl .offcanvas-header { + display: none; + } + .navbar-expand-xl .offcanvas { + position: inherit; + bottom: 0; + z-index: 1000; + flex-grow: 1; + visibility: visible !important; + background-color: transparent; + border-right: 0; + border-left: 0; + transition: none; + transform: none; + } + .navbar-expand-xl .offcanvas-top, +.navbar-expand-xl .offcanvas-bottom { + height: auto; + border-top: 0; + border-bottom: 0; + } + .navbar-expand-xl .offcanvas-body { + display: flex; + flex-grow: 0; + padding: 0; + overflow-y: visible; + } +} +@media (min-width: 1400px) { + .navbar-expand-xxl { + flex-wrap: nowrap; + justify-content: flex-start; + } + .navbar-expand-xxl .navbar-nav { + flex-direction: row; + } + .navbar-expand-xxl .navbar-nav .dropdown-menu { + position: absolute; + } + .navbar-expand-xxl .navbar-nav .nav-link { + padding-right: 0.5rem; + padding-left: 0.5rem; + } + .navbar-expand-xxl .navbar-nav-scroll { + overflow: visible; + } + .navbar-expand-xxl .navbar-collapse { + display: flex !important; + flex-basis: auto; + } + .navbar-expand-xxl .navbar-toggler { + display: none; + } + .navbar-expand-xxl .offcanvas-header { + display: none; + } + .navbar-expand-xxl .offcanvas { + position: inherit; + bottom: 0; + z-index: 1000; + flex-grow: 1; + visibility: visible !important; + background-color: transparent; + border-right: 0; + border-left: 0; + transition: none; + transform: none; + } + .navbar-expand-xxl .offcanvas-top, +.navbar-expand-xxl .offcanvas-bottom { + height: auto; + border-top: 0; + border-bottom: 0; + } + .navbar-expand-xxl .offcanvas-body { + display: flex; + flex-grow: 0; + padding: 0; + overflow-y: visible; + } +} +.navbar-expand { + flex-wrap: nowrap; + justify-content: flex-start; +} +.navbar-expand .navbar-nav { + flex-direction: row; +} +.navbar-expand .navbar-nav .dropdown-menu { + position: absolute; +} +.navbar-expand .navbar-nav .nav-link { + padding-right: 0.5rem; + padding-left: 0.5rem; +} +.navbar-expand .navbar-nav-scroll { + overflow: visible; +} +.navbar-expand .navbar-collapse { + display: flex !important; + flex-basis: auto; +} +.navbar-expand .navbar-toggler { + display: none; +} +.navbar-expand .offcanvas-header { + display: none; +} +.navbar-expand .offcanvas { + position: inherit; + bottom: 0; + z-index: 1000; + flex-grow: 1; + visibility: visible !important; + background-color: transparent; + border-right: 0; + border-left: 0; + transition: none; + transform: none; +} +.navbar-expand .offcanvas-top, +.navbar-expand .offcanvas-bottom { + height: auto; + border-top: 0; + border-bottom: 0; +} +.navbar-expand .offcanvas-body { + display: flex; + flex-grow: 0; + padding: 0; + overflow-y: visible; +} .navbar-light .navbar-brand { - color: #3a3f44; } - .navbar-light .navbar-brand:hover, .navbar-light .navbar-brand:focus { - color: #3a3f44; } - + color: #3a3f44; +} +.navbar-light .navbar-brand:hover, .navbar-light .navbar-brand:focus { + color: #3a3f44; +} .navbar-light .navbar-nav .nav-link { - color: rgba(0, 0, 0, 0.55); } - .navbar-light .navbar-nav .nav-link:hover, .navbar-light .navbar-nav .nav-link:focus { - color: #3a3f44; } - .navbar-light .navbar-nav .nav-link.disabled { - color: rgba(0, 0, 0, 0.3); } - + color: rgba(0, 0, 0, 0.55); +} +.navbar-light .navbar-nav .nav-link:hover, .navbar-light .navbar-nav .nav-link:focus { + color: #3a3f44; +} +.navbar-light .navbar-nav .nav-link.disabled { + color: rgba(0, 0, 0, 0.3); +} .navbar-light .navbar-nav .show > .nav-link, .navbar-light .navbar-nav .nav-link.active { - color: #3a3f44; } - + color: #3a3f44; +} .navbar-light .navbar-toggler { color: rgba(0, 0, 0, 0.55); - border-color: rgba(0, 0, 0, 0.1); } - + border-color: rgba(0, 0, 0, 0.1); +} .navbar-light .navbar-toggler-icon { - background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%280, 0, 0, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e"); } - + background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%280, 0, 0, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e"); +} .navbar-light .navbar-text { - color: rgba(0, 0, 0, 0.55); } - .navbar-light .navbar-text a, - .navbar-light .navbar-text a:hover, - .navbar-light .navbar-text a:focus { - color: #3a3f44; } + color: rgba(0, 0, 0, 0.55); +} +.navbar-light .navbar-text a, +.navbar-light .navbar-text a:hover, +.navbar-light .navbar-text a:focus { + color: #3a3f44; +} .navbar-dark .navbar-brand { - color: #fff; } - .navbar-dark .navbar-brand:hover, .navbar-dark .navbar-brand:focus { - color: #fff; } - + color: #fff; +} +.navbar-dark .navbar-brand:hover, .navbar-dark .navbar-brand:focus { + color: #fff; +} .navbar-dark .navbar-nav .nav-link { - color: rgba(255, 255, 255, 0.55); } - .navbar-dark .navbar-nav .nav-link:hover, .navbar-dark .navbar-nav .nav-link:focus { - color: #fff; } - .navbar-dark .navbar-nav .nav-link.disabled { - color: rgba(255, 255, 255, 0.25); } - + color: rgba(255, 255, 255, 0.55); +} +.navbar-dark .navbar-nav .nav-link:hover, .navbar-dark .navbar-nav .nav-link:focus { + color: #fff; +} +.navbar-dark .navbar-nav .nav-link.disabled { + color: rgba(255, 255, 255, 0.25); +} .navbar-dark .navbar-nav .show > .nav-link, .navbar-dark .navbar-nav .nav-link.active { - color: #fff; } - + color: #fff; +} .navbar-dark .navbar-toggler { color: rgba(255, 255, 255, 0.55); - border-color: rgba(255, 255, 255, 0.1); } - + border-color: rgba(255, 255, 255, 0.1); +} .navbar-dark .navbar-toggler-icon { - background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e"); } - + background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e"); +} .navbar-dark .navbar-text { - color: rgba(255, 255, 255, 0.55); } - .navbar-dark .navbar-text a, - .navbar-dark .navbar-text a:hover, - .navbar-dark .navbar-text a:focus { - color: #fff; } + color: rgba(255, 255, 255, 0.55); +} +.navbar-dark .navbar-text a, +.navbar-dark .navbar-text a:hover, +.navbar-dark .navbar-text a:focus { + color: #fff; +} diff --git a/webroot/css/themes/theme-vapor.css b/webroot/css/themes/theme-vapor.css index ebab0cb..907bfbf 100644 --- a/webroot/css/themes/theme-vapor.css +++ b/webroot/css/themes/theme-vapor.css @@ -1,368 +1,436 @@ /* Callout */ .callout { border: 1px solid #e9ecef; - border-radius: .25rem; + border-radius: 0.25rem; background-color: #363636; - box-shadow: none; } + box-shadow: none; +} .callout-primary { border-left-color: #6f42c1; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-secondary { border-left-color: #ea39b8; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-success { border-left-color: #3cf281; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-info { border-left-color: #1ba2f6; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-warning { border-left-color: #ffc107; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-danger { border-left-color: #e44c55; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-light { border-left-color: #44d9e8; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} .callout-dark { border-left-color: #170229; - border-left-width: .25rem; - border-left-style: solid; } + border-left-width: 0.25rem; + border-left-style: solid; +} /* Toasts */ .toast { - min-width: 250px; } + min-width: 250px; +} .toast-primary { color: #21143a; background-color: #d4c6ec; - border-color: #c5b3e6; } - .toast-primary strong { - border-top-color: #b6a0e0; } + border-color: #c5b3e6; +} +.toast-primary strong { + border-top-color: #b6a0e0; +} .toast-secondary { color: #461137; background-color: #f9c4ea; - border-color: #f7b0e3; } - .toast-secondary strong { - border-top-color: #f599db; } + border-color: #f7b0e3; +} +.toast-secondary strong { + border-top-color: #f599db; +} .toast-success { color: #124927; background-color: #c5fbd9; - border-color: #b1facd; } - .toast-success strong { - border-top-color: #99f8be; } + border-color: #b1facd; +} +.toast-success strong { + border-top-color: #99f8be; +} .toast-info { color: #08314a; background-color: #bbe3fc; - border-color: #a4dafb; } - .toast-info strong { - border-top-color: #8cd0fa; } + border-color: #a4dafb; +} +.toast-info strong { + border-top-color: #8cd0fa; +} .toast-warning { color: #4d3a02; background-color: #ffecb5; - border-color: #ffe69c; } - .toast-warning strong { - border-top-color: #ffe083; } + border-color: #ffe69c; +} +.toast-warning strong { + border-top-color: #ffe083; +} .toast-danger { color: #44171a; background-color: #f7c9cc; - border-color: #f4b7bb; } - .toast-danger strong { - border-top-color: #f1a1a6; } + border-color: #f4b7bb; +} +.toast-danger strong { + border-top-color: #f1a1a6; +} .toast-light { color: #144146; background-color: #c7f4f8; - border-color: #b4f0f6; } - .toast-light strong { - border-top-color: #9debf3; } + border-color: #b4f0f6; +} +.toast-light strong { + border-top-color: #9debf3; +} .toast-dark { color: #07010c; background-color: #b9b3bf; - border-color: #a29aa9; } - .toast-dark strong { - border-top-color: #958c9d; } + border-color: #a29aa9; +} +.toast-dark strong { + border-top-color: #958c9d; +} /* Dropdown-item */ .dropdown-item.dropdown-item-primary { color: #fff; text-decoration: none; - background-color: #6f42c1; } - + background-color: #6f42c1; +} .dropdown-item.dropdown-item-outline-primary:hover { color: #fff; - background-color: #6f42c1; } - + background-color: #6f42c1; +} .dropdown-item.dropdown-item-secondary { color: #fff; text-decoration: none; - background-color: #ea39b8; } - + background-color: #ea39b8; +} .dropdown-item.dropdown-item-outline-secondary:hover { color: #fff; - background-color: #ea39b8; } - + background-color: #ea39b8; +} .dropdown-item.dropdown-item-success { color: #fff; text-decoration: none; - background-color: #3cf281; } - + background-color: #3cf281; +} .dropdown-item.dropdown-item-outline-success:hover { color: #fff; - background-color: #3cf281; } - + background-color: #3cf281; +} .dropdown-item.dropdown-item-info { color: #fff; text-decoration: none; - background-color: #1ba2f6; } - + background-color: #1ba2f6; +} .dropdown-item.dropdown-item-outline-info:hover { color: #fff; - background-color: #1ba2f6; } - + background-color: #1ba2f6; +} .dropdown-item.dropdown-item-warning { color: #fff; text-decoration: none; - background-color: #ffc107; } - + background-color: #ffc107; +} .dropdown-item.dropdown-item-outline-warning:hover { color: #fff; - background-color: #ffc107; } - + background-color: #ffc107; +} .dropdown-item.dropdown-item-danger { color: #fff; text-decoration: none; - background-color: #e44c55; } - + background-color: #e44c55; +} .dropdown-item.dropdown-item-outline-danger:hover { color: #fff; - background-color: #e44c55; } - + background-color: #e44c55; +} .dropdown-item.dropdown-item-light { color: #fff; text-decoration: none; - background-color: #44d9e8; } - + background-color: #44d9e8; +} .dropdown-item.dropdown-item-outline-light:hover { color: #fff; - background-color: #44d9e8; } - + background-color: #44d9e8; +} .dropdown-item.dropdown-item-dark { color: #fff; text-decoration: none; - background-color: #170229; } - + background-color: #170229; +} .dropdown-item.dropdown-item-outline-dark:hover { color: #fff; - background-color: #170229; } + background-color: #170229; +} /* Progress Timeline */ .progress-timeline { - padding: 0.2em 0.2em 0.5em 0.2em; } - .progress-timeline ul { - position: relative; - padding: 0; } - .progress-timeline li { - list-style-type: none; - position: relative; } - .progress-timeline li.progress-inactive { - opacity: 0.5; } - .progress-timeline .progress-line { - height: 2px; } - .progress-timeline .progress-line.progress-inactive { - opacity: 0.5; } + padding: 0.2em 0.2em 0.5em 0.2em; +} +.progress-timeline ul { + position: relative; + padding: 0; +} +.progress-timeline li { + list-style-type: none; + position: relative; +} +.progress-timeline li.progress-inactive { + opacity: 0.5; +} +.progress-timeline .progress-line { + height: 2px; +} +.progress-timeline .progress-line.progress-inactive { + opacity: 0.5; +} /* Forms severity */ .form-control.is-invalid.info { - background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%231ba2f6' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%231ba2f6' stroke='none'/%3e%3c/svg%3e"); } - .form-control.is-invalid.info:focus { - border-color: #1ba2f6; - box-shadow: 0 0 0 0.25rem rgba(27, 162, 246, 0.25); } - + background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%231ba2f6' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%231ba2f6' stroke='none'/%3e%3c/svg%3e"); +} +.form-control.is-invalid.info:focus { + border-color: #1ba2f6; + box-shadow: 0 0 0 0.25rem rgba(27, 162, 246, 0.25); +} .form-control.is-invalid.warning { - background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23ffc107' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23ffc107' stroke='none'/%3e%3c/svg%3e"); } - .form-control.is-invalid.warning:focus { - border-color: #ffc107; - box-shadow: 0 0 0 0.25rem rgba(255, 193, 7, 0.25); } + background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23ffc107' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23ffc107' stroke='none'/%3e%3c/svg%3e"); +} +.form-control.is-invalid.warning:focus { + border-color: #ffc107; + box-shadow: 0 0 0 0.25rem rgba(255, 193, 7, 0.25); +} .form-select.is-invalid:not([multiple]):not([size]).info, -.form-select.is-invalid:not([multiple])[size="1"] -.form-select.is-invalid.info { +.form-select.is-invalid:not([multiple])[size="1"] .form-select.is-invalid.info { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%231ba2f6'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%231ba2f6' stroke='none'/%3e%3c/svg%3e"); - background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); } - .form-select.is-invalid:not([multiple]):not([size]).info:focus, - .form-select.is-invalid:not([multiple])[size="1"] -.form-select.is-invalid.info:focus { - box-shadow: 0 0 0 0.25rem rgba(27, 162, 246, 0.25); } - + background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); +} +.form-select.is-invalid:not([multiple]):not([size]).info:focus, +.form-select.is-invalid:not([multiple])[size="1"] .form-select.is-invalid.info:focus { + box-shadow: 0 0 0 0.25rem rgba(27, 162, 246, 0.25); +} .form-select.is-invalid:not([multiple]):not([size]).warning, -.form-select.is-invalid:not([multiple])[size="1"] -.form-select.is-invalid.warning { +.form-select.is-invalid:not([multiple])[size="1"] .form-select.is-invalid.warning { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23ffc107'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23ffc107' stroke='none'/%3e%3c/svg%3e"); - background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); } - .form-select.is-invalid:not([multiple]):not([size]).warning:focus, - .form-select.is-invalid:not([multiple])[size="1"] -.form-select.is-invalid.warning:focus { - box-shadow: 0 0 0 0.25rem rgba(255, 193, 7, 0.25); } + background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); +} +.form-select.is-invalid:not([multiple]):not([size]).warning:focus, +.form-select.is-invalid:not([multiple])[size="1"] .form-select.is-invalid.warning:focus { + box-shadow: 0 0 0 0.25rem rgba(255, 193, 7, 0.25); +} .form-check-input.is-invalid.info { - border-color: #1ba2f6; } - + border-color: #1ba2f6; +} .form-check-input.is-invalid.info:checked { - background-color: #1ba2f6; } - + background-color: #1ba2f6; +} .form-check-input.is-invalid.info ~ .form-check-label { - color: unset; } - + color: unset; +} .form-check-input.is-invalid.info:focus { - box-shadow: 0 0 0 0.2rem rgba(27, 162, 246, 0.25); } - + box-shadow: 0 0 0 0.2rem rgba(27, 162, 246, 0.25); +} .form-check-input.is-invalid.warning { - border-color: #ffc107; } - + border-color: #ffc107; +} .form-check-input.is-invalid.warning:checked { - background-color: #ffc107; } - + background-color: #ffc107; +} .form-check-input.is-invalid.warning ~ .form-check-label { - color: unset; } - + color: unset; +} .form-check-input.is-invalid.warning:focus { - box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.25); } + box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.25); +} /* Utilities */ .mw-75 { - max-width: 75% !important; } + max-width: 75% !important; +} .mw-50 { - max-width: 50% !important; } + max-width: 50% !important; +} .mw-25 { - max-width: 25% !important; } + max-width: 25% !important; +} .mh-75 { - max-height: 75% !important; } + max-height: 75% !important; +} .mh-50 { - max-height: 50% !important; } + max-height: 50% !important; +} .mh-25 { - max-height: 25% !important; } + max-height: 25% !important; +} .p-abs-center-y { top: 50%; - transform: translateY(-50%); } + transform: translateY(-50%); +} .p-abs-center-x { left: 50%; - transform: translateX(-50%); } + transform: translateX(-50%); +} .p-abs-center-both { top: 50%; left: 50%; - transform: translateX(-50%) translateY(-50%); } + transform: translateX(-50%) translateY(-50%); +} /* Body */ .panel { background-color: #363636; border: 1px solid #454545; - box-shadow: none; } + box-shadow: none; +} .loading-overlay { background-color: #170229; - opacity: 0.65; } + opacity: 0.65; +} /* Top navbar */ .top-navbar { - background-color: #6f42c1; } + background-color: #6f42c1; +} .center-navbar nav.header-breadcrumb { - color: #fff; } + color: #fff; +} header.top-navbar .header-menu > a:hover, header.top-navbar .header-breadcrumb .header-breadcrumb-item > a:hover { - color: #d6d6d6 !important; } + color: #d6d6d6 !important; +} .top-navbar .center-navbar nav.header-breadcrumb li.header-breadcrumb-item a { - color: #fff; } + color: #fff; +} .top-navbar .right-navbar .header-menu a.nav-link { - color: #fff; } + color: #fff; +} .top-navbar .left-navbar .navbar-brand img { - filter: invert(1); } + filter: invert(1); +} .top-navbar .left-navbar .navbar-brand:hover img { - filter: invert(1) drop-shadow(0px 0px 3px #fff); } + filter: invert(1) drop-shadow(0px 0px 3px #fff); +} .top-navbar .composed-app-icon-container > .app-icon { - background-color: #fff; } + background-color: #fff; +} .breadcrumb-link-container { box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.16), 0 2px 6px 0 rgba(0, 0, 0, 0.12); - background-color: #44d9e8; } + background-color: #44d9e8; +} /* Sidebar */ .sidebar { - transition: width .08s linear; + transition: width 0.08s linear; box-shadow: none; - background-color: #170229; } + background-color: #170229; +} .sidebar ~ main.content:after { - background: #000; } + background: #000; +} .sidebar .sidebar-wrapper { - border-right: 1px solid none; } + border-right: 1px solid none; +} .sidebar .sidebar-wrapper { - border-right: 1px solid rgba(0, 0, 0, 0.125); } + border-right: 1px solid rgba(0, 0, 0, 0.125); +} .sidebar ul.sidebar-elements li > a.sidebar-link { - color: #fff; } + color: #fff; +} .sidebar ul.sidebar-elements li > a.sidebar-link.active { background-color: #343a40; - color: #3cf281; } + color: #3cf281; +} .sidebar ul.sidebar-elements li > a.sidebar-link.have-active-child { background-color: #343a40; - color: #3cf281; } + color: #3cf281; +} .sidebar ul.sidebar-elements li > a.sidebar-link:hover { background-color: #495057; - color: #3cf281; } + color: #3cf281; +} .sidebar.expanded ul.sidebar-elements li > a.sidebar-link.have-active-child, .sidebar:hover ul.sidebar-elements li > a.sidebar-link.have-active-child { - background-color: unset; } + background-color: unset; +} .sidebar.expanded ul.sidebar-elements li > a.sidebar-link.have-active-child:hover, .sidebar:hover ul.sidebar-elements li > a.sidebar-link.have-active-child:hover { - background-color: #495057; } + background-color: #495057; +} ul.sidebar-elements li > a.sidebar-link.active::after { - background-color: #6f42c1; } + background-color: #6f42c1; +} .lock-sidebar > a.btn { - background-color: unset; } + background-color: unset; +}