199 lines
3.2 KiB
SCSS
199 lines
3.2 KiB
SCSS
$pink: #ee9cdd;
|
|
$magenta: #c47fd5;
|
|
$red: #e06e6e;
|
|
$yellow: #d8b25b;
|
|
$green: #8ccf7e;
|
|
$teal: #8ad8ef;
|
|
$blue: #5dc1dd;
|
|
$sky: #5db7cb;
|
|
$lavender: #bab3e5;
|
|
$black0: #1b2224;
|
|
$black1: #232a2c;
|
|
$black2: #181f21;
|
|
$black3: #22282b;
|
|
$black4: #202729;
|
|
$gray0: #b3b9b8;
|
|
$gray1: #bdc3c2;
|
|
$gray3: #636a6c;
|
|
$white: #777e80;
|
|
$background: $black0;
|
|
$background-dark: $black2;
|
|
|
|
* {
|
|
all: unset;
|
|
}
|
|
|
|
.window {
|
|
background-color: transparent;
|
|
}
|
|
|
|
.settings-panel {
|
|
border-radius: 1rem;
|
|
padding: 1rem;
|
|
background-color: $background;
|
|
}
|
|
|
|
.daily {
|
|
font-family: 'Cartograph CF';
|
|
font-style: italic;
|
|
font-size: 1rem;
|
|
margin-bottom: 0.5rem;
|
|
padding-top: 1em;
|
|
}
|
|
|
|
.daily-date {
|
|
border-radius: 0.5em;
|
|
background-color: $background-dark;
|
|
color: $magenta;
|
|
padding: 1.5rem;
|
|
}
|
|
|
|
.daily-weather {
|
|
border-radius: 0.5em;
|
|
background-color: $background-dark;
|
|
color: $green;
|
|
margin-left: 0.5rem;
|
|
padding: 1.5rem;
|
|
}
|
|
|
|
.circle-volume-box {
|
|
background: $background;
|
|
padding: 1.5rem 2.3rem 1.5rem 2.3rem;
|
|
margin: .5rem;
|
|
border-radius: 2rem 0;
|
|
}
|
|
|
|
.volume-radial {
|
|
background-color: $background-dark
|
|
}
|
|
|
|
.volume-radial-label {
|
|
padding: 2.5rem;
|
|
}
|
|
|
|
.volume-radial {
|
|
color: $pink;
|
|
}
|
|
|
|
.fetchContent {
|
|
padding: 1rem 0 1rem 0;
|
|
font-family: 'Cartograph CF';
|
|
font-style: italic;
|
|
font-size: 1rem;
|
|
color: $lavender;
|
|
}
|
|
|
|
.logo {
|
|
font-family: 'JetBrainsMono Nerd Font';
|
|
font-size: 4.5rem;
|
|
color: $blue;
|
|
margin-left: -2rem;
|
|
}
|
|
|
|
.fetch {
|
|
background-color: $background-dark;
|
|
border-radius: .5em;
|
|
color: $teal
|
|
}
|
|
|
|
.fetchTitles {
|
|
color: $blue;
|
|
margin-left: -1.5rem;
|
|
}
|
|
|
|
.fetchDetails{
|
|
padding-left: .5rem;
|
|
color: $lavender;
|
|
}
|
|
|
|
.volume {
|
|
border-radius: 0.5em;
|
|
background-color: $background-dark;
|
|
margin-top: 0.1rem;
|
|
}
|
|
|
|
.volume-scale trough highlight {
|
|
all: unset;
|
|
background-color: $sky;
|
|
border-radius: 0.7em;
|
|
}
|
|
|
|
.volume-down, .volume-up {
|
|
font-family: "feather";
|
|
font-size: 2rem;
|
|
color: $teal;
|
|
padding: 0 1rem 0 1rem;
|
|
}
|
|
|
|
.brightness {
|
|
border-radius: 0.5em;
|
|
background-color: $black1;
|
|
margin-top: 1rem;
|
|
}
|
|
|
|
.brightness-scale trough highlight {
|
|
all: unset;
|
|
background-color: $sky;
|
|
border-radius: 0.7em;
|
|
}
|
|
|
|
.brightness-down, .brightness-up {
|
|
font-family: "feather";
|
|
font-size: 1.5rem;
|
|
padding: 0 1rem 0 1rem;
|
|
color: $lavender;
|
|
}
|
|
|
|
.volume-scale trough, .brightness-scale trough{
|
|
min-height: 1.5rem;
|
|
border-radius: 0.7em;
|
|
background-color: $black1;
|
|
}
|
|
|
|
.systemmenu {
|
|
background-color: $background-dark;
|
|
border-radius: 1em;
|
|
margin-top: 0.5em;
|
|
}
|
|
.system-menu-icon {
|
|
font-family: "feather";
|
|
margin-bottom: 0.5rem;
|
|
margin-top: 0.5rem;
|
|
border-radius: 1rem;
|
|
font-size: 2.5rem;
|
|
background-color: $background-dark;
|
|
}
|
|
|
|
.system-menu-icon:nth-child(1) {
|
|
color: $red;
|
|
padding: 15px;
|
|
}
|
|
.system-menu-icon:nth-child(2) {
|
|
margin-right: 0.1em;
|
|
margin-left: 0.1em;
|
|
color: $green;
|
|
padding: 15px;
|
|
}
|
|
.system-menu-icon:nth-child(3) {
|
|
color: $blue;
|
|
margin-right: 0.1em;
|
|
margin-left: 0.1em;
|
|
padding: 15px;
|
|
}
|
|
.system-menu-icon:nth-child(4) {
|
|
color: $yellow;
|
|
margin-right: 0.1em;
|
|
margin-left: 0.1em;
|
|
padding: 15px
|
|
}
|
|
.system-menu-icon:nth-child(5) {
|
|
color: lavender;
|
|
margin-right: 0.1rem;
|
|
margin-left: 0.1rem;
|
|
padding: 15px;
|
|
}
|
|
.system-menu-icon:hover{
|
|
background-color: $black0;
|
|
border-radius: 0.5em;
|
|
}
|