liz/PluralKit
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat(dashboard): move dark overrides to own file

Browse Source
This commit is contained in:
Draconizations
2022-06-03 17:34:33 +02:00
parent c049dafe5d
commit 2819c97552
2 changed files with 49 additions and 47 deletions
Download Patch File Download Diff File Expand all files Collapse all files

46
dashboard/styles/dark.scss Normal file
View 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
}
}

50
dashboard/styles/themes.scss
View File

@@ -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";