add brand and status colors to CSS variables for improved theming, grouping variable

This commit is contained in:
LailaWulandarii 2025-12-12 19:17:31 +07:00
parent 5ffb8c8fb5
commit 885edfe844
1 changed files with 170 additions and 211 deletions

View File

@ -107,15 +107,37 @@ @media screen and (-ms-high-contrast: active),
:root,
[data-bs-theme=light] {
/* =========================================
1. BRAND COLORS (Warna Khas Flo.do)
========================================= */
--bs-primary: #3B8181;
/* Teal Utama */
--bs-brick: #E66351;
--bs-red: #DC464F;
/* Merah Bunga */
--bs-orange: #FF975A;
--bs-green: #198754;
/* Oranye Aksen */
--bs-teal: #20c997;
/* =========================================
2. BOOTSTRAP STATUS COLORS (Warna Standar)
========================================= */
--bs-success: #198754;
/* Hijau Sukses */
--bs-info: #0dcaf0;
/* Biru Info */
--bs-warning: #ffc107;
/* Kuning Peringatan */
--bs-danger: #dc3545;
/* Merah Error */
--bs-secondary: #6c757d;
--bs-light: #ced4da;
--bs-dark: #131313;
--bs-white: #fff;
--bs-gray: #6c757d;
--bs-gray-dark: #343a40;
/* Skala Abu-abu (Grayscale) */
--bs-gray-100: #f8f9fa;
--bs-gray-200: #e9ecef;
--bs-gray-300: #dee2e6;
@ -125,23 +147,109 @@ [data-bs-theme=light] {
--bs-gray-700: #495057;
--bs-gray-800: #343a40;
--bs-gray-900: #212529;
--bs-secondary: #6c757d;
--bs-success: #198754;
--bs-info: #0dcaf0;
--bs-warning: #ffc107;
--bs-danger: #dc3545;
--bs-light: #ced4da;
--bs-dark: #131313;
--bs-primary-rgb: 67, 94, 190;
--bs-secondary-rgb: 108, 117, 125;
/* =========================================
3. RGB VALUES (PENTING UNTUK TRANSPARANSI)
* Digunakan saat pakai class bg-opacity-xx
========================================= */
--bs-primary-rgb: 59, 129, 129;
/* SUDAH DIPERBAIKI (Teal) */
--bs-success-rgb: 25, 135, 84;
--bs-info-rgb: 13, 202, 240;
--bs-warning-rgb: 255, 193, 7;
--bs-danger-rgb: 220, 53, 69;
--bs-secondary-rgb: 108, 117, 125;
--bs-light-rgb: 206, 212, 218;
--bs-dark-rgb: 19, 19, 19;
--bs-white-rgb: 255, 255, 255;
--bs-black-rgb: 0, 0, 0;
/* =========================================
4. TYPOGRAPHY (Pengaturan Font)
========================================= */
--bs-body-font-family: "Nunito";
--bs-body-font-size: 1rem;
--bs-body-font-weight: 400;
--bs-body-line-height: 1.5;
--bs-font-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
--bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, monospace;
/* =========================================
5. BODY & BACKGROUND (Warna Dasar Web)
========================================= */
--bs-body-bg: #f2f7ff;
/* Background halaman (Biru sangat muda) */
--bs-body-bg-rgb: 242, 247, 255;
--bs-body-color: #607080;
/* Warna Teks Paragraf */
--bs-body-color-rgb: 96, 112, 128;
--bs-heading-color: #25396f;
/* Warna Judul (H1-H6) - Biru Gelap */
/* =========================================
6. LINKS & INTERACTIONS (Klik & Hover)
========================================= */
--bs-link-color: var(--bs-primary);
/* Mengikuti warna Primary (Teal) */
--bs-link-hover-color: #2a6161;
/* Warna saat kursor di atas link */
--bs-link-decoration: underline;
/* Focus Ring (Garis pinggir saat input diklik) */
--bs-focus-ring-width: .25rem;
--bs-focus-ring-opacity: .25;
--bs-focus-ring-color: rgba(59, 129, 129, .25);
/* DIPERBAIKI: Teal transparan (bukan biru lagi) */
/* =========================================
7. BORDERS & RADIUS (Garis & Lengkungan)
========================================= */
--bs-border-width: 1px;
--bs-border-style: solid;
--bs-border-color: #dee2e6;
--bs-border-color-translucent: rgba(0, 0, 0, .175);
/* Radius (Seberapa bulat sudut elemen) */
--bs-border-radius: .25rem;
/* Default (4px) */
--bs-border-radius-sm: .2rem;
/* Kecil */
--bs-border-radius-lg: .3rem;
/* Besar */
--bs-border-radius-xl: 1rem;
/* Extra Besar (Kartu/Modal) */
--bs-border-radius-xxl: 2rem;
--bs-border-radius-2xl: var(--bs-border-radius-xxl);
--bs-border-radius-pill: 50rem;
/* Bentuk Pil/Bulat penuh */
/* =========================================
8. COMPONENTS (Bayangan & Form)
========================================= */
/* Box Shadows */
--bs-box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .15);
--bs-box-shadow-sm: 0 .125rem .25rem rgba(0, 0, 0, .075);
--bs-box-shadow-lg: 0 .75rem 3rem rgba(0, 0, 0, .225);
--bs-box-shadow-inset: inset 0 1px 2px rgba(0, 0, 0, .075);
/* Form Validation State */
--bs-form-valid-color: #198754;
--bs-form-valid-border-color: #198754;
--bs-form-invalid-color: #dc3545;
--bs-form-invalid-border-color: #dc3545;
/* Lain-lain (Highlight & Gradient) */
--bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, .15), rgba(255, 255, 255, 0));
--bs-code-color: #d63384;
--bs-highlight-color: #607080;
--bs-highlight-bg: #fcf8e3;
/* =========================================
9. LEGACY TEMPLATE COLORS (Sisa Bawaan)
* Bagian ini warna biru bawaan Mazer.
* Sudah saya rapikan di bawah. Aman dibiarkan atau dihapus.
========================================= */
--bs-primary-text-emphasis: #1b264c;
--bs-secondary-text-emphasis: #2b2f32;
--bs-success-text-emphasis: #0a3622;
@ -150,6 +258,8 @@ [data-bs-theme=light] {
--bs-danger-text-emphasis: #58151c;
--bs-light-text-emphasis: #495057;
--bs-dark-text-emphasis: #495057;
/* Subtle Backgrounds (Background tipis) */
--bs-primary-bg-subtle: #d9dff2;
--bs-secondary-bg-subtle: #f8f9fa;
--bs-success-bg-subtle: #d1e7dd;
@ -158,6 +268,8 @@ [data-bs-theme=light] {
--bs-danger-bg-subtle: #f8d7da;
--bs-light-bg-subtle: #fcfcfd;
--bs-dark-bg-subtle: #ced4da;
/* Subtle Borders */
--bs-primary-border-subtle: #b4bfe5;
--bs-secondary-border-subtle: #e9ecef;
--bs-success-border-subtle: #a3cfbb;
@ -166,60 +278,6 @@ [data-bs-theme=light] {
--bs-danger-border-subtle: #f1aeb5;
--bs-light-border-subtle: #e9ecef;
--bs-dark-border-subtle: #adb5bd;
--bs-white-rgb: 255, 255, 255;
--bs-black-rgb: 0, 0, 0;
--bs-font-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
--bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
--bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, .15), rgba(255, 255, 255, 0));
--bs-body-font-family: "Nunito";
--bs-body-font-size: 1rem;
--bs-body-font-weight: 400;
--bs-body-line-height: 1.5;
--bs-body-color: #607080;
--bs-body-color-rgb: 96, 112, 128;
--bs-body-bg: #f2f7ff;
--bs-body-bg-rgb: 242, 247, 255;
--bs-emphasis-color: #000;
--bs-emphasis-color-rgb: 0, 0, 0;
--bs-secondary-color: rgba(96, 112, 128, .75);
--bs-secondary-color-rgb: 96, 112, 128;
--bs-secondary-bg: #e9ecef;
--bs-secondary-bg-rgb: 233, 236, 239;
--bs-tertiary-color: rgba(96, 112, 128, .5);
--bs-tertiary-color-rgb: 96, 112, 128;
--bs-tertiary-bg: #f8f9fa;
--bs-tertiary-bg-rgb: 248, 249, 250;
--bs-heading-color: #25396f;
--bs-link-color: #435ebe;
--bs-link-color-rgb: 67, 94, 190;
--bs-link-decoration: underline;
--bs-link-hover-color: #364b98;
--bs-link-hover-color-rgb: 54, 75, 152;
--bs-code-color: #d63384;
--bs-highlight-color: #607080;
--bs-highlight-bg: #fcf8e3;
--bs-border-width: 1px;
--bs-border-style: solid;
--bs-border-color: #dee2e6;
--bs-border-color-translucent: rgba(0, 0, 0, .175);
--bs-border-radius: .25rem;
--bs-border-radius-sm: .2rem;
--bs-border-radius-lg: .3rem;
--bs-border-radius-xl: 1rem;
--bs-border-radius-xxl: 2rem;
--bs-border-radius-2xl: var(--bs-border-radius-xxl);
--bs-border-radius-pill: 50rem;
--bs-box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .15);
--bs-box-shadow-sm: 0 .125rem .25rem rgba(0, 0, 0, .075);
--bs-box-shadow-lg: 0 .75rem 3rem rgba(0, 0, 0, .225);
--bs-box-shadow-inset: inset 0 1px 2px rgba(0, 0, 0, .075);
--bs-focus-ring-width: .25rem;
--bs-focus-ring-opacity: .25;
--bs-focus-ring-color: rgba(67, 94, 190, .25);
--bs-form-valid-color: #198754;
--bs-form-valid-border-color: #198754;
--bs-form-invalid-color: #dc3545;
--bs-form-invalid-border-color: #dc3545
}
@ -2752,8 +2810,8 @@ .form-check-input:focus {
}
.form-check-input:checked {
background-color: #435ebe;
border-color: #435ebe
background-color: var(--bs-primary);
border-color: var(--bs-primary)
}
.form-check-input:checked[type=checkbox] {
@ -2765,8 +2823,8 @@ .form-check-input:checked[type=radio] {
}
.form-check-input[type=checkbox]:indeterminate {
background-color: #435ebe;
border-color: #435ebe;
background-color: var(--bs-primary);
border-color: var(--bs-primary);
--bs-form-check-bg-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")
}
@ -2871,7 +2929,7 @@ .form-range::-webkit-slider-thumb {
margin-top: -.25rem;
-webkit-appearance: none;
appearance: none;
background-color: #435ebe;
background-color: var(--bs-primary);
border: 0;
border-radius: 1rem;
transition: background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out
@ -2902,7 +2960,7 @@ .form-range::-moz-range-thumb {
height: 1rem;
-webkit-appearance: none;
appearance: none;
background-color: #435ebe;
background-color: var(--bs-primary);
border: 0;
border-radius: 1rem;
transition: background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out
@ -3461,8 +3519,8 @@ fieldset:disabled .btn {
.btn-primary {
--bs-btn-color: #fff;
--bs-btn-bg: #435ebe;
--bs-btn-border-color: #435ebe;
--bs-btn-bg: var(--bs-primary);
--bs-btn-border-color: var(--bs-primary);
--bs-btn-hover-color: #fff;
--bs-btn-hover-bg: #3950a2;
--bs-btn-hover-border-color: #364b98;
@ -3472,8 +3530,8 @@ .btn-primary {
--bs-btn-active-border-color: #32478f;
--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
--bs-btn-disabled-color: #fff;
--bs-btn-disabled-bg: #435ebe;
--bs-btn-disabled-border-color: #435ebe
--bs-btn-disabled-bg: var(--bs-primary);
--bs-btn-disabled-border-color: var(--bs-primary)
}
.btn-secondary {
@ -3579,19 +3637,19 @@ .btn-light {
}
.btn-outline-primary {
--bs-btn-color: #435ebe;
--bs-btn-border-color: #435ebe;
--bs-btn-color: var(--bs-primary);
--bs-btn-border-color: var(--bs-primary);
--bs-btn-hover-color: #fff;
--bs-btn-hover-bg: #435ebe;
--bs-btn-hover-border-color: #435ebe;
--bs-btn-hover-bg: var(--bs-primary);
--bs-btn-hover-border-color: var(--bs-primary);
--bs-btn-focus-shadow-rgb: 67, 94, 190;
--bs-btn-active-color: #fff;
--bs-btn-active-bg: #435ebe;
--bs-btn-active-border-color: #435ebe;
--bs-btn-active-bg: var(--bs-primary);
--bs-btn-active-border-color: var(--bs-primary);
--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
--bs-btn-disabled-color: #435ebe;
--bs-btn-disabled-color: var(--bs-primary);
--bs-btn-disabled-bg: transparent;
--bs-btn-disabled-border-color: #435ebe;
--bs-btn-disabled-border-color: var(--bs-primary);
--bs-gradient: none
}
@ -3699,7 +3757,7 @@ .btn-outline-light {
.btn-link {
--bs-btn-font-weight: 400;
--bs-btn-color: #435ebe;
--bs-btn-color: var(--bs-primary);
--bs-btn-bg: transparent;
--bs-btn-border-color: transparent;
--bs-btn-hover-color: #364b98;
@ -3827,7 +3885,7 @@ .dropdown-menu {
--bs-dropdown-link-hover-color: #1e2125;
--bs-dropdown-link-hover-bg: #f8f9fa;
--bs-dropdown-link-active-color: #fff;
--bs-dropdown-link-active-bg: #435ebe;
--bs-dropdown-link-active-bg: var(--bs-primary);
--bs-dropdown-link-disabled-color: #6c757d;
--bs-dropdown-item-padding-x: 1.5rem;
--bs-dropdown-item-padding-y: .45rem;
@ -4327,7 +4385,7 @@ .nav-tabs .dropdown-menu {
.nav-pills {
--bs-nav-pills-border-radius: .25rem;
--bs-nav-pills-link-active-color: #fff;
--bs-nav-pills-link-active-bg: #435ebe
--bs-nav-pills-link-active-bg: var(--bs-primary)
}
.nav-pills .nav-link {
@ -5267,7 +5325,7 @@ .pagination {
--bs-pagination-padding-x: .75rem;
--bs-pagination-padding-y: .375rem;
--bs-pagination-font-size: 1rem;
--bs-pagination-color: #435ebe;
--bs-pagination-color: var(--bs-primary);
--bs-pagination-bg: #fff;
--bs-pagination-border-width: 1px;
--bs-pagination-border-color: #dee2e6;
@ -5279,8 +5337,8 @@ .pagination {
--bs-pagination-focus-bg: #e9ecef;
--bs-pagination-focus-box-shadow: 0 0 0 .25rem rgba(67, 94, 190, .25);
--bs-pagination-active-color: #fff;
--bs-pagination-active-bg: #435ebe;
--bs-pagination-active-border-color: #435ebe;
--bs-pagination-active-bg: var(--bs-primary);
--bs-pagination-active-border-color: var(--bs-primary);
--bs-pagination-disabled-color: #6c757d;
--bs-pagination-disabled-bg: #fff;
--bs-pagination-disabled-border-color: #dee2e6;
@ -5491,7 +5549,7 @@ .progress-stacked {
--bs-progress-border-radius: .18rem;
--bs-progress-box-shadow: inset 0 1px 2px rgba(0, 0, 0, .075);
--bs-progress-bar-color: #fff;
--bs-progress-bar-bg: #435ebe;
--bs-progress-bar-bg: var(--bs-primary);
--bs-progress-bar-transition: width .6s ease;
display: flex;
height: var(--bs-progress-height);
@ -5558,8 +5616,8 @@ .list-group {
--bs-list-group-disabled-color: #6c757d;
--bs-list-group-disabled-bg: #fff;
--bs-list-group-active-color: #fff;
--bs-list-group-active-bg: #435ebe;
--bs-list-group-active-border-color: #435ebe;
--bs-list-group-active-bg: var(--bs-primary);
--bs-list-group-active-border-color: var(--bs-primary);
display: flex;
flex-direction: column;
padding-left: 0;
@ -8132,9 +8190,6 @@ .focus-ring-light {
--bs-focus-ring-color: rgba(var(--bs-light-rgb), var(--bs-focus-ring-opacity))
}
.focus-ring-dark {
--bs-focus-ring-color: rgba(var(--bs-dark-rgb), var(--bs-focus-ring-opacity))
}
.position-static {
position: static !important
@ -8291,11 +8346,6 @@ .border-light {
border-color: rgba(var(--bs-light-rgb), var(--bs-border-opacity)) !important
}
.border-dark {
--bs-border-opacity: 1;
border-color: rgba(var(--bs-dark-rgb), var(--bs-border-opacity)) !important
}
.border-black {
--bs-border-opacity: 1;
border-color: rgba(var(--bs-black-rgb), var(--bs-border-opacity)) !important
@ -8334,10 +8384,6 @@ .border-light-subtle {
border-color: var(--bs-light-border-subtle) !important
}
.border-dark-subtle {
border-color: var(--bs-dark-border-subtle) !important
}
.border-0 {
border-width: 0 !important
}
@ -9244,11 +9290,6 @@ .text-light {
color: rgba(var(--bs-light-rgb), var(--bs-text-opacity)) !important
}
.text-dark {
--bs-text-opacity: 1;
color: rgba(var(--bs-dark-rgb), var(--bs-text-opacity)) !important
}
.text-black {
--bs-text-opacity: 1;
color: rgba(var(--bs-black-rgb), var(--bs-text-opacity)) !important
@ -9343,10 +9384,6 @@ .text-light-emphasis {
color: var(--bs-light-text-emphasis) !important
}
.text-dark-emphasis {
color: var(--bs-dark-text-emphasis) !important
}
.link-opacity-10,
.link-opacity-10-hover:hover {
--bs-link-opacity: .1
@ -9422,11 +9459,6 @@ .link-underline-light {
text-decoration-color: rgba(var(--bs-light-rgb), var(--bs-link-underline-opacity)) !important
}
.link-underline-dark {
--bs-link-underline-opacity: 1;
text-decoration-color: rgba(var(--bs-dark-rgb), var(--bs-link-underline-opacity)) !important
}
.link-underline {
--bs-link-underline-opacity: 1;
text-decoration-color: rgba(var(--bs-link-color-rgb), var(--bs-link-underline-opacity, 1)) !important
@ -9497,11 +9529,6 @@ .bg-light {
background-color: rgba(var(--bs-light-rgb), var(--bs-bg-opacity)) !important
}
.bg-dark {
--bs-bg-opacity: 1;
background-color: rgba(var(--bs-dark-rgb), var(--bs-bg-opacity)) !important
}
.bg-black {
--bs-bg-opacity: 1;
background-color: rgba(var(--bs-black-rgb), var(--bs-bg-opacity)) !important
@ -9580,10 +9607,6 @@ .bg-light-subtle {
background-color: var(--bs-light-bg-subtle) !important
}
.bg-dark-subtle {
background-color: var(--bs-dark-bg-subtle) !important
}
.bg-gradient {
background-image: var(--bs-gradient) !important
}
@ -21835,7 +21858,7 @@ .alert .alert-heading+p {
}
.alert-primary {
background-color: #435ebe;
background-color: var(--bs-primary);
color: #fff
}
@ -21884,16 +21907,6 @@ .alert-danger a {
font-weight: 700
}
.alert-dark {
background-color: #454546;
color: #fff
}
.alert-dark a {
color: #fff;
font-weight: 700
}
.alert-light {
background-color: #f9f9f9;
color: #818182
@ -21950,12 +21963,6 @@ .alert-light-info {
border: 1px solid #d7fcff
}
.alert-light-dark {
background-color: #e6e0e0;
color: #7f3737;
border: 1px solid #dbdbdb
}
.avatar {
display: inline-flex;
border-radius: 50%;
@ -22115,11 +22122,6 @@ .btn.btn-light-info {
color: #00474d
}
.btn.btn-light-dark {
background-color: #e3e3e3;
color: #171717
}
.btn-block {
width: 100%
}
@ -22269,14 +22271,14 @@ .pricing ul li svg {
}
.pricing .card-highlighted {
background-color: #435ebe;
background-color: var(--bs-primary);
padding-top: 20px;
padding-bottom: 20px
}
.pricing .card-highlighted .card-header,
.pricing .card-highlighted .card-body {
background-color: #435ebe;
background-color: var(--bs-primary);
color: #fff
}
@ -22290,7 +22292,7 @@ .pricing .card-highlighted ul li svg {
}
.pricing .card-highlighted .card-footer {
background-color: #435ebe
background-color: var(--bs-primary)
}
.pricing .card-highlighted .card-title {
@ -22413,9 +22415,9 @@ .form-group.with-title dataTable-input {
.form-group.with-title .form-control:focus~label,
.form-group.with-title dataTable-input:focus~label {
border-left: 1px solid #435ebe;
border-top: 1px solid #435ebe;
border-right: 1px solid #435ebe
border-left: 1px solidvar(--bs-primary);
border-top: 1px solidvar(--bs-primary);
border-right: 1px solidvar(--bs-primary)
}
.form-group[class*=has-icon-].has-icon-left .form-control {
@ -22509,8 +22511,8 @@ .form-check .form-check-input:focus {
}
.form-check .form-check-input.form-check-primary {
background-color: #435ebe;
border-color: #435ebe
background-color: var(--bs-primary);
border-color: var(--bs-primary)
}
.form-check .form-check-input.form-check-primary:not(:checked) {
@ -22634,24 +22636,6 @@ .form-check .form-check-input.form-check-light.form-check-glow:not(:checked) {
box-shadow: none
}
.form-check .form-check-input.form-check-dark {
background-color: #131313;
border-color: #131313
}
.form-check .form-check-input.form-check-dark:not(:checked) {
background-color: transparent;
border: 1px solid #ced4da
}
.form-check .form-check-input.form-check-dark.form-check-glow {
box-shadow: 0 0 5px #2d2d2d
}
.form-check .form-check-input.form-check-dark.form-check-glow:not(:checked) {
box-shadow: none
}
.form-check.form-check-sm .form-check-input {
width: .9rem;
height: .9rem;
@ -22673,8 +22657,8 @@ .form-check.form-check-lg label {
}
.form-check.form-check-primary .form-check-input {
background-color: #435ebe;
border-color: #435ebe
background-color: var(--bs-primary);
border-color: var(--bs-primary)
}
.form-check.form-check-secondary .form-check-input {
@ -22707,11 +22691,6 @@ .form-check.form-check-light .form-check-input {
border-color: #ced4da
}
.form-check.form-check-dark .form-check-input {
background-color: #131313;
border-color: #131313
}
.dataTable-input {
min-height: calc(1.5em + .934rem + 2px);
padding: .467rem .6rem !important;
@ -22924,7 +22903,7 @@ .sidebar-wrapper .menu .sidebar-item.active.has-sub .sidebar-link:after {
}
.sidebar-wrapper .menu .sidebar-item.active>.sidebar-link {
background-color: #435ebe
background-color: var(--bs-primary)
}
.sidebar-wrapper .menu .sidebar-item.active>.sidebar-link span {
@ -22966,7 +22945,7 @@ .sidebar-wrapper .menu .submenu .submenu-item.active {
}
.sidebar-wrapper .menu .submenu .submenu-item.active>a {
color: #435ebe;
color: var(--bs-primary);
font-weight: 700
}
@ -22982,7 +22961,7 @@ .sidebar-wrapper .menu .submenu .submenu-item a {
.sidebar-wrapper .menu .submenu .submenu-item a:hover {
margin-left: .3rem;
color: #435ebe
color: var(--bs-primary)
}
.sidebar-item.has-sub,
@ -23067,7 +23046,7 @@ .nav-tabs .nav-link:hover {
.nav-tabs .nav-link.active {
border: none;
position: relative;
color: #435ebe
color: var(--bs-primary)
}
.nav-tabs .nav-link.active:after {
@ -23076,7 +23055,7 @@ .nav-tabs .nav-link.active:after {
position: absolute;
bottom: 0;
height: 2px;
background-color: #435ebe;
background-color: var(--bs-primary);
left: 0;
box-shadow: 0 2px 5px rgba(67, 94, 190, .5)
}
@ -23223,7 +23202,7 @@ .layout-horizontal .submenu-item.active a {
}
.layout-horizontal .main-navbar {
background-color: #435ebe;
background-color: var(--bs-primary);
padding: 1rem
}
@ -23449,8 +23428,8 @@ #topbarUserDropdown:after {
}
.pagination.pagination-primary .page-item.active .page-link {
background-color: #435ebe;
border-color: #435ebe;
background-color: var(--bs-primary);
border-color: var(--bs-primary);
box-shadow: 0 2px 5px rgba(67, 94, 190, .3)
}
@ -23490,12 +23469,6 @@ .pagination.pagination-light .page-item.active .page-link {
box-shadow: 0 2px 5px rgba(206, 212, 218, .3)
}
.pagination.pagination-dark .page-item.active .page-link {
background-color: #131313;
border-color: #131313;
box-shadow: 0 2px 5px rgba(19, 19, 19, .3)
}
.page-item:not(.active) .page-link:hover {
color: #000
}
@ -23575,7 +23548,7 @@ .progress.progress-primary {
}
.progress.progress-primary .progress-bar {
background-color: #435ebe;
background-color: var(--bs-primary);
border-radius: .18rem
}
@ -23633,15 +23606,6 @@ .progress.progress-light .progress-bar {
border-radius: .18rem
}
.progress.progress-dark {
overflow: visible
}
.progress.progress-dark .progress-bar {
background-color: #131313;
border-radius: .18rem
}
.progress.progress-sm {
height: .4rem
}
@ -23871,11 +23835,6 @@ .bg-light-info {
color: #00474d
}
.bg-light-dark {
background-color: #e3e3e3;
color: #171717
}
.bg-light {
color: #343a40
}