ASCII text
1
// When color definition differs for dark and light variant,
2
// it gets @if ed depending on $variant
3
@import 'color-palette';
5
$grey_850: #303030; // extra color from Material Design Guidelines
6
$materia_blue: #338DD6;
7
@function gtkalpha($c, $a) {
9
@return unquote("alpha(#{$c}, #{$a})");
10
}
11
// Foreground colors
13
$dark_fg_color: rgba($black, 0.87);
14
$light_fg_color: $white;
15
$fg_color: if($variant == 'light', rgba($black, 0.87), $white);
17
$button_fg_color: if($variant == 'light', rgba($black, 0.62), rgba($white, 0.8)); // extra fg color for raised buttons
18
$secondary_fg_color: if($variant == 'light', rgba($black, 0.54), rgba($white, 0.7));
19
$hint_fg_color: if($variant == 'light', rgba($black, 0.38), rgba($white, 0.5));
20
$disabled_fg_color: if($variant == 'light', rgba($black, 0.38), rgba($white, 0.5));
21
$disabled_secondary_fg_color: if($variant == 'light', rgba($black, 0.26), rgba($white, 0.3));
22
$track_color: if($variant == 'light', rgba($black, 0.26), rgba($white, 0.3));
23
$divider_color: if($variant == 'light', rgba($black, 0.12), rgba($white, 0.12));
24
$titlebar_fg_color: if($titlebar == 'light', rgba($black, 0.87), $white);
26
$titlebar_secondary_fg_color: if($titlebar == 'light', rgba($black, 0.54), rgba($white, 0.7));
27
$titlebar_hint_fg_color: if($titlebar == 'light', rgba($black, 0.38), rgba($white, 0.5));
28
$titlebar_disabled_fg_color: if($titlebar == 'light', rgba($black, 0.38), rgba($white, 0.5));
29
$titlebar_disabled_secondary_fg_color: if($titlebar == 'light', rgba($black, 0.26), rgba($white, 0.3));
30
$titlebar_track_color: if($titlebar == 'light', rgba($black, 0.26), rgba($white, 0.3));
31
$titlebar_divider_color: if($titlebar == 'light', rgba($black, 0.12), rgba($white, 0.12));
32
$inverse_fg_color: $white;
34
$inverse_secondary_fg_color: rgba($white, 0.7);
35
$inverse_hint_fg_color: rgba($white, 0.5);
36
$inverse_disabled_fg_color: rgba($white, 0.5);
37
$inverse_disabled_secondary_fg_color: rgba($white, 0.3);
38
$inverse_track_color: rgba($white, 0.3);
39
$inverse_divider_color: rgba($white, 0.12);
40
// Background colors
42
$bg_color: if($variant == 'light', $grey_200, $grey_900);
43
$base_color: if($variant == 'light', $white, $grey_850);
44
$alt_base_color: if($variant == 'light', $grey_100, mix($base_color, $bg_color, 50%));
45
$lighter_bg_color: if($variant == 'light', $grey_50, $grey_800);
46
$alt_lighter_bg_color: if($variant == 'light', $grey_200, $grey_850); // for gnome-shell sub menu
47
$darker_bg_color: if($variant == 'light', $grey_200, $grey_900);
48
$titlebar_bg_color: if($titlebar == 'dark', $grey_850, $grey_300);
50
$alt_titlebar_bg_color: if($titlebar == 'dark', $grey_850, $grey_300);
51
$panel_bg_color: rgba($black, $middle_opacity);
53
$alt_panel_bg_color: rgba($black, $lower_opacity);
54
$inverse_panel_bg_color: rgba($inverse_fg_color, 0.1);
55
$solid_panel_bg_color: if($titlebar == 'dark', $grey_900, $panel_bg_color);
56
$opaque_panel_bg_color: if($titlebar == 'dark', $grey_900, mix($grey_300, $grey_400, 50%)); // for Unity panel which cannot use translucent colors
57
$gdm_bg_color: $grey_850;
59
$fill_color: gtkalpha(currentColor, $lower_opacity);
61
$semi_fill_color: gtkalpha(currentColor, $lower_opacity / 2);
62
$row_fill_color: gtkalpha(currentColor, 0.05);
63
// Misc colors
65
$primary_color: $materia_blue;
66
$alt_primary_color: $light_blue_A200;
67
$accent_color: $teal_500;
68
$disabled_accent_color: rgba($accent_color, 0.5);
69
$link_color: $primary_color;
71
$visited_link_color: $purple_A200;
72
$warning_color: $orange_A700;
74
$error_color: $deep_orange_A700;
75
$success_color: $green_A700;
76
$suggested_color: $accent_color;
78
$destructive_color: $red_A200;
79
$info_bg_color: $green_400;
81
$question_bg_color: $blue_400;
82
$warning_bg_color: $orange_400;
83
$error_bg_color: $red_400;
84
$tooltip_bg_color: $grey_800;
86
$tooltip_fg_color: $inverse_fg_color;
87
$border_color: if($variant == 'light', rgba($black, 0.12), rgba($black, 0.26));
89
$alt_border_color: rgba($black, 0.26); // for non-native GTK+ apps (e.g. Firefox and Chrome)
90
$highlight_color: if($variant == 'light', rgba($white, 0.4), rgba($white, 0.1));
91
$titlebar_highlight_color: if($titlebar == 'dark', rgba($white, 0.1), rgba($white, 0.4));
92
$alt_highlight_color: rgba($white, 0.2); // for selection-mode headerbar which colored with $primary_color
93
$titlebar_indicator_color: if($titlebar == 'dark', currentColor, $primary_color);
94
// for Electron/Atom menu which cannot use translucent colors
96
$opaque_fg_color: if($variant == 'light', $grey_900, $white);
97
$opaque_secondary_fg_color: if($variant == 'light', $grey_600, mix($white, $base_color, percentage(0.7)));
98
$opaque_disabled_fg_color: if($variant == 'light', $grey_500, mix($white, $base_color, percentage(0.5)));
99
$opaque_divider_color: if($variant == 'light', $grey_300, mix($white, $base_color, percentage(0.12)));
100
// FIXME: gtk's @placeholder_text_color API really should use $secondary_fg_color,
102
// but it doesn't work with translucent colors. So we use opaque colors instead.
103
$placeholder_text_color: if($variant == 'light',
104
mix($black, $base_color, percentage(0.54)),
105
mix($white, $base_color, percentage(0.7)));
106