mirror of
https://github.com/sahinakkaya/dotfiles.git
synced 2024-12-23 15:49:40 +01:00
531 lines
8.6 KiB
SCSS
531 lines
8.6 KiB
SCSS
/** 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;
|
|
}
|