Introduce Dark Mode
This commit mainly changes the color definitions. Mostly, those changes are semantically equally, but there are a few changes that occurred to align the color scheme within the app.
This commit is contained in:
@@ -11,6 +11,29 @@ $web-font-path: '//';
|
||||
@import '~bootswatch/dist/yeti/variables';
|
||||
@import '~bootstrap/scss/bootstrap';
|
||||
@import '~bootswatch/dist/yeti/bootswatch';
|
||||
|
||||
// We define our own button style here, since `btn-outline-dark` and `btn-outline-light` do not switch colors.
|
||||
html[data-bs-theme="dark"] {
|
||||
.btn-outline-contrast {
|
||||
@extend .btn-outline-light;
|
||||
}
|
||||
|
||||
.bg-contrast {
|
||||
@extend .bg-light;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
html[data-bs-theme="light"] {
|
||||
.btn-outline-contrast {
|
||||
@extend .btn-outline-dark;
|
||||
}
|
||||
|
||||
.bg-contrast {
|
||||
@extend .bg-dark;
|
||||
}
|
||||
}
|
||||
|
||||
$fa-font-path: '~@fortawesome/fontawesome-free/webfonts/';
|
||||
@import '~@fortawesome/fontawesome-free/scss/fontawesome';
|
||||
@import '~@fortawesome/fontawesome-free/scss/solid';
|
||||
|
Reference in New Issue
Block a user