dotfiles/eww/eww.scss

/* --------------------------------------- Kanagawa Colors ------------------------------------*/

$background:     #1F1F28;
$foreground:    #dcd7ba;
$color0:     #16161d;
$color1:    #c34043;
$color4:  #7e9cd8;
$color5:    #957fb8;
$color8: #54546d;
$color11:   #e6c384;
/*
$background:     #2a170d;
$foreground:    #e5e2d3;
$color0: #2a170d;
$color1: #cd3727;
$color4:  #F1A054;
$color5: #398b9f;
$color8:     #826140;
$color11: #fed678;
*/

$sumi_ink2:     #2a2a37;
//$color8:     #363646;
$wave_blue1:    #2d4f67;
$autumn_green:  #66946a;
$winter_blue:     #252535;



* {
    all: unset;
    font-family: "Arimo Nerd Font";
    font-weight: 400;
    font-size: 16px;
}

/* --------------------------------------- Common Styles -------------------------------------- */

/* Style for module */
.module {
    background: $winter_blue; 
    border-radius: 10px; 
    margin-right: 8px;
    padding: 2px 15px;
}

.main_menu {
    background: $winter_blue;
    border-radius: 15px;
    border: 2px solid $foreground;
}

.menu_item {
    min-height: 50px;
    font-size: 30px;
    border-radius: 15px;
}

/* Remove the `margin-right` for the last module */
.last-widget {
    margin-right: 0;
}

.bar_section {
    background: rgba($background, 0.8);
    padding: 5px 10px;
    border-radius: 10px;
}

.main_menu_btn {
    background: transparent;
    border-radius: 10px;
    padding: 0px 5px;
    background-color: $winter_blue;
    border-color: transparent;
    box-shadow: 0px 0px;
}

.main_menu_label {
    background-color: transparent;
    color: $foreground;
    font-size: 25;
    text-shadow: 0px 0px;
}

.datetime {
    color: $color4;
    font-size: 20px;
    font-weight: 100;
}

.weather {
    color: $color4;
    padding: 0px 10px;
}

tooltip {
    background-color: $color0;
    font-size: 12;
    border-radius: 10px;
    color: $foreground;
}


.active_workspace {
    background: transparent;
    border-radius: 7px;
    margin-top: 3px;
    margin-bottom: 3px;
    color: $color4;
}

.inactive_workspace {
    background: transparent;
    margin-top: 3px;
    margin-bottom: 3px;
    border-radius: 7px;
    color: $color8;
}

.workspaces {
    padding: 0px 10px;
    border-radius: 10px;
}

.updates {
    color: $color11;
}

.cpu {
    color: $color4;
}

.ram {
    color: $autumn_green;
}

.datetime_module {
    border-radius: 10px;
    padding: 0px 15px;
}

.bardate {
    margin-right: 10px;
}

.system_module {
    background: $sumi_ink2;
    padding: 0px 10px 0px 15px;
    border-radius: 10px;
}

.volume {
    box-shadow: 0px 0px;
    color: $color4;
}

.volbar trough highlight {
    border-radius: 10px;
    background-color: $color4;
    border: transparent;
}

scale trough {
    border-radius: 10px;
    min-height: 10px;
    min-width: 100px;
    border: transparent;
}

.sysinfo {
    color: $color4;
}

.net_status {
    color: $color4;
}

.power {
    background-color: transparent;
    border-radius: 10px;
    text-shadow: 0px 0px;
    border-color: transparent;
    box-shadow: 0px 0px;
    font-size: 25px;
}

.shutdown {
    color: $color1;
}

.restart {
    color: $color5;
}

.logout {
    color: $color11;
}

.lock {
    color: $color4;
}

/* -------------------------------------- Desktop Widget -------------------------------------- */

.desktop {
    background-color: transparent;
}

.desktop_clock {
    padding: 40px 35px;
}

.greeting {
    font-size: 36px;
    font-style: italic;
    color: $color4;
}

.desktop_time {
    font-weight: 700;
    font-size: 64px;
}

.desktop_time_h, .desktop_time_m {
    color: $color1;
}

.desktop_time_colon {
    color: $foreground;
}

.desktop_time_p {
    color: $color1;
}

.desktop_date_date {
    margin-left: 10px;
}

.desktop_date {
    font-weight: 700;
    font-size: 32px;
    color: $foreground;
}

.desktop_mode_button {
    color: $color1;
    font-size: 96px;
}

.cava_column{
    background-color: rgba(220, 215, 186, 0.3);
    margin: 0 3px;
    margin-bottom: 8px;
    border-radius: 10 10 0 0;
}

.desktop_cava {
    min-height: 200px;   
}

.music_title {
    font-size: 18px;
    font-weight: 600;
    color: $color1;
}

.music_artist {
    color: $foreground;
}

.music_album {
    color: $foreground;
}

.album_art {
    border-radius: 10;
}

.music_module {
    background-color: $color0;
}