/** EWW.SCSS Created by saimoom **/ *{ all: unset; font-family: "Iosevka Nerd Font", feather; // font-family: DaddyTimeMono NF; } // Variable Color's $background: #1A1B26; $foreground: #A9B1D6; $black: #24283B; $gray: #565F89; $red: #F7768E; $green: #73DACA; $yellow: #E0AF68; $blue: #7AA2F7; $magenta: #BB9AF7; $cyan: #7DCFFF; $white: $foreground; /** General **/ .bar_class { background-color: #0f0f17; border-radius: 16px; } .module { margin: 0px 0px 0px 0px; border-radius: 10px 16px 0px 10px; } /** tooltip!! **/ tooltip.background { background-color: #0f0f17; font-size: 18; border-radius: 10px; color: #bfc9db; } tooltip label { margin: 6px; } /** Widgets **/ .clock_time_sep { font-size: 27; color: #bfc9db; margin: 0px 4px 1px 4px; } .clock_time_class, .clock_minute_class { font-size: 23; } .clock_date_class { font-size: 18; margin: 0px 20px 0px -1px; color: #d7beda; } .clock_minute_class { margin: 0px 20px 0px 3px; color: #bfc9db; } .clock_time_class { color: #bfc9db; font-weight: bold; margin: 0px 5px 0px 0px; } .diskbar { color: #AD5C6C; background-color: #38384d; border-radius: 10px; } .cpubar { color: #297379; background-color: #38384d; border-radius: 10px; } .membar { color: #e0b089; background-color: #38384d; border-radius: 10px; } .bat{ // font-family: JetBrainsMono Nerd Font; font-family: Iosevka Nerd Font; font-size: 1.2em; padding-right: .5rem; color: $blue; } .brightbar trough highlight { background-image: linear-gradient(to right, #e4c9af 30%, #f2cdcd 50%, #e0b089 100% *50); border-radius: 10px; } .volbar trough highlight { background-image: linear-gradient(to right, #afcee0 30%, #a1bdce 50%, #77a5bf 100% *50); border-radius: 10px; } .volume_icon { font-size: 22; color: #a1bdce; margin: 0px 10px 0px 10px; } .module_essid { font-size: 18; color: #a1bdce; margin: 0px 10px 0px 0px; } .module_vpn { font-size: 18; color: #77DD77; margin: 0px 10px 0px 0px; } .module-wif { font-size: 22; color: #a1bdce; border-radius: 100%; margin: 0px 10px 0px 5px; } .iconcpu { color: #297379; } .icondisk { color: #AD5C6C; } .iconmem { color: #e0b089; } .iconbat { color: #afbea2; } .iconbat, .iconmem, .iconcpu, .icondisk { font-size: 15; margin: 10px; } .bright_icon { font-size: 22; color: #e4c9af; margin: 0px 10px 0px 10px; } .separ { color: #3e424f; font-weight: bold; font-size: 22px; margin: 0px 8px 0px 8px; } .mem_module, .cpu_module, .disk_module{ background-color: #0f0f17; border-radius: 16px; margin: 0px 10px 0px 3px; } 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-size: 45px; font-weight: normal; font-family: Iosevka Nerd Font; margin: 5px 0px 0px 20px; background-color: #0f0f17; } .0 , .01, .02, .03, .04, .05, .06, .07, .08, .09, .00, .011, .022, .033, .044, .055, .066, .077, .088, .099, .000 { margin: 0px 10px 0px 0px; } /* Unoccupied */ .0 { color:#131d2c; } /* Occupied */ .01, .02, .03, .04, .05, .06, .07, .08, .09, .00 { color: #5c6c82; } /* Focused */ .011, .022, .033, .044, .055, .066, .077, .088, .099, .000 { color: #e4e6ea } .033.thunderbird { color: #1E5EBB; } .066.twitter { color: #1C9CEA; } .firefox.077 { color: #DF5D00; } .twitch.088 { color: #613F9F; } .discord.099 { color:#5661EF; } .telegram.000 { color: #0084C6; } .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; .cal-in { padding: 0px 10px 0px 10px; color: #bfc9db; .cal { &.highlight { padding: 20px; } padding: 5px 5px 5px 5px; margin-left: 10px; } } } calendar:selected { color: $blue; font-size: 24px; background: $background; } calendar.header { color: $blue; font-weight: bold; } calendar.button { color: $magenta; } calendar.highlight { color: $magenta; font-weight: bold; } calendar:indeterminate { color: $background; } .sys_sep { color: #38384d; font-size: 18; margin: 0px 10px 0px 10px; } .sys_text_bat_sub, .sys_text_mem_sub { font-size: 16; color: #bbc5d7; margin: 5px 0px 0px 25px; } .sys_text_bat, .sys_text_mem { font-size: 21; font-weight: bold; margin: 14px 0px 0px 25px; } .sys_icon_bat, .sys_icon_mem { font-size: 30; margin: 30px; } .sys_win { background-color: #0f0f17; } .sys_bat { color: #afbea2; background-color: #38384d; border-radius: 10px; } .sys_mem { color: #e4c9af; background-color: #38384d; border-radius: 10px; } .sys_icon_bat, .sys_text_bat { color: #afbea2; } .sys_icon_mem, .sys_text_mem { color: #e4c9af; } .sys_bat_box { border-radius: 16px; margin: 15px 10px 10px 20px; } .sys_mem_box { border-radius: 16px; margin: 10px 10px 15px 20px; } .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; font-size : 20px; font-weight : bold; margin : 20px 0px 0px -15px; } .music_artist { color: #bbc5d7; font-size : 16px; font-weight : normal; margin : 0px 0px 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; } .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; } .audio-box { background-color: #0f0f17; border-radius: 16px; } .speaker_icon { background-size: cover; background-image: url('images/speaker.png'); background-position: center; min-height: 70px; min-width: 75px; margin: 10px 20px 5px 20px; border-radius: 12px; } .speaker_text { color: #a1bdce; font-size : 26px; font-weight : bold; margin: 20px 0px 0px 0px; } .speaker_bar scale trough highlight { all: unset; background-image: linear-gradient(to right, #afcee0 30%, #a1bdce 50%, #77a5bf 100% *50); border-radius: 24px; } .speaker_bar scale trough { all: unset; background-color: #232232; box-shadow: 0 6px 5px 2px #06060b; border-radius: 24px; min-height: 13px; min-width: 120px; margin : 0px 0px 5px 0px; } .mic_icon { background-size: cover; background-image: url('images/mic.png'); background-position: center; min-height: 70px; min-width: 75px; margin: 5px 20px 20px 20px; border-radius: 12px; } .mic_text { color: #a1bdce; font-size : 26px; font-weight : bold; margin: 0px 0px 0px 0px; } .mic_bar scale trough highlight { all: unset; background-image: linear-gradient(to right, #afcee0 30%, #a1bdce 50%, #77a5bf 100% *50); border-radius: 24px; } .mic_bar scale trough { all: unset; box-shadow: 0 6px 5px 2px #06060b; background-color: #232232; border-radius: 24px; min-height: 13px; min-width: 120px; margin : 0px 0px 20px 0px; } .audio_sep { color: #38384d; font-size: 18; margin : 0px 0px 0px 0px; } // Powermenu .powermenu { font-family: feather; font-size: 1.3em; font-weight: bold; } .button-qtres, .button-reb, .button-lock, .button-quit, .button-off{ padding: .5rem .2rem .5rem .2rem; // transition: all .2s ease-in-out; } .button-off{ color: $red; } .button-qtres:hover, .button-reb:hover, .button-lock:hover, .button-quit:hover, .button-off:hover{ font-size: 1.2em; box-shadow: inset 0 0 0 10em $background; } .button-bspres{ color: $green; } .button-reb{ color: $yellow } .button-quit{ color: $magenta; } .button-lock{ color: $blue; }