154 lines
3.2 KiB
SCSS
Executable File
154 lines
3.2 KiB
SCSS
Executable File
//
|
|
// using scss variables
|
|
//
|
|
$border-color-dark: #333f55 !default;
|
|
$body-color-dark: #7c8fac !default;
|
|
$body-bg-dark: #2a3447 !default;
|
|
$link-color-dark: #7c8fac !default;
|
|
$body-secondary-color-dark: rgba($body-color-dark, 1) !default;
|
|
|
|
$primary-bg-subtle-dark: #253662 !default;
|
|
$secondary-bg-subtle-dark: #1c455d !default;
|
|
$success-bg-subtle-dark: #1b3c48 !default;
|
|
$info-bg-subtle-dark: #223662 !default;
|
|
$warning-bg-subtle-dark: #4d3a2a !default;
|
|
$danger-bg-subtle-dark: #4b313d !default;
|
|
$light-bg-subtle-dark: #465670 !default;
|
|
$dark-bg-subtle-dark: #333f55 !default;
|
|
|
|
$link-hover-color-dark: $primary !default;
|
|
|
|
$dropdown-dark-link-hover-bg: $primary-bg-subtle-dark !default;
|
|
|
|
//
|
|
// using css variables
|
|
//
|
|
[data-bs-theme="dark"] {
|
|
--bs-heading-color: #eaeff4 !important;
|
|
|
|
.tooltip-inner {
|
|
color: $body-color-dark !important;
|
|
}
|
|
|
|
.card {
|
|
--bs-card-title-color: #eaeff4;
|
|
--bs-card-subtitle-color: #7c8fac;
|
|
--bs-card-box-shadow: rgba(145, 158, 171, 0.3) 0px 0px 2px 0px,
|
|
rgba(145, 158, 171, 0.02) 0px 12px 24px -4px;
|
|
}
|
|
|
|
.dropdown-menu {
|
|
--bs-dropdown-box-shadow: rgba(145, 158, 171, 0.3) 0px 0px 2px 0px,
|
|
rgba(145, 158, 171, 0.02) 0px 12px 24px -4px;
|
|
}
|
|
|
|
.table {
|
|
--bs-table-border-color: #333f55;
|
|
}
|
|
|
|
.table-hover > tbody > tr:hover > * {
|
|
--bs-table-bg-state: $body-bg-dark;
|
|
}
|
|
|
|
.table-striped > tbody > tr:nth-of-type(odd) > * {
|
|
--bs-table-bg-type: transparent;
|
|
}
|
|
|
|
.jsgrid-grid-header,
|
|
.jsgrid-header-row > .jsgrid-header-cell,
|
|
.jsgrid-header-cell,
|
|
.jsgrid-cell {
|
|
background: $body-bg-dark !important;
|
|
}
|
|
|
|
.jsgrid-edit-row > .jsgrid-cell,
|
|
.jsgrid-filter-row > .jsgrid-cell,
|
|
.jsgrid-grid-body,
|
|
.jsgrid-grid-header,
|
|
.jsgrid-header-row > .jsgrid-header-cell,
|
|
.jsgrid-insert-row > .jsgrid-cell {
|
|
border: 1px solid $border-color-dark;
|
|
}
|
|
|
|
.accordion-item,
|
|
.accordion-item:focus {
|
|
--bs-accordion-btn-color: #eaeff4;
|
|
--bs-accordion-border-color: #333f55;
|
|
}
|
|
|
|
.accordion-button:not(.collapsed) {
|
|
color: #eaeff4;
|
|
}
|
|
|
|
.nav-tabs .nav-link,
|
|
.nav-pills .nav-link,
|
|
.breadcrumb-item + .breadcrumb-item::before {
|
|
color: $link-color-dark;
|
|
}
|
|
|
|
.input-group-text {
|
|
background-color: $light-bg-subtle-dark;
|
|
border: var(--bs-table-border-color);
|
|
color: $body-color-dark;
|
|
}
|
|
|
|
.form-check-input {
|
|
border: 1.25px solid $light-bg-subtle-dark;
|
|
}
|
|
|
|
.bootstrap-switch .bootstrap-switch-label,
|
|
.app-chat-offcanvas {
|
|
background: $body-bg-dark;
|
|
}
|
|
|
|
.text-dark,
|
|
.form-label,
|
|
.col-form-label {
|
|
color: $body-color-dark !important;
|
|
}
|
|
|
|
.text-bg-light,
|
|
.bg-light,
|
|
.striped-rows .row:nth-child(odd),
|
|
.bg-hover-light-black:hover {
|
|
background-color: $light-bg-subtle-dark !important;
|
|
color: var(--bs-card-title-color) !important;
|
|
}
|
|
|
|
.dropdown-item:hover,
|
|
.dropdown-item:focus {
|
|
background-color: $dark-bg-subtle-dark;
|
|
}
|
|
|
|
.form-select,
|
|
.form-select:focus,
|
|
.form-control,
|
|
.form-control:focus {
|
|
border-color: $border-color-dark;
|
|
color: $body-color-dark;
|
|
background-color: $body-bg-dark;
|
|
}
|
|
|
|
.connect-sorting-todo,
|
|
.connect-sorting {
|
|
background: var(--bs-dark-bg-subtle);
|
|
}
|
|
|
|
a:hover {
|
|
h6,
|
|
.h6,
|
|
h5,
|
|
.h5,
|
|
h4,
|
|
.h4,
|
|
h3,
|
|
.h3,
|
|
h2,
|
|
.h2,
|
|
h1,
|
|
.h1 {
|
|
color: var(--bs-primary);
|
|
}
|
|
}
|
|
}
|