mirror of
https://github.com/amir20/dozzle.git
synced 2025-12-30 17:47:28 +01:00
156c6abffc
* added support for toggling between new light theme and dark theme. * improved light theme colors * light-theme styles are now scoped and applied in each component/page Co-authored-by: Catalin MUNTEANU <cmunteanu@bitdefender.com>
85 lines
1.6 KiB
SCSS
85 lines
1.6 KiB
SCSS
@charset "utf-8";
|
|
|
|
$menu-item-active-background-color: hsl(171, 100%, 41%);
|
|
$menu-item-color: hsl(0, 6%, 87%);
|
|
|
|
@import "~bulma";
|
|
@import "../node_modules/splitpanes/dist/splitpanes.css";
|
|
@import "~buefy/src/scss/utils/_all";
|
|
@import "~buefy/src/scss/components/_dropdown";
|
|
@import "~buefy/src/scss/components/_switch";
|
|
|
|
html {
|
|
overflow-x: unset;
|
|
overflow-y: unset;
|
|
scroll-snap-type: y proximity;
|
|
background-color: #111;
|
|
|
|
&.has-light-theme {
|
|
background-color: #F8F8F8;
|
|
}
|
|
}
|
|
|
|
body {
|
|
font-family: "Roboto", sans-serif;
|
|
color: #ddd;
|
|
|
|
html.has-light-theme & {
|
|
color: #333;
|
|
}
|
|
}
|
|
|
|
html.has-custom-scrollbars {
|
|
::-webkit-scrollbar {
|
|
width: 8px;
|
|
display: content;
|
|
}
|
|
|
|
::-webkit-scrollbar-thumb {
|
|
background-color: rgba(128, 128, 128, 0.33);
|
|
outline: 1px solid slategrey;
|
|
border-radius: 4px;
|
|
}
|
|
|
|
::-webkit-scrollbar-thumb:active {
|
|
background-color: #777;
|
|
}
|
|
|
|
::-webkit-scrollbar-track {
|
|
background-color: transparent;
|
|
}
|
|
|
|
::-webkit-scrollbar-track:hover {
|
|
background-color: rgba(64, 64, 64, 0.33);
|
|
}
|
|
|
|
section main {
|
|
scrollbar-color: #353535 transparent;
|
|
scrollbar-width: thin;
|
|
}
|
|
}
|
|
|
|
.is-settings-control {
|
|
background: rgba(0, 0, 0, 0.4);
|
|
color: #fff;
|
|
border-color: transparent;
|
|
&:hover {
|
|
border-color: rgb(255, 221, 87) !important;
|
|
background: rgba(0, 0, 0, 0.8) !important;
|
|
color: #fff !important;
|
|
}
|
|
|
|
&:focus {
|
|
box-shadow: none !important;
|
|
color: unset;
|
|
border-color: transparent;
|
|
}
|
|
|
|
html.has-light-theme & {
|
|
&:hover {
|
|
background: #7d7d68 !important;
|
|
border-color: #7d7d68 !important;
|
|
}
|
|
}
|
|
}
|