-
Notifications
You must be signed in to change notification settings - Fork 1
/
material-theme.jsonc
119 lines (119 loc) · 4.33 KB
/
material-theme.jsonc
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
{
"meta": {
"name": "Material Theme",
"scheme": "dark" // must be "light" or "dark"
},
"themeValues": {
// values applied to the entire app
"root": {
"accent": "#80CBC4",
"red": "#f07178",
"orange": "#F78C6C",
"yellow": "#FFCB6B",
"green": "#C3E88D",
"blue": "#82AAFF",
"ltblue": "lighten(@app__bg0, 5%)",
"purple": "#C792EA",
"app__bg0": "#263238",
"dimmed-text": "lighten(desaturate(@app__bg0, 13%), 45%)",
"toolbar__bg0": "lighten(@app__bg0, 4%)",
"toolbar__bg1": "@app__bg0",
"toolbar__bg2": "lighten(@app__bg0, 5%)",
"panel__bg0": "@app__bg0",
"panel__bg1": "@app__bg0",
"panel__bg2": "lighten(@app__bg0, 5%)",
"input__bg": "fade(#000000, 25%)",
"input-bg-warn-color": "fade(@orange, 60%)",
"panel-border": "lighten(@app__bg0, 5%)",
"section-border": "lighten(@app__bg0, 5%)",
"subtle-border": "fade(#FFFFFF, 4%)",
"modal-overlay-color": "fade(darken(@app__bg0, 5%), 90%)",
// text colors
// values starting with . aren't added to the CSS, they're just variables
".text-color": "#FFFFFF",
"text-selected": "@.text-color",
"text-normal": "fade(@.text-color, 75%)",
"text-secondary": "@dimmed-text",
"text-disabled": "fade(@dimmed-text, 70%)",
"text-accent": "@accent",
"text-inverse": "#222222",
// buttons
"btn-text": "@text-normal",
"btn-text-hover": "@text-selected",
"default-border": "@text-normal",
"default-bg": "transparent",
"default-hover": "transparent",
"default-border-hover": "@text-selected",
"primary-border": "transparent",
"primary-bg": "fade(@accent, 20%)",
"primary-hover": "fade(@accent, 60%)",
"success-border": "transparent",
"success-bg": "fade(@green, 20%)",
"success-hover": "fade(@green, 60%)",
"warning-border": "@orange",
"warning-bg": "fade(@orange, 20%)",
"warning-hover": "fade(@orange, 60%)",
"danger-border": "transparent",
"danger-bg": "fade(@red, 20%)",
"danger-hover": "fade(@red, 60%)",
// states
"hover-row": "lighten(@app__bg0, 5%)",
"danger-row": "fade(@red, 60%)",
"selected-row": "lighten(@app__bg0, 10%)",
"warning-row": "fade(@orange, 60%)",
"droppable": "fade(@purple, 20%)",
"drop-target": "fade(@green, 50%)",
"input--disabled": "fade(#000000, 10%)",
"link-color": "@accent",
"form-control-focus": "@accent",
// various app elements
"code-bg": "@app__bg0",
"scroll-thumb-border": "@app__bg0",
"scroll-thumb-bg": "lighten(desaturate(@app__bg0, 2%), 10%)",
"scroll-thumb-bg-light": "lighten(@toolbar__bg2, 20%)",
"wip-status": "fade(@blue, 40%)",
"card__bg": "@panel__bg2",
"card-shadow": "rgba(0,0,0,.2)",
// component states
"filtering": "fade(@blue, 50%)",
"soloing": "fade(@orange, 50%)",
"checked-out": "fade(@accent, 30%)",
"soloed": "fade(@orange, 30%)",
"added-line": "fade(@green, 20%)",
"deleted-line": "fade(@red, 20%)",
"filter-match": "fade(@blue, 50%)",
"clone__progress": "darken(@app__bg0, 3%)",
"toolbar__prompt": "darken(@app__bg0, 3%)",
"modified-line": "fade(#000000, 25%)",
"verified": "fade(@green, 30%)",
"unverified": "fade(#ffffff, 10%)",
"drop-sort-border": "@green",
// terminal
"terminal__repo-name-color": "turquoise",
"terminal__repo-branch-color": "violet",
"terminal__repo-tag-color": "lightcoral",
"terminal__repo-upstream-color": "yellowgreen"
},
// override specific values just for the toolbar
"toolbar": {
"text-selected": "rgba(255,255,255,1)",
"text-normal": "@.text-color",
"text-secondary": "@dimmed-text",
"text-disabled": "fade(@dimmed-text, 70%)",
"input__bg": "rgba(0,0,0,.20)",
"link-color": "#40c5ec",
"btn-text": "var(--text-normal)"
},
// override specific values just for the tabs bar
"tabsbar": {
"text-selected": "@accent",
"text-normal": "@.text-color",
"text-secondary": "@dimmed-text",
"text-disabled": "fade(@dimmed-text, 70%)",
"section-border": "rgba(255,255,255,.2)",
"input__bg": "rgba(0,0,0,.20)",
"link-color": "@accent",
"btn-text": "var(--text-normal)"
}
}
}