configuring hyprland more
This commit is contained in:
Chris Cochrun
parent
6942535fb7
commit
6cdfe3e563
11 changed files with 982 additions and 527 deletions
581
eww/eww.scss
581
eww/eww.scss
|
|
@ -1,27 +1,52 @@
|
|||
/** EWW.SCSS
|
||||
/**
|
||||
Created by saimoom **/
|
||||
*{
|
||||
all: unset;
|
||||
font-family: feather;
|
||||
font-family: DaddyTimeMono NF;
|
||||
font-family: mononoki Nerd Font;
|
||||
}
|
||||
|
||||
$background: rgba(00, 00, 00, 0.7);
|
||||
$widget-background: rgba(30, 30, 30, 0.4);
|
||||
$shadow: #0B0B0B;
|
||||
$grey: #606060;
|
||||
|
||||
$black: #282A36;
|
||||
$red: #F37F97;
|
||||
$green: #5ADECD;
|
||||
$orange: #F2A272;
|
||||
$blue: #8897F4;
|
||||
$purple: #C574DD;
|
||||
$teal: #79E6F3;
|
||||
$white: #FDFDFD;
|
||||
|
||||
/** General **/
|
||||
.bar_class {
|
||||
background-color: #0f0f17;
|
||||
border-radius: 16px;
|
||||
background-color: $background;
|
||||
border-radius: 20px 20px 20px 20px;
|
||||
}
|
||||
.module {
|
||||
margin: 0px 0px 0px 0px;
|
||||
border-radius: 10px 16px 0px 10px;
|
||||
border-radius: 10px 10px 0px 10px;
|
||||
}
|
||||
|
||||
.side{
|
||||
background-color: $background;
|
||||
border-width: 0px;
|
||||
padding: 0px 30px 0px 30px;
|
||||
}
|
||||
|
||||
.center_modules {
|
||||
margin: 0px 0px 0px 0px;
|
||||
border-radius: 0px 0px 0px 0px;
|
||||
}
|
||||
|
||||
/** tooltip!! **/
|
||||
tooltip.background {
|
||||
background-color: #0f0f17;
|
||||
background-color: $background;
|
||||
font-size: 18;
|
||||
border-radius: 10px;
|
||||
color: #bfc9db;
|
||||
color: $white;
|
||||
}
|
||||
|
||||
tooltip label {
|
||||
|
|
@ -31,233 +56,195 @@ tooltip label {
|
|||
|
||||
/** Widgets **/
|
||||
|
||||
.clock_time_sep {
|
||||
font-size: 16;
|
||||
color: #bfc9db;
|
||||
margin: 0px 4px 1px 4px;
|
||||
}
|
||||
.clock_time_class, .clock_minute_class {
|
||||
font-size: 23;
|
||||
font-size: 28;
|
||||
}
|
||||
.clock_date_class {
|
||||
font-size: 18;
|
||||
font-size: 24;
|
||||
margin: 0px 20px 0px -1px;
|
||||
color: #d7beda;
|
||||
color: $red;
|
||||
}
|
||||
.clock_minute_class {
|
||||
margin: 0px 20px 0px 3px;
|
||||
color: #bfc9db;
|
||||
}
|
||||
|
||||
.clock_time_class {
|
||||
color: #bfc9db;
|
||||
color: $white;
|
||||
font-weight: bold;
|
||||
margin: 0px 5px 0px 0px;
|
||||
margin: 0px 20px 0px 5px;
|
||||
}
|
||||
|
||||
.notif_button {
|
||||
font-size: 28;
|
||||
margin: 0px 20px 0px 0px;
|
||||
color: $white;
|
||||
}
|
||||
|
||||
.membar {
|
||||
color: #e0b089;
|
||||
background-color: #38384d;
|
||||
border-radius: 10px;
|
||||
color: $orange;
|
||||
background-color: $widget-background;
|
||||
border-radius: 10px;
|
||||
}
|
||||
.batbar {
|
||||
color: #afbea2;
|
||||
background-color: #38384d;
|
||||
border-radius: 10px;
|
||||
color: $purple;
|
||||
background-color: $widget-background;
|
||||
border-radius: 10px;
|
||||
}
|
||||
.brightbar trough highlight {
|
||||
background-image: linear-gradient(to right, #e4c9af 30%, #f2cdcd 50%, #e0b089 100% *50);
|
||||
border-radius: 10px;
|
||||
background-image: linear-gradient(to right, $orange 30%, #f2cdcd 50%, $orange 100% *50);
|
||||
border-radius: 10px;
|
||||
}
|
||||
.volbar trough highlight {
|
||||
background-image: linear-gradient(to right, #afcee0 30%, #a1bdce 50%, #77a5bf 100% *50);
|
||||
border-radius: 10px;
|
||||
background-image: linear-gradient(to right, #afcee0 30%, #92B6F4 50%, #77a5bf 100% *50);
|
||||
border-radius: 10px;
|
||||
}
|
||||
.volume_icon {
|
||||
font-size: 22;
|
||||
color: #a1bdce;
|
||||
color: $blue;
|
||||
margin: 0px 10px 0px 10px;
|
||||
}
|
||||
|
||||
|
||||
.module_essid {
|
||||
font-size: 18;
|
||||
color: #a1bdce;
|
||||
color: $blue;
|
||||
margin: 0px 10px 0px 0px;
|
||||
}
|
||||
.module-wif {
|
||||
font-size: 22;
|
||||
color: #a1bdce;
|
||||
border-radius: 100%;
|
||||
color: $blue;
|
||||
margin: 0px 10px 0px 5px;
|
||||
}
|
||||
|
||||
.iconlauncher {
|
||||
color: $white;
|
||||
font-size: 36px;
|
||||
margin: 0px 10px 0px 15px;
|
||||
}
|
||||
.iconsearch {
|
||||
color: $white;
|
||||
font-size: 24px;
|
||||
}
|
||||
.iconmem {
|
||||
color: #e0b089;
|
||||
color: $orange;
|
||||
}
|
||||
.iconbat {
|
||||
color: #afbea2;
|
||||
color: $purple;
|
||||
}
|
||||
.iconbat, .iconmem {
|
||||
font-size: 15;
|
||||
margin: 10px;
|
||||
margin: 15px;
|
||||
}
|
||||
.bright_icon {
|
||||
font-size: 22;
|
||||
color: #e4c9af;
|
||||
color: $orange;
|
||||
margin: 0px 10px 0px 10px;
|
||||
}
|
||||
|
||||
|
||||
.separ {
|
||||
color: #3e424f;
|
||||
color: $grey;
|
||||
font-weight: bold;
|
||||
font-size: 22px;
|
||||
margin: 0px 8px 0px 8px;
|
||||
}
|
||||
|
||||
.launcher_module {
|
||||
background-color: rgba(00, 00, 00, 0.0);
|
||||
}
|
||||
|
||||
.mem_module {
|
||||
background-color: #0f0f17;
|
||||
background-color: rgba(00, 00, 00, 0.0);
|
||||
border-radius: 16px;
|
||||
margin: 0px 10px 0px 3px;
|
||||
}
|
||||
.bat_module {
|
||||
background-color: #0f0f17;
|
||||
background-color: rgba(00, 00, 00, 0.0);
|
||||
border-radius: 16px;
|
||||
margin: 0px 10px 0px 10px;
|
||||
}
|
||||
|
||||
|
||||
scale trough {
|
||||
all: unset;
|
||||
background-color: #22242b;
|
||||
box-shadow: 0 2px 3px 2px #06060b;
|
||||
border-radius: 16px;
|
||||
min-height: 10px;
|
||||
min-width: 70px;
|
||||
margin: 0px 10px 0px 0px;
|
||||
}
|
||||
|
||||
.works {
|
||||
font-size: 27px;
|
||||
font-weight: normal;
|
||||
margin: 5px 0px 0px 20px;
|
||||
background-color: #0f0f17;
|
||||
font-size: 28px;
|
||||
font-weight: normal;
|
||||
margin: 10px 0px 0px 10px;
|
||||
background-color: rgba(00, 00, 00, 0.0);
|
||||
}
|
||||
|
||||
.0 , .01, .02, .03, .04, .05, .06,
|
||||
.011, .022, .033, .044, .055, .066{
|
||||
margin: 0px 10px 0px 0px;
|
||||
.011, .022, .033, .044, .055, .066 {
|
||||
margin: 0px 7px 0px 0px;
|
||||
}
|
||||
|
||||
/* Unoccupied */
|
||||
.0 {
|
||||
color: #3e424f;
|
||||
color: $grey;
|
||||
}
|
||||
|
||||
/* Occupied */
|
||||
.01, .02, .03, .04, .05, .06 {
|
||||
color: #bfc9db;
|
||||
.01, .02, .03, .04, .05, .06, .07, .08, .09 {
|
||||
color: $white;
|
||||
}
|
||||
|
||||
/* Focused */
|
||||
.011, .022, .033, .044, .055, .066 {
|
||||
color: #a1bdce;
|
||||
.011, .022, .033, .044, .055, .066, .077, .088, .099{
|
||||
color: $purple;
|
||||
}
|
||||
|
||||
|
||||
.song_cover_art {
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
min-height: 24px;
|
||||
min-width: 24px;
|
||||
margin: 10px;
|
||||
border-radius: 100px;
|
||||
}
|
||||
|
||||
.song {
|
||||
color: #a1bdce;
|
||||
font-size : 18px;
|
||||
font-weight : bold;
|
||||
margin : 3px 5px 0px 0px;
|
||||
}
|
||||
|
||||
.song_btn_play {
|
||||
color: #a1bdce;
|
||||
font-size : 28px;
|
||||
margin : 3px 0px 0px 5px;
|
||||
|
||||
}
|
||||
|
||||
|
||||
.song_btn_prev, .song_btn_next {
|
||||
color: #bfc9db;
|
||||
font-size : 24px;
|
||||
margin : 3px 0px 0px 5px;
|
||||
|
||||
}
|
||||
// Calendar
|
||||
.cal {
|
||||
background-color: #0f0f17;
|
||||
font-family: JetBrainsMono Nerd Font;
|
||||
font-size: 18px;
|
||||
font-weight: normal;
|
||||
background-color: $background;
|
||||
font-family: mononoki Nerd Font;
|
||||
font-size: 18px;
|
||||
font-weight: normal;
|
||||
border-radius: 25px;
|
||||
|
||||
.cal-in {
|
||||
padding: 0px 10px 0px 10px;
|
||||
color: #bfc9db;
|
||||
padding: 10px 10px 10px 10px;
|
||||
color: $white;
|
||||
|
||||
.cal {
|
||||
&.highlight {
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
padding: 5px 5px 5px 5px;
|
||||
padding: 10px 10px 10px 10px;
|
||||
margin-left: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
calender {
|
||||
color: #bfc9db;
|
||||
color: $blue;
|
||||
}
|
||||
calendar:selected {
|
||||
color: #a1bdce;
|
||||
color: $blue;
|
||||
}
|
||||
|
||||
calendar.header {
|
||||
color: #a1bdce;
|
||||
color: $blue;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
calendar.button {
|
||||
color: #afbea2;
|
||||
color: $green;
|
||||
}
|
||||
|
||||
calendar.highlight {
|
||||
color: #a1bdce;
|
||||
color: $blue;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
calendar:indeterminate {
|
||||
color: #bfc9db;
|
||||
color: $black;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
.sys_sep {
|
||||
color: #38384d;
|
||||
color: $widget-background;
|
||||
font-size: 18;
|
||||
margin: 0px 10px 0px 10px;
|
||||
}
|
||||
.sys_text_bat_sub, .sys_text_mem_sub {
|
||||
font-size: 16;
|
||||
color: #bbc5d7;
|
||||
color: $white;
|
||||
margin: 5px 0px 0px 25px;
|
||||
}
|
||||
.sys_text_bat, .sys_text_mem {
|
||||
|
|
@ -270,23 +257,24 @@ color: #bfc9db;
|
|||
margin: 30px;
|
||||
}
|
||||
.sys_win {
|
||||
background-color: #0f0f17;
|
||||
background-color: $background;
|
||||
border-radius: 25px;
|
||||
}
|
||||
.sys_bat {
|
||||
color: #afbea2;
|
||||
background-color: #38384d;
|
||||
border-radius: 10px;
|
||||
color: $green;
|
||||
background-color: $widget-background;
|
||||
border-radius: 10px;
|
||||
}
|
||||
.sys_mem {
|
||||
color: #e4c9af;
|
||||
background-color: #38384d;
|
||||
border-radius: 10px;
|
||||
color: $orange;
|
||||
background-color: $widget-background;
|
||||
border-radius: 10px;
|
||||
}
|
||||
.sys_icon_bat, .sys_text_bat {
|
||||
color: #afbea2;
|
||||
color: $green;
|
||||
}
|
||||
.sys_icon_mem, .sys_text_mem {
|
||||
color: #e4c9af;
|
||||
color: $orange;
|
||||
}
|
||||
.sys_bat_box {
|
||||
border-radius: 16px;
|
||||
|
|
@ -298,78 +286,30 @@ color: #bfc9db;
|
|||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
.music_pop {
|
||||
background-color: #0f0f17;
|
||||
border-radius: 16px;
|
||||
}
|
||||
.music_cover_art {
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
min-height: 100px;
|
||||
box-shadow: 5px 5px 5px 5px #06060b;
|
||||
min-width: 170px;
|
||||
margin: 20px;
|
||||
border-radius: 20px;
|
||||
}
|
||||
|
||||
.music {
|
||||
color: #a1bdce;
|
||||
.app-name {
|
||||
color: $blue;
|
||||
font-size : 20px;
|
||||
font-weight : bold;
|
||||
margin : 20px 0px 0px -15px;
|
||||
margin : 10px 0px 0px 0px;
|
||||
}
|
||||
|
||||
.music_artist {
|
||||
color: #bbc5d7;
|
||||
font-size : 16px;
|
||||
font-weight : normal;
|
||||
margin : 0px 0px 0px 0px;
|
||||
.app-icon {
|
||||
margin : 8px 10px 0px 0px;
|
||||
}
|
||||
|
||||
.music_btn_prev, .music_btn_play, .music_btn_next {
|
||||
font-family: Iosevka Nerd Font;
|
||||
}
|
||||
.music_btn_prev {
|
||||
color: #bbc5d7;
|
||||
font-size : 32px;
|
||||
font-weight : normal;
|
||||
margin: 0px 0px 0px 0px;
|
||||
}
|
||||
.music_btn_play {
|
||||
color: #a1bdce;
|
||||
font-size : 48px;
|
||||
font-weight : normal;
|
||||
margin: 0px 0px 0px 0px;
|
||||
}
|
||||
.music_btn_next {
|
||||
color: #bbc5d7;
|
||||
font-size : 32px;
|
||||
font-weight : normal;
|
||||
margin: 0px 0px 0px 0px;
|
||||
.app-button {
|
||||
color: $blue;
|
||||
font-size : 30px;
|
||||
font-weight : bold;
|
||||
margin : 0px 15px 0px 15px;
|
||||
}
|
||||
|
||||
.music_bar scale trough highlight {
|
||||
all: unset;
|
||||
background-image: linear-gradient(to right, #afcee0 30%, #a1bdce 50%, #77a5bf 100% *50);
|
||||
border-radius: 24px;
|
||||
}
|
||||
.music_bar scale trough {
|
||||
all: unset;
|
||||
background-color: #232232;
|
||||
box-shadow: 0 6px 5px 2px #06060b;
|
||||
border-radius: 24px;
|
||||
min-height: 13px;
|
||||
min-width: 190px;
|
||||
margin : -10px 10px 20px 0px;
|
||||
.launcher-icon {
|
||||
margin : 5px -5px 10px 15px;
|
||||
}
|
||||
|
||||
.audio-box {
|
||||
background-color: #0f0f17;
|
||||
background-color: $background;
|
||||
border-radius: 16px;
|
||||
}
|
||||
.speaker_icon {
|
||||
|
|
@ -383,7 +323,7 @@ color: #bfc9db;
|
|||
}
|
||||
|
||||
.speaker_text {
|
||||
color: #a1bdce;
|
||||
color: $blue;
|
||||
font-size : 26px;
|
||||
font-weight : bold;
|
||||
margin: 20px 0px 0px 0px;
|
||||
|
|
@ -391,13 +331,13 @@ color: #bfc9db;
|
|||
|
||||
.speaker_bar scale trough highlight {
|
||||
all: unset;
|
||||
background-image: linear-gradient(to right, #afcee0 30%, #a1bdce 50%, #77a5bf 100% *50);
|
||||
background-image: linear-gradient(to right, #afcee0 30%, #92B6F4 50%, #77a5bf 100% *50);
|
||||
border-radius: 24px;
|
||||
}
|
||||
.speaker_bar scale trough {
|
||||
all: unset;
|
||||
background-color: #232232;
|
||||
box-shadow: 0 6px 5px 2px #06060b;
|
||||
background-color: $widget-background;
|
||||
box-shadow: 0 6px 5px 2px $shadow;
|
||||
border-radius: 24px;
|
||||
min-height: 13px;
|
||||
min-width: 120px;
|
||||
|
|
@ -418,7 +358,7 @@ color: #bfc9db;
|
|||
}
|
||||
|
||||
.mic_text {
|
||||
color: #a1bdce;
|
||||
color: $blue;
|
||||
font-size : 26px;
|
||||
font-weight : bold;
|
||||
margin: 0px 0px 0px 0px;
|
||||
|
|
@ -426,13 +366,13 @@ color: #bfc9db;
|
|||
|
||||
.mic_bar scale trough highlight {
|
||||
all: unset;
|
||||
background-image: linear-gradient(to right, #afcee0 30%, #a1bdce 50%, #77a5bf 100% *50);
|
||||
background-image: linear-gradient(to right, #afcee0 30%, #92B6F4 50%, #77a5bf 100% *50);
|
||||
border-radius: 24px;
|
||||
}
|
||||
.mic_bar scale trough {
|
||||
all: unset;
|
||||
box-shadow: 0 6px 5px 2px #06060b;
|
||||
background-color: #232232;
|
||||
box-shadow: 0 6px 5px 2px $shadow;
|
||||
background-color: $widget-background;
|
||||
border-radius: 24px;
|
||||
min-height: 13px;
|
||||
min-width: 120px;
|
||||
|
|
@ -440,7 +380,260 @@ color: #bfc9db;
|
|||
}
|
||||
|
||||
.audio_sep {
|
||||
color: #38384d;
|
||||
color: $black;
|
||||
font-size: 18;
|
||||
margin : 0px 0px 0px 0px;
|
||||
}
|
||||
|
||||
// Music
|
||||
.music-player {
|
||||
all: unset;
|
||||
background-color: $widget-background;
|
||||
padding: 0px 25px 0px 17px;
|
||||
border-radius: 12px;
|
||||
box-shadow: 0px 0px 6px 6px $shadow;}
|
||||
|
||||
.album_art {
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
border-radius: 12px;
|
||||
margin: 2rem 1rem 1.5rem 1rem;
|
||||
padding: 4rem;}
|
||||
|
||||
.song {
|
||||
font-family: JetBrainsMono Nerd Font Mono;
|
||||
font-weight: bold;
|
||||
color: $white;
|
||||
font-size : 1.2em;
|
||||
}
|
||||
.artist {
|
||||
font-family: JetBrainsMono Nerd Font;
|
||||
font-style: italic;
|
||||
font-size: 1.1em;
|
||||
color: $blue;
|
||||
margin-top: -5px;
|
||||
}
|
||||
.btn_prev, .btn_play, .btn_next {
|
||||
font-family: JetBrainsMono Nerd Font Mono;
|
||||
color: $purple;
|
||||
font-size: 25px;
|
||||
}
|
||||
|
||||
.metric-player scale trough highlight {
|
||||
all: unset;
|
||||
border-radius: 10px;
|
||||
background-color: $blue;
|
||||
}
|
||||
|
||||
// weather
|
||||
.weather {
|
||||
all: unset;
|
||||
background-color: $widget-background;
|
||||
border-radius: 12px;
|
||||
padding: 23px 37px 20px 37px;
|
||||
box-shadow: 0px 0px 6px 6px rgb(0, 0, 0, .4);}
|
||||
|
||||
.iconweather {
|
||||
font-family: JetBrainsMono Nerd Font;
|
||||
font-size : 44px;
|
||||
font-weight : normal;
|
||||
margin : 0px -5px 0px 20px;
|
||||
}
|
||||
|
||||
.label_temp {
|
||||
color : $blue;
|
||||
font-size : 35px;
|
||||
font-weight : bold;
|
||||
margin : 0px 0px 0px 0px;
|
||||
font-family: Furamono Nerd Font;
|
||||
|
||||
}
|
||||
|
||||
.label_stat {
|
||||
color : $blue;
|
||||
font-size : 38px;
|
||||
font-weight : bold;
|
||||
}
|
||||
|
||||
.label_quote {
|
||||
color : $blue;
|
||||
font-size : 18px;
|
||||
padding-bottom: 10px;
|
||||
font-weight : normal;
|
||||
}
|
||||
|
||||
.date {
|
||||
all: unset;
|
||||
background-color: $widget-background;
|
||||
padding: 33px 27px 27px 27px;
|
||||
border-radius: 12px;
|
||||
color: $blue;
|
||||
font-size : 18px;
|
||||
font-style : italic;
|
||||
font-family: Cartograph CF;
|
||||
box-shadow: 0px 0px 6px 6px rgb(0, 0, 0, .4);}
|
||||
|
||||
.stats-box {
|
||||
all: unset;
|
||||
background-color: $widget-background;
|
||||
padding: 20px 25px 20px 25px;
|
||||
border-radius: 12px;
|
||||
box-shadow: 0px 0px 6px 6px rgb(0, 0, 0, .4);}
|
||||
|
||||
.stats-icon {
|
||||
font-size: 23px;
|
||||
color: $blue;
|
||||
font-family: JetBrainsMono Nerd Font Mono;
|
||||
}
|
||||
|
||||
|
||||
scale trough {
|
||||
all: unset;
|
||||
background-color: $widget-background;
|
||||
box-shadow: 0 2px 3px 2px $shadow;
|
||||
border-radius: 16px;
|
||||
min-height: 10px;
|
||||
min-width: 70px;
|
||||
margin: 0px 5px 0px 10px;
|
||||
}
|
||||
|
||||
.scale highlight {
|
||||
background-image: linear-gradient(to right, #afcee0 30%, #92B6F4 50%, #77a5bf 100% *50);
|
||||
border-radius: 15px;
|
||||
}
|
||||
|
||||
.foo {
|
||||
font-size: 40px;
|
||||
padding-top: 10px;
|
||||
}
|
||||
|
||||
.buttons {
|
||||
opacity: 1;
|
||||
background-color: $widget-background;
|
||||
border-radius: 12px;
|
||||
padding: 15px 0px 15px 0px;
|
||||
font-family: JetBrainsMono Nerd Font Mono;
|
||||
margin-bottom: 30px;
|
||||
box-shadow: 0px 0px 6px 6px rgb(0, 0, 0, .4);}
|
||||
|
||||
.poweroff, .reboot, .firmware, .exit, .restart {
|
||||
margin: 0px 16px 0px 16px;
|
||||
padding: 2px 15px 2px 9px;
|
||||
font-family: mononoki Nerd Font;
|
||||
border-radius: 25px;
|
||||
font-size: 24px;
|
||||
color: $black;
|
||||
}
|
||||
|
||||
.poweroff {
|
||||
background-color: $red;
|
||||
}
|
||||
.reboot {
|
||||
background-color: $green;
|
||||
}
|
||||
.firmware {
|
||||
background-color: $orange;
|
||||
}
|
||||
.exit {
|
||||
background-color: $purple;
|
||||
}
|
||||
.restart {
|
||||
background-color: $blue;
|
||||
}
|
||||
|
||||
.fetch {
|
||||
margin-top: 35px;
|
||||
font-size: 15px;
|
||||
border-radius: 12px;
|
||||
background-color: $widget-background;
|
||||
padding: 30px 55px 30px 55px;
|
||||
box-shadow: 0px 0px 6px 6px rgb(0, 0, 0, .4);}
|
||||
|
||||
.wm {
|
||||
font-family: "JetBrainsMono Nerd Font";
|
||||
font-weight: bold;
|
||||
color: $red;
|
||||
}
|
||||
|
||||
.host {
|
||||
font-family: "JetBrainsMono Nerd Font";
|
||||
font-weight: bold;
|
||||
color: $purple;
|
||||
}
|
||||
|
||||
.uptime {
|
||||
font-family: "JetBrainsMono Nerd Font";
|
||||
font-weight: bold;
|
||||
color: $orange;
|
||||
}
|
||||
|
||||
.packages {
|
||||
font-family: "JetBrainsMono Nerd Font";
|
||||
font-weight: bold;
|
||||
color: $blue;
|
||||
}
|
||||
|
||||
.kernal {
|
||||
font-family: "JetBrainsMono Nerd Font";
|
||||
font-weight: bold;
|
||||
color: $green;
|
||||
}
|
||||
|
||||
.notification {
|
||||
all: unset;
|
||||
background-color: $widget-background;
|
||||
padding: 20px 25px 20px 17px;
|
||||
margin: 0px 15px 0px 15px;
|
||||
border-radius: 12px;
|
||||
border-width: 2px;
|
||||
border-style: solid;
|
||||
border-color: $red;}
|
||||
|
||||
.notification-header {
|
||||
all: unset;
|
||||
background-color: $widget-background;
|
||||
padding: 20px 25px 20px 17px;
|
||||
margin: 20px 15px 10px 15px;
|
||||
border-radius: 12px;
|
||||
border-width: 2px;
|
||||
border-style: solid;
|
||||
border-color: $green;}
|
||||
|
||||
.notification-icon {
|
||||
color: $white;
|
||||
font-size: 36px;
|
||||
margin: 0px 20px 0px 10px;
|
||||
}
|
||||
|
||||
.notification-appname {
|
||||
font-family: "Inter Nerd Font";
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
color: $orange;
|
||||
}
|
||||
|
||||
.notification-summary {
|
||||
font-family: "Inter Nerd Font";
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
color: $white;
|
||||
}
|
||||
|
||||
.notification-body {
|
||||
font-family: "Inter Nerd Font";
|
||||
font-size: 14px;
|
||||
color: $white;
|
||||
}
|
||||
|
||||
.notification-label {
|
||||
font-family: "Mononoki Nerd Font";
|
||||
font-size: 30px;
|
||||
color: $blue;
|
||||
margin: 0px 50px 0px 0px;
|
||||
}
|
||||
.notification-action {
|
||||
font-family: "Mononoki Nerd Font";
|
||||
font-size: 36px;
|
||||
color: $white;
|
||||
margin: 0px 0px 0px 20px;
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue