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
$blue: #4285F4;
6
$green: #34A853;
7
$yellow: #FBBC05;
8
$red: #EA4335;
9
@function gtkalpha($c, $a) {
11
@return unquote("alpha(#{$c}, #{$a})");
12
}
13
// Foreground colors
15
$text-on-light: rgba(black, 0.87);
16
$text-on-dark: white;
17
$text: if($variant == 'light', rgba(black, 0.87), white);
19
$text-secondary: if($variant == 'light', rgba(black, 0.54), rgba(white, 0.7));
20
$text-disabled: if($variant == 'light', rgba(black, 0.38), rgba(white, 0.5));
21
$text-secondary-disabled: if($variant == 'light', rgba(black, 0.26), rgba(white, 0.3));
22
$track: if($variant == 'light', rgba(black, 0.26), rgba(white, 0.3));
23
$divider: if($variant == 'light', rgba(black, 0.12), rgba(white, 0.12));
24
$fill: if($variant == 'light', rgba(black, 0.04), rgba(white, 0.04));
25
$titlebar-text: if($topbar == 'light', rgba(black, 0.87), white);
27
$titlebar-text-secondary: if($topbar == 'light', rgba(black, 0.54), rgba(white, 0.7));
28
$titlebar-text-disabled: if($topbar == 'light', rgba(black, 0.38), rgba(white, 0.5));
29
$titlebar-text-secondary-disabled: if($topbar == 'light', rgba(black, 0.26), rgba(white, 0.3));
30
$titlebar-track: if($topbar == 'light', rgba(black, 0.26), rgba(white, 0.3));
31
$titlebar-divider: if($topbar == 'light', rgba(black, 0.12), rgba(white, 0.12));
32
$titlebar-fill: if($topbar == 'light', rgba(black, 0.04), rgba(white, 0.04));
33
$inverse-text: white;
35
$inverse-text-secondary: rgba(white, 0.7);
36
$inverse-text-disabled: rgba(white, 0.5);
37
$inverse-text-secondary-disabled: rgba(white, 0.3);
38
$inverse-track: rgba(white, 0.3);
39
$inverse-divider: rgba(white, 0.12);
40
$inverse-fill: rgba(white, 0.04);
41
// Background colors
43
$background: if($variant == 'light', #F2F2F2, #282828);
44
$base: if($variant == 'light', #FFFFFF, #303030);
45
$base-alt: if($variant == 'light', #FAFAFA, #2C2C2C);
46
$surface: if($variant == 'light', #FFFFFF, #424242);
47
$titlebar: if($topbar == 'dark', #383838, #E0E0E0);
49
$scrim: rgba(black, 0.6);
51
$scrim-alt: rgba(black, 0.3);
52
$scrim-inverse: rgba(white, 0.1);
53
$panel: if($topbar == 'dark', #212121, $scrim);
54
$panel-solid: if($topbar == 'dark', #212121, #CBCBCB); // for Unity panel which cannot use translucent colors
55
$os-background: #303030;
57
$overlay-hover: gtkalpha(currentColor, 0.08);
59
$overlay-focus: gtkalpha(currentColor, 0.12);
60
$overlay-focus-hover: gtkalpha(currentColor, 0.16);
61
$overlay-active: gtkalpha(currentColor, 0.12);
62
$overlay-checked: gtkalpha(currentColor, 0.24);
63
// Misc colors
65
$primary: $blue;
66
$primary-alt: #7BAAF7;
67
$overlay-selected: rgba($primary, 0.32);
68
$link: $primary;
70
$link-visited: $purple-a200;
71
$warning: $yellow;
73
$error: $red;
74
$success: $green;
75
$suggested: $primary;
77
$destructive: $red;
78
$infobar-info: $green;
80
$infobar-question: $blue;
81
$infobar-warning: $yellow;
82
$infobar-error: $red;
83
$tooltip: rgba(#616161, 0.9);
85
$tooltip-text: white;
86
$border: if($variant == 'light', rgba(black, 0.12), rgba(black, 0.26));
88
$border-alt: rgba(black, 0.26); // for non-native GTK+ apps (e.g. Firefox and Chrome)
89
$highlight: if($variant == 'light', rgba(white, 0.4), rgba(white, 0.1));
90
$highlight-titlebar: if($topbar == 'dark', rgba(white, 0.1), rgba(white, 0.4));
91
$highlight-alt: rgba(white, 0.2); // for selection-mode headerbar which colored with $primary
92
$titlebar-indicator: if($topbar == 'dark', currentColor, $primary);
93
// FIXME: Electron/Atom menu does not allow translucent colors
95
$solid-text: if($variant == 'light', $grey-900, $white);
96
$solid-text-secondary: if($variant == 'light', $grey-600, mix($white, $surface, percentage(0.7)));
97
$solid-text-disabled: if($variant == 'light', $grey-500, mix($white, $surface, percentage(0.5)));
98
$solid-divider: if($variant == 'light', $grey-300, mix($white, $surface, percentage(0.12)));
99
// FIXME: gtk @placeholder_text_color does not allow translucent colors
101
$placeholder_text_color: if($variant == 'light', $grey-600, mix($white, $base, percentage(0.7)));
102