feat(dashboard): move dark overrides to own file
This commit is contained in:
parent
c049dafe5d
commit
2819c97552
46
dashboard/styles/dark.scss
Normal file
46
dashboard/styles/dark.scss
Normal file
@ -0,0 +1,46 @@
|
||||
@import "../node_modules/bootstrap-dark-5/scss/variables-alt";
|
||||
|
||||
.dark {
|
||||
.navbar.bg-light {
|
||||
background-color: $body-bg-alt !important;
|
||||
}
|
||||
|
||||
.footer.bg-light {
|
||||
background-color: $dark-alt !important;
|
||||
}
|
||||
|
||||
.nav-item {
|
||||
.btn.btn-transparent {
|
||||
color: rgba(250,250,250,.55);
|
||||
}
|
||||
}
|
||||
|
||||
// bootstrap
|
||||
.nav-tabs * .nav-link {
|
||||
background-color: $body-bg-alt !important;
|
||||
}
|
||||
|
||||
//svelecte
|
||||
.svelecte-control .sv-control, .sv-content, .sv-dropdown, .sv-item, .sv-item-content {
|
||||
color: $body-color-alt !important; //this can also be optionally overwritten
|
||||
background-color: $body-bg-alt !important;
|
||||
}
|
||||
|
||||
.sv-item-btn {
|
||||
background-color: $light-alt !important;
|
||||
}
|
||||
|
||||
// discord markdown
|
||||
.d-spoiler {
|
||||
color: $dark-alt; //overwrite
|
||||
background-color: $dark-alt; //overwrite
|
||||
}
|
||||
|
||||
.d-spoiler::selection {
|
||||
color: $dark-alt; //overwrite
|
||||
}
|
||||
|
||||
.d-spoiler:active {
|
||||
color: $body-color-alt; //overwrite
|
||||
}
|
||||
}
|
@ -1,51 +1,7 @@
|
||||
$primary: #da9317;
|
||||
$primary-alt: #da9317;
|
||||
@import "../node_modules/bootstrap/scss/bootstrap.scss";
|
||||
|
||||
// dark mode. dark.scss extends nightshade
|
||||
@import "bootstrap-nightshade.scss";
|
||||
|
||||
.dark {
|
||||
.navbar.bg-light {
|
||||
background-color: var(--bs-body-bg-alt) !important;
|
||||
}
|
||||
|
||||
.footer.bg-light {
|
||||
background-color: var(--bs-dark-alt) !important;
|
||||
}
|
||||
|
||||
> * {
|
||||
.nav-item {
|
||||
.btn.btn-transparent {
|
||||
color: rgba(250,250,250,.55);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// bootstrap
|
||||
.nav-tabs * .nav-link {
|
||||
background-color: var(--bs-body-bg-alt) !important;
|
||||
}
|
||||
|
||||
//svelecte
|
||||
.svelecte-control .sv-control, .sv-content, .sv-dropdown, .sv-item, .sv-item-content {
|
||||
color: var(--bs-body-color-alt) !important; //this can also be optionally overwritten
|
||||
background-color: var(--bs-body-bg-alt) !important;
|
||||
}
|
||||
|
||||
.sv-item-btn {
|
||||
background-color: var(--bs-light-alt) !important;
|
||||
}
|
||||
|
||||
// discord markdown
|
||||
.d-spoiler {
|
||||
color: var(--bs-dark-alt); //overwrite
|
||||
background-color: var(--bs-dark-alt); //overwrite
|
||||
}
|
||||
|
||||
.d-spoiler::selection {
|
||||
color: var(--bs-dark-alt); //overwrite
|
||||
}
|
||||
|
||||
.d-spoiler:active {
|
||||
color: var(--bs-body-color-alt); //overwrite
|
||||
}
|
||||
}
|
||||
@import "dark.scss";
|
Loading…
Reference in New Issue
Block a user