// When color definition differs for dark and light variant // it gets @if ed depending on $variant // Main definitions $base_color: if($variant == 'light', #ebf0f5, lighten(#161925, 1%)); $text_color: if($variant == 'light', #31363D, #C3C7D1); $bg_color: if($variant == 'light', darken( #EEEEEE, 3%), #161925); $fg_color: if($variant == 'light', #31363d, #C3C7D1); $switch_bg: if($variant == 'light', #ffffff, transparentize(black,1)); $shadow_color: rgba(162, 162, 165, 0.21); $main_dark_color: #202127; // Primary colors $lime: #71f79f; $red: #ed254e; $orange: #ff9200; $yellow: #fadd00; $purple: #d400dc; $darkpurple: #7b7bbd; $blue: #2F80ED; $cyan: #00c1e4; $slider: #7b7bbd; $teal: #00e8c6; $selected_fg_color: #fefefe; $selected_bg_color: #f7b922; /*$selected_bg_color: #00e8c6;06d6a0*/ $selected_borders_color: darken($selected_bg_color, 10%); $borders_color: if($variant == 'light', transparentize(black,0.87), transparentize(#eee,0.9)); $borders_edge: if($variant == 'light', transparentize(white, 0.8), transparentize(white, 0.9)); $link_color: $blue; $link_visited_color:transparentize($link_color,0.5); $top_highlight: if($variant == 'light', transparentize(white, 0.8), transparentize(white, 0.9)); $bottom_highlight: if($variant == 'light', transparentize(black, 0.8), transparentize(black, 0.9)); $dark_fill: mix($borders_color, $bg_color, 35%); $headerbar_color: $bg_color; $headerbar_fg_color: lighten( $text_color, 40%); $menu_color: if($variant == 'light', $base_color, mix($bg_color, $base_color, 20%)); $popover_bg_color: $base_color; $popover_hover_color: darken($bg_color, 2%); $scrollbar_bg_color: mix($base_color, $bg_color, 50%); $scrollbar_slider_color: mix($fg_color, $bg_color, 60%); $scrollbar_slider_hover_color: mix($fg_color, $bg_color, 80%); $scrollbar_slider_active_color: if($variant=='light', darken($selected_bg_color, 10%), lighten($selected_bg_color, 10%)); $warning_color: if($variant == 'light', $orange, darken($orange,10%)); $error_color: if($variant == 'light', $red, darken($red,5%)); $success_color: if($variant == 'light', $cyan, darken($cyan,10%)); $destructive_color: if($variant == 'light', darken($red,5%), darken($red,10%)); $suggested_color: if($variant == 'light', $selected_bg_color, darken($selected_bg_color,10%)); $osd_fg_color: #fefefe; $osd_text_color: white; $osd_bg_color: transparentize(#14171a, 0.2); $osd_insensitive_bg_color: transparentize(mix($osd_fg_color, opacify($osd_bg_color, 1), 10%), 0.5); $osd_insensitive_fg_color: mix($osd_fg_color, opacify($osd_bg_color, 1), 50%); $osd_borders_color: transparentize(black, 0.3); $sidebar_bg_color: mix($bg_color, $base_color, 50%); $base_hover_color: transparentize($fg_color, 0.95); $tooltip_borders_color: transparentize(white, 0.9); $shadow_color: transparentize(black, 0.9); $drop_target_color: #a1ce4b; $text_shadow_color: if($variant == 'dark', $shadow_color, transparentize(white, 0.9)); $icon_shadow_color: $text_shadow_color; $drop_target_color: #4e9a06; // Infobar colors $info_color: $lime; $question_color: $cyan; // Panel colors $panel_bg_color: transparentize(black, 0.3); $panel_fg_color: white; $panel_borders_color: transparentize(black, 0.8); // Disabled state colors $insensitive_fg_color: mix($fg_color, $bg_color, 50%); $insensitive_bg_color: mix($bg_color, $base_color, 60%); $insensitive_base_color: darken($base_color, 5%); $insensitive_borders_color: $borders_color; // Backdrop state colors $backdrop_base_color: if($variant == 'light', darken($base_color, 1%), lighten($base_color, 1%)); $backdrop_text_color: mix($text_color, $backdrop_base_color, 80%); $backdrop_bg_color: $bg_color; $backdrop_headerbar_bg_color: $headerbar_color; $backdrop_headerbar_fg_color: if($variant == 'light', transparentize($headerbar_fg_color, 0.5), transparentize($headerbar_fg_color, 0.2)); $backdrop_fg_color: mix($fg_color, $backdrop_bg_color, 50%); $backdrop_insensitive_color: if($variant == 'light', darken($backdrop_bg_color, 15%), lighten($backdrop_bg_color, 15%)); $backdrop_selected_bg_color: transparentize($selected_bg_color, 0.4); $backdrop_selected_fg_color: if($variant == 'light', $selected_fg_color, transparentize($selected_fg_color, 0.5)); $backdrop_borders_color: mix($borders_color, $bg_color, 90%); $backdrop_dark_fill: mix($backdrop_borders_color, $backdrop_bg_color, 35%); $backdrop_sidebar_bg_color: mix($backdrop_bg_color, $backdrop_base_color, 50%); $backdrop_scrollbar_bg_color: darken($backdrop_bg_color, 3%); $backdrop_scrollbar_slider_color: mix($backdrop_fg_color, $backdrop_bg_color, 40%); $backdrop_menu_color: if($variant == 'light', $backdrop_base_color, mix($backdrop_bg_color, $backdrop_base_color, 20%)); $scale_bg: if($variant == 'light', transparentize(black,0.86) ,transparentize(white,0.86)); $scale_disabled_bg: if($variant == 'light', transparentize(black, 0.94) ,transparentize(white, 0.94)); $suggested_bg_color: linear-gradient(to right, #00ffb7 0%, #00d593 100%); $destructive_bg_color: linear-gradient(to right, #fe8c00, #f83600); $menu_shadow_color: if($variant == 'light', transparentize(rgb(122, 122, 122), 0.6), transparent);