_colors.scss.template
ASCII text
1
// When color definition differs for dark and light variant,
2
// it gets @if ed depending on $variant
3
4
@import 'color-palette';
5
6
@function gtkalpha($c, $a) {
7
@return unquote("alpha(#{$c}, #{$a})");
8
}
9
10
@function fade($c) {
11
@return mix($c, %FG%, 50%);
12
}
13
14
// Foreground colors
15
$dark_fg_color: %FG%;
16
$light_fg_color: %BG%;
17
18
$fg_color: %FG%;
19
$button_fg_color: %BTN_FG%;
20
$secondary_fg_color: if($variant == 'light', rgba(%BTN_FG%, 0.54), rgba(%BTN_FG%, 0.7));
21
$hint_fg_color: if($variant == 'light', rgba(%FG%, 0.38), rgba(%FG%, 0.5));
22
$disabled_fg_color: if($variant == 'light', rgba(%FG%, 0.38), rgba(%FG%, 0.5));
23
$disabled_secondary_fg_color: if($variant == 'light', rgba(%BTN_FG%, 0.26), rgba(%BTN_FG%, 0.3));
24
$track_color: if($variant == 'light', rgba(%FG%, 0.26), rgba(%FG%, 0.3));
25
$divider_color: if($variant == 'light', rgba(%FG%, 0.12), rgba(%FG%, 0.12));
26
27
$titlebar_fg_color: %MENU_FG%;
28
$titlebar_secondary_fg_color: if($titlebar == 'light', rgba(%MENU_FG%, 0.54), rgba(%MENU_FG%, 0.7));
29
$titlebar_hint_fg_color: if($titlebar == 'light', rgba(%MENU_FG%, 0.38), rgba(%MENU_FG%, 0.5));
30
$titlebar_disabled_fg_color: if($titlebar == 'light', rgba(%MENU_FG%, 0.38), rgba(%MENU_FG%, 0.5));
31
$titlebar_disabled_secondary_fg_color: if($titlebar == 'light', rgba(%MENU_FG%, 0.26), rgba(%MENU_FG%, 0.3));
32
$titlebar_track_color: if($titlebar == 'light', rgba(%MENU_FG%, 0.26), rgba(%MENU_FG%, 0.3));
33
$titlebar_divider_color: if($titlebar == 'light', rgba(%MENU_FG%, 0.12), rgba(%MENU_FG%, 0.12));
34
35
$inverse_fg_color: %SEL_FG%;
36
$inverse_secondary_fg_color: rgba(%SEL_FG%, 0.7);
37
$inverse_hint_fg_color: rgba(%SEL_FG%, 0.5);
38
$inverse_disabled_fg_color: rgba(%SEL_FG%, 0.5);
39
$inverse_disabled_secondary_fg_color: rgba(%SEL_FG%, 0.3);
40
$inverse_track_color: rgba(%SEL_FG%, 0.3);
41
$inverse_divider_color: rgba(%SEL_FG%, 0.12);
42
43
// Background colors
44
$bg_color: if($variant == 'light', %BG%, fade(%MENU_BG%));
45
$base_color: if($variant == 'light', %TXT_BG%, fade(%MENU_BG%));
46
$alt_base_color: if($variant == 'light', %INACTIVE_TXT_BG%, mix(%INACTIVE_TXT_BG%, %MENU_BG%, 50%));
47
$lighter_bg_color: if($variant == 'light', %BTN_BG%, fade(%BTN_BG%));
48
$alt_lighter_bg_color: if($variant == 'light', %BG2%, fade(%MENU_BG%)); // for gnome-shell sub menu
49
$darker_bg_color: if($variant == 'light', %BG%, fade(%MENU_BG%));
50
51
$titlebar_bg_color: %MENU_BG%;
52
$alt_titlebar_bg_color: if($titlebar == 'dark', %MENU_BG%, %MENU_BG%);
53
54
$panel_bg_color: rgba(%MENU_BG%, %GNOME_SHELL_PANEL_OPACITY%);
55
$alt_panel_bg_color: rgba(%MENU_BG%, $lower_opacity);
56
$inverse_panel_bg_color: rgba($inverse_fg_color, 0.1);
57
$solid_panel_bg_color: if($titlebar == 'dark', %MENU_BG%, %MENU_BG%);
58
$opaque_panel_bg_color: if($titlebar == 'dark', %MENU_BG%, mix(%MENU_BG%, %MENU_BG%, 50%)); // for Unity panel which cannot use translucent colors
59
60
$tooltip_bg_color: $grey_800;
61
62
$gdm_bg_color: if($variant == 'light', %MENU_BG%, %MENU_BG2%);
63
64
$fill_color: gtkalpha(currentColor, $lower_opacity);
65
$semi_fill_color: gtkalpha(currentColor, $lower_opacity / 2);
66
$row_fill_color: gtkalpha(currentColor, 0.05);
67
68
// Misc colors
69
$primary_color: %SEL_BG%;
70
$alt_primary_color: %SEL_BG2%;
71
$accent_color: %ACCENT_BG%;
72
$disabled_accent_color: rgba($accent_color, 0.5);
73
74
$link_color: $primary_color;
75
$visited_link_color: $purple_A200;
76
77
$warning_color: $orange_A700;
78
$error_color: $deep_orange_A700;
79
$success_color: $green_A700;
80
81
$suggested_color: $accent_color;
82
$destructive_color: $red_A200;
83
84
$info_bg_color: $green_400;
85
$question_bg_color: %SEL_BG%;
86
$warning_bg_color: $orange_400;
87
$error_bg_color: $red_400;
88
89
$border_color: if($variant == 'light', rgba(%FG%, 0.12), rgba(%FG%, 0.26));
90
$alt_border_color: rgba(%FG%, 0.26); // for non-native GTK+ apps (e.g. Firefox and Chrome)
91
$highlight_color: if($variant == 'light', rgba(%TXT_BG%, 0.4), rgba(%TXT_BG%, 0.1));
92
$titlebar_highlight_color: %MENU_BG%;
93
$alt_highlight_color: rgba(%TXT_BG%, 0.2); // for selection-mode headerbar which colored with $primary_color
94
$titlebar_indicator_color: if($titlebar == 'dark', currentColor, $primary_color);
95
96
// for Electron/Atom menu which cannot use translucent colors
97
$opaque_fg_color: if($variant == 'light', %FG%, %TXT_BG%);
98
$opaque_secondary_fg_color: if($variant == 'light', $grey_600, mix(%TXT_BG%, $base_color, percentage(0.7)));
99
$opaque_disabled_fg_color: if($variant == 'light', %INACTIVE_FG%, mix(%TXT_BG%, $base_color, percentage(0.5)));
100
$opaque_divider_color: if($variant == 'light', %SEL_BG%, mix(%TXT_BG%, $base_color, percentage(0.12)));
101
102
// FIXME: gtk's @placeholder_text_color API really should use $secondary_fg_color,
103
// but it doesn't work with translucent colors. So we use opaque colors instead.
104
$placeholder_text_color: if($variant == 'light',
105
mix(%FG%, $base_color, percentage(0.54)),
106
mix(%TXT_BG%, $base_color, percentage(0.7)));
107