283 lines
5.4 KiB
SCSS
283 lines
5.4 KiB
SCSS
.dark-version {
|
|
background-color: $dark-version-bg-color !important;
|
|
|
|
> div[class*='bg-']{
|
|
background-color: $dark-version-bg-color !important;
|
|
}
|
|
|
|
.sidenav {
|
|
background: $dark-version-sidenav-bg-color !important;
|
|
|
|
&.bg-transparent {
|
|
background: transparent !important;
|
|
|
|
.navbar-nav {
|
|
.nav-link {
|
|
color: $white !important;
|
|
}
|
|
}
|
|
.nav {
|
|
.nav-link {
|
|
color: $white !important;
|
|
}
|
|
}
|
|
}
|
|
|
|
&.bg-white {
|
|
background: $white !important;
|
|
|
|
.navbar-nav {
|
|
.nav-link {
|
|
&.active:after {
|
|
color: $dark-version-caret-sidebar-color;
|
|
}
|
|
}
|
|
}
|
|
.collapse {
|
|
.nav-item {
|
|
.nav-link:not(.active) {
|
|
i {
|
|
color: $dark !important;
|
|
}
|
|
}
|
|
h6 {
|
|
color: $dark !important;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.fixed-plugin {
|
|
.btn {
|
|
&.bg-gradient-dark,
|
|
&.btn-outline-dark {
|
|
color: $white !important;
|
|
border: 1px solid $white !important;
|
|
}
|
|
&.active {
|
|
background: $white !important;
|
|
color: $h-color !important;
|
|
}
|
|
}
|
|
}
|
|
|
|
.bg-gradient-dark {
|
|
background-image: linear-gradient(195deg, $dark-gradient-dark, $dark-gradient-state-dark);
|
|
}
|
|
|
|
.card,
|
|
.swal2-popup,
|
|
.dropdown .dropdown-menu,
|
|
.kanban-board {
|
|
background: $dark-version-card-bg-color;
|
|
box-shadow: $dark-version-card-box-shadow;
|
|
|
|
.card-header {
|
|
background: transparent;
|
|
}
|
|
|
|
p {
|
|
color: $white !important;
|
|
opacity: .6;
|
|
}
|
|
}
|
|
|
|
.kanban-item {
|
|
background: transparent !important;
|
|
border: 1px solid;
|
|
}
|
|
|
|
.swal2-html-container {
|
|
color: $white !important;
|
|
opacity: .6;
|
|
}
|
|
|
|
h1, .h1,
|
|
h2, .h2,
|
|
h3, .h3,
|
|
h4, .h4,
|
|
h5, .h5,
|
|
h6, .h6,
|
|
a:not(.dropdown-item):not(.choices__item):not(.leaflet-control-zoom-in):not(.leaflet-control-zoom-out):not(.btn):not(.nav-link):not(.fixed-plugin-button),
|
|
.table thead tr th,
|
|
.kanban-title-board {
|
|
color: $white !important;
|
|
}
|
|
|
|
.input-group {
|
|
&.input-group-dynamic,
|
|
&.input-group-static {
|
|
.form-control {
|
|
background-image: $dark-version-input-bg-image !important;
|
|
background-size: 0 100%, 100% 100%;
|
|
&:focus {
|
|
background-size: 100% 100%, 100% 100%;
|
|
}
|
|
}
|
|
}
|
|
|
|
&.input-group-outline {
|
|
.form-control {
|
|
border-color: $dark-version-border-color !important;
|
|
}
|
|
}
|
|
|
|
.is-valid,
|
|
.is-invalid {
|
|
border-color: $dark-version-border-color !important;
|
|
}
|
|
}
|
|
|
|
.accordion {
|
|
.accordion-button {
|
|
border-color: $dark-version-border-color !important;
|
|
color: $white;
|
|
opacity: .8;
|
|
}
|
|
}
|
|
|
|
.table > :not(caption) > * > * {
|
|
border-color: $dark-version-border-color !important;
|
|
color: $dark-version-table-color !important;
|
|
}
|
|
|
|
label {
|
|
color: $dark-version-body-color !important;
|
|
}
|
|
|
|
.list-group-item,
|
|
.multisteps-form__panel {
|
|
background-color: transparent !important;
|
|
border-color: rgba(255, 255, 255, .15) !important;
|
|
}
|
|
|
|
.nav {
|
|
&.bg-white {
|
|
background-color: $dark-version-card-bg-color !important;
|
|
box-shadow: $dark-version-card-box-shadow;
|
|
}
|
|
|
|
.nav-link[data-scroll]:hover {
|
|
color: $h-color !important;
|
|
}
|
|
}
|
|
|
|
.toast {
|
|
background-color: $dark-version-card-bg-color !important;
|
|
box-shadow: $dark-version-card-box-shadow;
|
|
|
|
.toast-header {
|
|
background: transparent;
|
|
}
|
|
|
|
span {
|
|
color: $white;
|
|
}
|
|
|
|
p {
|
|
color: $white !important;
|
|
opacity: .6;
|
|
}
|
|
}
|
|
|
|
.choices {
|
|
.choices__input {
|
|
background-color: transparent !important;
|
|
border-bottom: 1px solid $dark-version-border-color;
|
|
color: $white;
|
|
}
|
|
.choices__list.choices__list--dropdown {
|
|
background: $dark-version-card-bg-color;
|
|
box-shadow: $dark-version-card-box-shadow;
|
|
}
|
|
}
|
|
|
|
// Fullcalendar changes
|
|
.fc-theme-standard td,
|
|
.fc-theme-standard th {
|
|
border-color: $fc-theme-standard-dark-border-color;
|
|
}
|
|
|
|
|
|
// Datatable changes
|
|
.dataTable-sorter::after{
|
|
border-bottom-color: $white;
|
|
}
|
|
|
|
.dataTable-sorter::before{
|
|
border-top-color: $white;
|
|
}
|
|
|
|
// Quill changes
|
|
.ql-snow .ql-stroke {
|
|
stroke: $light;
|
|
}
|
|
|
|
.ql-snow .ql-fill, .ql-snow .ql-stroke.ql-fill{
|
|
fill: $light;
|
|
}
|
|
|
|
.ql-toolbar.ql-snow .ql-picker-label{
|
|
color: $light;
|
|
}
|
|
|
|
.navbar-vertical {
|
|
.navbar-nav {
|
|
.nav-item {
|
|
.nav-link {
|
|
color: $white;
|
|
opacity: .8;
|
|
|
|
&[data-bs-toggle="collapse"]:after {
|
|
color: $white;
|
|
}
|
|
|
|
&.active {
|
|
box-shadow: $dark-nav-link-active-shadow;
|
|
}
|
|
}
|
|
.collapse,
|
|
.collapsing {
|
|
.nav {
|
|
.nav-item {
|
|
.nav-link {
|
|
color: $white;
|
|
opacity: .6;
|
|
|
|
&.active {
|
|
opacity: 1;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
.dropdown {
|
|
.dropdown-menu {
|
|
&:before {
|
|
color: $dark-version-card-bg-color;
|
|
}
|
|
|
|
.dropdown-item {
|
|
&:hover,
|
|
&:focus {
|
|
background-color: $dark-version-bg-color !important;
|
|
}
|
|
i,
|
|
.material-icons {
|
|
color: $white;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
body.dark-version {
|
|
color: $dark-version-body-color !important;
|
|
}
|