// When color definition differs for dark and light variant, // it gets @if ed depending on $variant $base_color: if($variant == 'light', #ffffff, lighten(desaturate(#241f31, 20%), 2%)); $bg_color: if($variant == 'light', #f6f5f4, desaturate(#3d3846, 10%)); $fg_color: if($variant == 'light', #2e3436, #eeeeec); $selected_fg_color: #ffffff; $selected_bg_color: if($variant == 'light', #3584e4, darken(#3584e4, 20%)); $selected_borders_color: if($variant== 'light', darken($selected_bg_color, 15%), darken($selected_bg_color, 30%)); $borders_color: if($variant == 'light', darken($bg_color, 18%), darken($bg_color, 10%)); $borders_edge: if($variant == 'light', transparentize(white, 0.2), transparentize($fg_color, 0.93)); $link_color: if($variant == 'light', darken($selected_bg_color, 10%), lighten($selected_bg_color, 20%)); $link_visited_color: if($variant == 'light', darken($selected_bg_color, 20%), lighten($selected_bg_color, 10%)); $top_hilight: $borders_edge; $warning_color: #f57900; $error_color: #ff8080; $success_color: if($variant == 'light', #33d17a, darken(#33d17a, 10%)); $destructive_color: if($variant == 'light', #e01b24, darken(#e01b24, 10%)); $osd_fg_color: #eeeeec; $osd_bg_color: #2e3436; $osd_borders_color: transparentize(black, 0.3); $osd_outer_borders_color: transparentize(white, 0.9); $tooltip_borders_color: $osd_outer_borders_color; //insensitive state derived colors $insensitive_fg_color: mix($fg_color, $bg_color, 50%); $insensitive_bg_color: mix($bg_color, $base_color, 60%); $insensitive_borders_color: $borders_color; //colors for the backdrop state, derived from the main colors. $backdrop_base_color: if($variant =='light', darken($base_color,1%), lighten($base_color,1%)); $backdrop_bg_color: $bg_color; $backdrop_fg_color: mix($fg_color, $backdrop_bg_color, 80%); $backdrop_insensitive_color: if($variant =='light', darken($backdrop_bg_color,15%), lighten($backdrop_bg_color,15%)); $backdrop_borders_color: mix($borders_color, $bg_color, 90%); $backdrop_dark_fill: mix($backdrop_borders_color,$backdrop_bg_color, 35%);