Skip to main content

makepad_widgets/
theme_desktop_dark.rs

1use crate::makepad_platform::*;
2
3live_design! {
4    link theme_desktop_dark;
5    use link::shaders::*;
6    
7    // GLOBAL PARAMETERS
8    pub THEME_COLOR_CONTRAST = 1.0
9    pub THEME_COLOR_TINT = #0000ff
10    pub THEME_COLOR_TINT_AMOUNT = 0.0
11    pub THEME_SPACE_FACTOR = 6. // Increase for a less dense layout
12    pub THEME_CORNER_RADIUS = 2.5
13    pub THEME_BEVELING = 0.75
14    pub THEME_FONT_SIZE_BASE = 10.
15    pub THEME_FONT_SIZE_CONTRAST = 2.5// Greater values = greater font-size steps between font-formats (i.e. from H3 to H2)
16
17    // DIMENSIONS
18    pub THEME_SPACE_1 = (0.5 * (THEME_SPACE_FACTOR))
19    pub THEME_SPACE_2 = (1.0 * (THEME_SPACE_FACTOR))
20    pub THEME_SPACE_3 = (1.5 * (THEME_SPACE_FACTOR))
21
22    pub THEME_MSPACE_1 = {top: (THEME_SPACE_1), right: (THEME_SPACE_1), bottom: (THEME_SPACE_1), left: (THEME_SPACE_1)} 
23    pub THEME_MSPACE_H_1 = {top: 0., right: (THEME_SPACE_1), bottom: 0., left: (THEME_SPACE_1)}
24    pub THEME_MSPACE_V_1 = {top: (THEME_SPACE_1), right: 0., bottom: (THEME_SPACE_1), left: 0.}
25    pub THEME_MSPACE_2 = {top: (THEME_SPACE_2), right: (THEME_SPACE_2), bottom: (THEME_SPACE_2), left: (THEME_SPACE_2)}
26    pub THEME_MSPACE_H_2 = {top: 0., right: (THEME_SPACE_2), bottom: 0., left: (THEME_SPACE_2)}
27    pub THEME_MSPACE_V_2 = {top: (THEME_SPACE_2), right: 0., bottom: (THEME_SPACE_2), left: 0.}
28    pub THEME_MSPACE_3 = {top: (THEME_SPACE_3), right: (THEME_SPACE_3), bottom: (THEME_SPACE_3), left: (THEME_SPACE_3)}
29    pub THEME_MSPACE_H_3 = {top: 0., right: (THEME_SPACE_3), bottom: 0., left: (THEME_SPACE_3)}
30    pub THEME_MSPACE_V_3 = {top: (THEME_SPACE_3), right: 0., bottom: (THEME_SPACE_3), left: 0.}
31
32    pub THEME_DATA_ITEM_HEIGHT = (7.75 * THEME_SPACE_1);
33    pub THEME_DATA_ICON_WIDTH = (2.6 * THEME_SPACE_2);
34    pub THEME_DATA_ICON_HEIGHT = (3.6 * THEME_SPACE_2);
35
36    pub THEME_CONTAINER_CORNER_RADIUS = (THEME_CORNER_RADIUS * 2.)
37    pub THEME_TEXTSELECTION_CORNER_RADIUS = (THEME_CORNER_RADIUS * .5)
38    pub THEME_TAB_HEIGHT = (6 * THEME_SPACE_FACTOR),
39    pub THEME_TAB_FLAT_HEIGHT = (5.5 * THEME_SPACE_FACTOR),
40    pub THEME_SPLITTER_HORIZONTAL = 16.0,
41    pub THEME_SPLITTER_SIZE = 10.0,
42    pub THEME_SPLITTER_MIN_HORIZONTAL = (THEME_TAB_HEIGHT),
43    pub THEME_SPLITTER_MAX_HORIZONTAL = (THEME_TAB_HEIGHT + THEME_SPLITTER_SIZE),
44    pub THEME_SPLITTER_MIN_VERTICAL = (THEME_SPLITTER_HORIZONTAL),
45    pub THEME_SPLITTER_MAX_VERTICAL = (THEME_SPLITTER_HORIZONTAL + THEME_SPLITTER_SIZE),
46    pub THEME_SPLITTER_SIZE = 5.0
47    pub THEME_DOCK_BORDER_SIZE: 0.0
48
49    // COLOR PALETTE
50    pub THEME_COLOR_W = #FFFFFFFF
51    pub THEME_COLOR_W_H = #FFFFFF00
52    pub THEME_COLOR_B = #000000FF
53    pub THEME_COLOR_B_H = #00000000
54
55    pub THEME_COLOR_WHITE = (mix(THEME_COLOR_W, #FFFFFF00, pow(0.1, THEME_COLOR_CONTRAST)))
56    pub THEME_COLOR_U_6 = (mix(THEME_COLOR_W, THEME_COLOR_W_H, pow(0.2, THEME_COLOR_CONTRAST)))
57    pub THEME_COLOR_U_5 = (mix(THEME_COLOR_W, THEME_COLOR_W_H, pow(0.35, THEME_COLOR_CONTRAST)))
58    pub THEME_COLOR_U_4 = (mix(THEME_COLOR_W, THEME_COLOR_W_H, pow(0.6, THEME_COLOR_CONTRAST)))
59    pub THEME_COLOR_U_4_OPAQUE = #6; // TODO: REPLACE
60    pub THEME_COLOR_U_3 = (mix(THEME_COLOR_W, THEME_COLOR_W_H, pow(0.75, THEME_COLOR_CONTRAST)))
61    pub THEME_COLOR_U_2 = (mix(THEME_COLOR_W, THEME_COLOR_W_H, pow(0.85, THEME_COLOR_CONTRAST)))
62    pub THEME_COLOR_U_15 = (mix(THEME_COLOR_W, THEME_COLOR_W_H, pow(0.9, THEME_COLOR_CONTRAST)))
63    pub THEME_COLOR_U_2_OPAQUE = #9; // TODO: REPLACE
64    pub THEME_COLOR_U_1 = (mix(THEME_COLOR_W, THEME_COLOR_W_H, pow(0.95, THEME_COLOR_CONTRAST)))
65    pub THEME_COLOR_U_HIDDEN = (THEME_COLOR_W_H)
66
67    pub THEME_COLOR_D_HIDDEN = (THEME_COLOR_B_H)
68    pub THEME_COLOR_D_05 = (mix(THEME_COLOR_B, THEME_COLOR_B_H, pow(0.9, THEME_COLOR_CONTRAST)))
69    pub THEME_COLOR_D_1 = (mix(THEME_COLOR_B, THEME_COLOR_B_H, pow(0.85, THEME_COLOR_CONTRAST)))
70    pub THEME_COLOR_D_2 = (mix(THEME_COLOR_B, THEME_COLOR_B_H, pow(0.75, THEME_COLOR_CONTRAST)))
71    pub THEME_COLOR_D_3 = (mix(THEME_COLOR_B, THEME_COLOR_B_H, pow(0.6, THEME_COLOR_CONTRAST)))
72    pub THEME_COLOR_D_4 = (mix(THEME_COLOR_B, THEME_COLOR_B_H, pow(0.4, THEME_COLOR_CONTRAST)))
73    pub THEME_COLOR_D_5 = (mix(THEME_COLOR_B, THEME_COLOR_B_H, pow(0.25, THEME_COLOR_CONTRAST)))
74    pub THEME_COLOR_BLACK = (mix(THEME_COLOR_B, THEME_COLOR_B_H, pow(0.1, THEME_COLOR_CONTRAST)))
75
76    pub THEME_COLOR_BG_APP = (mix(
77        (THEME_COLOR_B * mix(#ffffff, THEME_COLOR_TINT, THEME_COLOR_TINT_AMOUNT)),
78        (THEME_COLOR_W * mix(#ffffff, THEME_COLOR_TINT, THEME_COLOR_TINT_AMOUNT)),
79        pow(0.3, THEME_COLOR_CONTRAST)))
80    pub THEME_COLOR_FG_APP = (mix(
81        (THEME_COLOR_B * mix(#ffffff, THEME_COLOR_TINT, THEME_COLOR_TINT_AMOUNT)),
82        (THEME_COLOR_W * mix(#ffffff, THEME_COLOR_TINT, THEME_COLOR_TINT_AMOUNT)),
83        pow(0.36, THEME_COLOR_CONTRAST))
84    )
85    pub THEME_COLOR_OPAQUE_U_6 = (mix(THEME_COLOR_FG_APP, #F, 0.8))
86    pub THEME_COLOR_OPAQUE_U_5 = (mix(THEME_COLOR_FG_APP, #F, 0.7))
87    pub THEME_COLOR_OPAQUE_U_4 = (mix(THEME_COLOR_FG_APP, #F, 0.5))
88    pub THEME_COLOR_OPAQUE_U_3 = (mix(THEME_COLOR_FG_APP, #F, 0.35))
89    pub THEME_COLOR_OPAQUE_U_2 = (mix(THEME_COLOR_FG_APP, #F, 0.25))
90    pub THEME_COLOR_OPAQUE_U_1 = (mix(THEME_COLOR_FG_APP, #F, 0.15))
91
92    pub THEME_COLOR_OPAQUE_D_1 = (mix(THEME_COLOR_FG_APP, #0, 0.15))
93    pub THEME_COLOR_OPAQUE_D_2 = (mix(THEME_COLOR_FG_APP, #0, 0.25))
94    pub THEME_COLOR_OPAQUE_D_3 = (mix(THEME_COLOR_FG_APP, #0, 0.45))
95    pub THEME_COLOR_OPAQUE_D_4 = (mix(THEME_COLOR_FG_APP, #0, 0.6))
96    pub THEME_COLOR_OPAQUE_D_5 = (mix(THEME_COLOR_FG_APP, #0, 0.75))
97
98    // BASICS
99    pub THEME_COLOR_MAKEPAD = #FF5C39FF
100
101    pub THEME_COLOR_SHADOW = (THEME_COLOR_OPAQUE_D_4)
102    pub THEME_COLOR_SHADOW_FOCUS = (THEME_COLOR_D_5)
103    pub THEME_COLOR_SHADOW_DISABLED = (THEME_COLOR_OPAQUE_D_2)
104    pub THEME_COLOR_SHADOW_FLAT = (THEME_COLOR_D_HIDDEN)
105    pub THEME_COLOR_FLAT_FOCUS = (THEME_COLOR_U_3)
106    pub THEME_COLOR_SHADOW_FLAT_DISABLED = (THEME_COLOR_OPAQUE_D_2)
107    pub THEME_COLOR_LIGHT = (THEME_COLOR_OPAQUE_U_1)
108    pub THEME_COLOR_LIGHT_HOVER = (THEME_COLOR_OPAQUE_U_3)
109    pub THEME_COLOR_LIGHT_FOCUS = (THEME_COLOR_OPAQUE_U_3)
110    pub THEME_COLOR_LIGHT_DISABLED = (THEME_COLOR_OPAQUE_D_1)
111
112    pub THEME_COLOR_BG_HIGHLIGHT = (THEME_COLOR_U_1)
113    pub THEME_COLOR_BG_UNFOCUSSED = (THEME_COLOR_BG_HIGHLIGHT * 0.85)
114    pub THEME_COLOR_APP_CAPTION_BAR = (THEME_COLOR_D_HIDDEN)
115    pub THEME_COLOR_DRAG_QUAD = (THEME_COLOR_U_5)
116    pub THEME_COLOR_DRAG_TARGET_PREVIEW = (THEME_COLOR_U_2)
117
118    pub THEME_COLOR_CURSOR = (THEME_COLOR_WHITE)
119    pub THEME_COLOR_CURSOR_FOCUS = (THEME_COLOR_WHITE)
120    pub THEME_COLOR_CURSOR_EMPTY = (THEME_COLOR_WHITE)
121    pub THEME_COLOR_CURSOR_DISABLED = (THEME_COLOR_U_HIDDEN)
122    pub THEME_COLOR_CURSOR_BORDER = (THEME_COLOR_WHITE)
123
124    pub THEME_COLOR_HIGHLIGHT = (THEME_COLOR_U_1)
125    pub THEME_COLOR_TEXT_CURSOR = (THEME_COLOR_WHITE)
126    pub THEME_COLOR_BG_HIGHLIGHT_INLINE = (THEME_COLOR_D_3)
127
128    pub THEME_COLOR_TEXT = (THEME_COLOR_U_5)
129    pub THEME_COLOR_TEXT_VAL = (THEME_COLOR_U_3)
130    pub THEME_COLOR_TEXT_HL = (THEME_COLOR_TEXT)
131    pub THEME_COLOR_TEXT_HOVER = (THEME_COLOR_TEXT)
132    pub THEME_COLOR_TEXT_FOCUS = (THEME_COLOR_TEXT)
133    pub THEME_COLOR_TEXT_DOWN = (THEME_COLOR_TEXT)
134    pub THEME_COLOR_TEXT_DISABLED = (THEME_COLOR_U_1)
135    pub THEME_COLOR_TEXT_PLACEHOLDER = (THEME_COLOR_U_4)
136    pub THEME_COLOR_TEXT_PLACEHOLDER_HOVER = (THEME_COLOR_U_4)
137    pub THEME_COLOR_TEXT_META = (THEME_COLOR_U_4)
138
139    pub THEME_COLOR_LABEL_INNER = (THEME_COLOR_U_5)
140    pub THEME_COLOR_LABEL_INNER_DOWN = (THEME_COLOR_U_3)
141    pub THEME_COLOR_LABEL_INNER_DRAG = (THEME_COLOR_LABEL_INNER_DOWN)
142    pub THEME_COLOR_LABEL_INNER_HOVER = (THEME_COLOR_LABEL_INNER)
143    pub THEME_COLOR_LABEL_INNER_FOCUS = (THEME_COLOR_LABEL_INNER)
144    pub THEME_COLOR_LABEL_INNER_ACTIVE = (THEME_COLOR_LABEL_INNER)
145    pub THEME_COLOR_LABEL_INNER_INACTIVE = (THEME_COLOR_U_4)
146    pub THEME_COLOR_LABEL_INNER_DISABLED = (THEME_COLOR_U_3)
147
148    pub THEME_COLOR_LABEL_OUTER = (THEME_COLOR_U_5)
149    pub THEME_COLOR_LABEL_OUTER_OFF = (THEME_COLOR_U_3)
150    pub THEME_COLOR_LABEL_OUTER_DOWN = (THEME_COLOR_LABEL_OUTER)
151
152    pub THEME_COLOR_LABEL_OUTER_DRAG = (THEME_COLOR_LABEL_OUTER)
153    pub THEME_COLOR_LABEL_OUTER_HOVER = (THEME_COLOR_LABEL_OUTER)
154    pub THEME_COLOR_LABEL_OUTER_FOCUS = (THEME_COLOR_LABEL_OUTER)
155    pub THEME_COLOR_LABEL_OUTER_ACTIVE = (THEME_COLOR_LABEL_OUTER)
156    pub THEME_COLOR_LABEL_OUTER_ACTIVE_FOCUS = (THEME_COLOR_LABEL_OUTER)
157    pub THEME_COLOR_LABEL_OUTER_DISABLED = (THEME_COLOR_U_3)
158
159    pub THEME_COLOR_ICON = (THEME_COLOR_D_2)
160    pub THEME_COLOR_ICON_ACTIVE = (THEME_COLOR_U_4)
161    pub THEME_COLOR_ICON_DISABLED = (THEME_COLOR_D_4)
162
163    pub THEME_COLOR_BG_CONTAINER = (THEME_COLOR_D_3 * 0.8)
164    pub THEME_COLOR_BG_EVEN = (THEME_COLOR_BG_CONTAINER * 0.875)
165    pub THEME_COLOR_BG_ODD = (THEME_COLOR_BG_CONTAINER * 1.125)
166
167    pub THEME_COLOR_BEVEL = (THEME_COLOR_SHADOW_FLAT)
168    pub THEME_COLOR_BEVEL_HOVER = (THEME_COLOR_FLAT_FOCUS)
169    pub THEME_COLOR_BEVEL_FOCUS = (THEME_COLOR_BEVEL_HOVER)
170    pub THEME_COLOR_BEVEL_ACTIVE = (THEME_COLOR_BEVEL)
171    pub THEME_COLOR_BEVEL_EMPTY = (THEME_COLOR_BEVEL)
172    pub THEME_COLOR_BEVEL_DOWN = (THEME_COLOR_BEVEL_HOVER)
173    pub THEME_COLOR_BEVEL_DRAG = (THEME_COLOR_BEVEL_HOVER)
174    pub THEME_COLOR_BEVEL_DISABLED = (THEME_COLOR_SHADOW_FLAT_DISABLED)
175
176    pub THEME_COLOR_BEVEL_INSET_1 = (THEME_COLOR_LIGHT)
177    pub THEME_COLOR_BEVEL_INSET_1_HOVER = (THEME_COLOR_LIGHT_FOCUS)
178    pub THEME_COLOR_BEVEL_INSET_1_FOCUS = (THEME_COLOR_BEVEL_INSET_1_HOVER)
179    pub THEME_COLOR_BEVEL_INSET_1_ACTIVE = (THEME_COLOR_BEVEL_INSET_1)
180    pub THEME_COLOR_BEVEL_INSET_1_EMPTY = (THEME_COLOR_BEVEL_INSET_1)
181    pub THEME_COLOR_BEVEL_INSET_1_DOWN = (THEME_COLOR_BEVEL_INSET_1_HOVER)
182    pub THEME_COLOR_BEVEL_INSET_1_DRAG = (THEME_COLOR_BEVEL_INSET_1_HOVER)
183    pub THEME_COLOR_BEVEL_INSET_1_DISABLED = (THEME_COLOR_LIGHT_DISABLED)
184
185    pub THEME_COLOR_BEVEL_INSET_2 = (THEME_COLOR_SHADOW)
186    pub THEME_COLOR_BEVEL_INSET_2_HOVER = (THEME_COLOR_BEVEL_INSET_2)
187    pub THEME_COLOR_BEVEL_INSET_2_FOCUS = (THEME_COLOR_SHADOW_FOCUS)
188    pub THEME_COLOR_BEVEL_INSET_2_ACTIVE = (THEME_COLOR_BEVEL_INSET_2)
189    pub THEME_COLOR_BEVEL_INSET_2_EMPTY = (THEME_COLOR_BEVEL_INSET_2)
190    pub THEME_COLOR_BEVEL_INSET_2_DOWN = (THEME_COLOR_BEVEL_INSET_2)
191    pub THEME_COLOR_BEVEL_INSET_2_DRAG = (THEME_COLOR_BEVEL_INSET_2)
192    pub THEME_COLOR_BEVEL_INSET_2_DISABLED = (THEME_COLOR_SHADOW_DISABLED)
193
194    pub THEME_COLOR_BEVEL_OUTSET_1 = (THEME_COLOR_LIGHT)
195    pub THEME_COLOR_BEVEL_OUTSET_1_HOVER = (THEME_COLOR_LIGHT_HOVER)
196    pub THEME_COLOR_BEVEL_OUTSET_1_FOCUS = (THEME_COLOR_BEVEL_OUTSET_1_HOVER)
197    pub THEME_COLOR_BEVEL_OUTSET_1_ACTIVE = (THEME_COLOR_LIGHT)
198    pub THEME_COLOR_BEVEL_OUTSET_1_DOWN = (THEME_COLOR_SHADOW)
199    pub THEME_COLOR_BEVEL_OUTSET_1_DRAG = (THEME_COLOR_BEVEL_OUTSET_1_DOWN)
200    pub THEME_COLOR_BEVEL_OUTSET_1_DISABLED = (THEME_COLOR_LIGHT_DISABLED)
201
202    pub THEME_COLOR_BEVEL_OUTSET_2 = (THEME_COLOR_SHADOW)
203    pub THEME_COLOR_BEVEL_OUTSET_2_HOVER = (THEME_COLOR_SHADOW)
204    pub THEME_COLOR_BEVEL_OUTSET_2_FOCUS = (THEME_COLOR_BEVEL_OUTSET_2_HOVER)
205    pub THEME_COLOR_BEVEL_OUTSET_2_ACTIVE = (THEME_COLOR_SHADOW)
206    pub THEME_COLOR_BEVEL_OUTSET_2_DOWN = (THEME_COLOR_LIGHT)
207    pub THEME_COLOR_BEVEL_OUTSET_2_DRAG = (THEME_COLOR_BEVEL_OUTSET_2_DOWN)
208    pub THEME_COLOR_BEVEL_OUTSET_2_FOCUS = (THEME_COLOR_SHADOW_FOCUS)
209    pub THEME_COLOR_BEVEL_OUTSET_2_DISABLED = (THEME_COLOR_SHADOW_DISABLED)
210
211    // Background of textinputs, radios, checkboxes etc.
212    pub THEME_COLOR_INSET = (THEME_COLOR_D_2)
213    pub THEME_COLOR_INSET_HOVER = (THEME_COLOR_INSET)
214    pub THEME_COLOR_INSET_DOWN = (THEME_COLOR_INSET_HOVER)
215    pub THEME_COLOR_INSET_ACTIVE = (THEME_COLOR_INSET_HOVER)
216    pub THEME_COLOR_INSET_FOCUS = (THEME_COLOR_INSET_HOVER)
217    pub THEME_COLOR_INSET_DRAG = (THEME_COLOR_INSET)
218    pub THEME_COLOR_INSET_DISABLED = (THEME_COLOR_D_1)
219    pub THEME_COLOR_INSET_EMPTY = (THEME_COLOR_INSET)
220
221    pub THEME_COLOR_INSET_1 = (THEME_COLOR_D_3)
222    pub THEME_COLOR_INSET_1_HOVER = (THEME_COLOR_INSET_1)
223    pub THEME_COLOR_INSET_1_DOWN = (THEME_COLOR_INSET_1_HOVER)
224    pub THEME_COLOR_INSET_1_ACTIVE = (THEME_COLOR_INSET_1_HOVER)
225    pub THEME_COLOR_INSET_1_FOCUS = (THEME_COLOR_INSET_1_HOVER)
226    pub THEME_COLOR_INSET_1_DRAG = (THEME_COLOR_INSET_1)
227    pub THEME_COLOR_INSET_1_DISABLED = (THEME_COLOR_D_1)
228    pub THEME_COLOR_INSET_1_EMPTY = (THEME_COLOR_INSET_1)
229
230    pub THEME_COLOR_INSET_2 = (THEME_COLOR_D_05)
231    pub THEME_COLOR_INSET_2_HOVER = (THEME_COLOR_INSET_2)
232    pub THEME_COLOR_INSET_2_DOWN = (THEME_COLOR_INSET_2_HOVER)
233    pub THEME_COLOR_INSET_2_ACTIVE = (THEME_COLOR_INSET_2_HOVER)
234    pub THEME_COLOR_INSET_2_FOCUS = (THEME_COLOR_INSET_2_HOVER)
235    pub THEME_COLOR_INSET_2_DRAG = (THEME_COLOR_INSET_2)
236    pub THEME_COLOR_INSET_2_EMPTY = (THEME_COLOR_D_HIDDEN)
237    pub THEME_COLOR_INSET_2_DISABLED = (THEME_COLOR_INSET_2)
238
239    // WIDGET COLORS
240    pub THEME_COLOR_OUTSET = (THEME_COLOR_U_15)
241    pub THEME_COLOR_OUTSET_DOWN = (THEME_COLOR_D_1)
242    pub THEME_COLOR_OUTSET_HOVER = (THEME_COLOR_U_2)
243    pub THEME_COLOR_OUTSET_ACTIVE = (THEME_COLOR_U_3)
244    pub THEME_COLOR_OUTSET_FOCUS = (THEME_COLOR_OUTSET)
245    pub THEME_COLOR_OUTSET_DRAG = (THEME_COLOR_U_2)
246    pub THEME_COLOR_OUTSET_DISABLED = (THEME_COLOR_OUTSET)
247    pub THEME_COLOR_OUTSET_INACTIVE = (THEME_COLOR_D_HIDDEN)
248
249    pub THEME_COLOR_OUTSET_1 = (THEME_COLOR_U_1)
250    pub THEME_COLOR_OUTSET_1_DOWN = (THEME_COLOR_D_2)
251    pub THEME_COLOR_OUTSET_1_DRAG = (THEME_COLOR_OUTSET_1_DOWN)
252    pub THEME_COLOR_OUTSET_1_HOVER = (THEME_COLOR_U_2)
253    pub THEME_COLOR_OUTSET_1_ACTIVE = (THEME_COLOR_U_4)
254    pub THEME_COLOR_OUTSET_1_FOCUS = (THEME_COLOR_OUTSET_1)
255    pub THEME_COLOR_OUTSET_1_DISABLED = (THEME_COLOR_D_HIDDEN)
256
257    pub THEME_COLOR_OUTSET_2 = (THEME_COLOR_D_1)
258    pub THEME_COLOR_OUTSET_2_DOWN = (THEME_COLOR_D_HIDDEN)
259    pub THEME_COLOR_OUTSET_2_DRAG = (THEME_COLOR_OUTSET_2_DOWN)
260    pub THEME_COLOR_OUTSET_2_HOVER = (THEME_COLOR_OUTSET_2)
261    pub THEME_COLOR_OUTSET_2_ACTIVE = (THEME_COLOR_U_1)
262    pub THEME_COLOR_OUTSET_2_FOCUS = (THEME_COLOR_OUTSET_2)
263    pub THEME_COLOR_OUTSET_2_DISABLED = (THEME_COLOR_D_1)
264
265    pub THEME_COLOR_MARK = (THEME_COLOR_U_5)
266    pub THEME_COLOR_MARK_EMPTY = (THEME_COLOR_INSET)
267    pub THEME_COLOR_MARK_OFF = (THEME_COLOR_U_HIDDEN)
268    pub THEME_COLOR_MARK_HOVER = (THEME_COLOR_MARK)
269    pub THEME_COLOR_MARK_ACTIVE = (THEME_COLOR_MARK)
270    pub THEME_COLOR_MARK_ACTIVE_HOVER = (THEME_COLOR_MARK)
271    pub THEME_COLOR_MARK_FOCUS = (THEME_COLOR_MARK)
272    pub THEME_COLOR_MARK_DOWN = (THEME_COLOR_U_4)
273    pub THEME_COLOR_MARK_DISABLED = (THEME_COLOR_U_2)
274
275    pub THEME_COLOR_SELECTION = (THEME_COLOR_D_HIDDEN)
276    pub THEME_COLOR_SELECTION_HOVER = (THEME_COLOR_U_3)
277    pub THEME_COLOR_SELECTION_DOWN = (THEME_COLOR_U_3)
278    pub THEME_COLOR_SELECTION_FOCUS = (THEME_COLOR_U_3)
279    pub THEME_COLOR_SELECTION_EMPTY = (THEME_COLOR_D_HIDDEN)
280    pub THEME_COLOR_SELECTION_DISABLED = (THEME_COLOR_D_HIDDEN)
281
282    // Progress bars, slider amounts etc.
283    pub THEME_COLOR_VAL = (THEME_COLOR_OPAQUE_U_2)
284    pub THEME_COLOR_VAL_HOVER = (THEME_COLOR_OPAQUE_U_3)
285    pub THEME_COLOR_VAL_FOCUS = (THEME_COLOR_OPAQUE_U_3)
286    pub THEME_COLOR_VAL_DRAG = (THEME_COLOR_OPAQUE_U_3)
287    pub THEME_COLOR_VAL_DISABLED = (THEME_COLOR_OPAQUE_U_2)
288
289    pub THEME_COLOR_VAL_1 = (THEME_COLOR_OPAQUE_U_1)
290    pub THEME_COLOR_VAL_1_HOVER = (THEME_COLOR_OPAQUE_U_2)
291    pub THEME_COLOR_VAL_1_FOCUS = (THEME_COLOR_OPAQUE_U_2)
292    pub THEME_COLOR_VAL_1_DRAG = (THEME_COLOR_OPAQUE_U_2)
293    pub THEME_COLOR_VAL_1_DISABLED = (THEME_COLOR_OPAQUE_U_1)
294    
295    pub THEME_COLOR_VAL_2 = (THEME_COLOR_OPAQUE_U_2)
296    pub THEME_COLOR_VAL_2_HOVER = (THEME_COLOR_OPAQUE_U_3)
297    pub THEME_COLOR_VAL_2_FOCUS = (THEME_COLOR_OPAQUE_U_3)
298    pub THEME_COLOR_VAL_2_DRAG = (THEME_COLOR_OPAQUE_U_3)
299    pub THEME_COLOR_VAL_2_DISABLED = (THEME_COLOR_OPAQUE_U_2)
300
301
302    // WIDGET SPECIFIC COLORS
303    pub THEME_COLOR_HANDLE: (THEME_COLOR_OPAQUE_U_3);
304    pub THEME_COLOR_HANDLE_HOVER: (THEME_COLOR_OPAQUE_U_4);
305    pub THEME_COLOR_HANDLE_FOCUS: (THEME_COLOR_OPAQUE_U_3);
306    pub THEME_COLOR_HANDLE_DISABLED: (THEME_COLOR_OPAQUE_U_1);
307    pub THEME_COLOR_HANDLE_DRAG: (THEME_COLOR_OPAQUE_U_5);
308
309    pub THEME_COLOR_HANDLE_1: (THEME_COLOR_OPAQUE_U_1);
310    pub THEME_COLOR_HANDLE_1_HOVER: (THEME_COLOR_OPAQUE_U_2);
311    pub THEME_COLOR_HANDLE_1_FOCUS: (THEME_COLOR_OPAQUE_U_2);
312    pub THEME_COLOR_HANDLE_1_DISABLED: (THEME_COLOR_OPAQUE_D_1);
313    pub THEME_COLOR_HANDLE_1_DRAG: (THEME_COLOR_OPAQUE_U_2);
314
315    pub THEME_COLOR_HANDLE_2: (THEME_COLOR_OPAQUE_D_5);
316    pub THEME_COLOR_HANDLE_2_HOVER: (THEME_COLOR_OPAQUE_D_5);
317    pub THEME_COLOR_HANDLE_2_FOCUS: (THEME_COLOR_OPAQUE_D_5);
318    pub THEME_COLOR_HANDLE_2_DISABLED: (THEME_COLOR_OPAQUE_D_3);
319    pub THEME_COLOR_HANDLE_2_DRAG: (THEME_COLOR_OPAQUE_D_5);
320
321    pub THEME_COLOR_DOCK_TAB_ACTIVE = (THEME_COLOR_FG_APP)
322
323    // TODO: THESE ARE APPLICATION SPECIFIC COLORS THAT SHOULD BE MOVED FROM THE GENERAL THEME TO THE GIVEN PROJECT
324    pub THEME_COLOR_HIGH = #C00
325    pub THEME_COLOR_MID = #FA0
326    pub THEME_COLOR_LOW = #8A0
327    pub THEME_COLOR_PANIC = #f0f
328    pub THEME_COLOR_ICON_WAIT = (THEME_COLOR_LOW),
329    pub THEME_COLOR_ERROR = (THEME_COLOR_HIGH),
330    pub THEME_COLOR_WARNING = (THEME_COLOR_MID),
331    pub THEME_COLOR_ICON_PANIC = (THEME_COLOR_HIGH)
332
333    // TYPOGRAPHY
334    pub THEME_FONT_SIZE_CODE = 9.0
335    pub THEME_FONT_WDGT_LINE_SPACING = 1.2
336    pub THEME_FONT_HL_LINE_SPACING = 1.05
337    pub THEME_FONT_LONGFORM_LINE_SPACING = 1.2
338
339    pub THEME_FONT_SIZE_1 = (THEME_FONT_SIZE_BASE + 8 * THEME_FONT_SIZE_CONTRAST)
340    pub THEME_FONT_SIZE_2 = (THEME_FONT_SIZE_BASE + 4 * THEME_FONT_SIZE_CONTRAST)
341    pub THEME_FONT_SIZE_3 = (THEME_FONT_SIZE_BASE + 2 * THEME_FONT_SIZE_CONTRAST)
342    pub THEME_FONT_SIZE_4 = (THEME_FONT_SIZE_BASE + 1 * THEME_FONT_SIZE_CONTRAST)
343    pub THEME_FONT_SIZE_P = (THEME_FONT_SIZE_BASE)
344
345    pub THEME_FONT_LABEL = {
346        font_family:{
347            latin = font("crate://self/resources/IBMPlexSans-Text.ttf", -0.1, 0.0),
348            chinese = font(
349                "crate://makepad_fonts_chinese_regular/resources/LXGWWenKaiRegular.ttf",
350                "crate://makepad_fonts_chinese_regular_2/resources/LXGWWenKaiRegular.ttf.2",
351                0.0, 
352                0.0)
353            emoji = font("crate://makepad_fonts_emoji/resources/NotoColorEmoji.ttf", 0.0, 0.0)
354        },
355        line_spacing: 1.2
356    } // TODO: LEGACY, REMOVE. REQUIRED BY RUN LIST IN STUDIO ATM
357    pub THEME_FONT_REGULAR = {
358        font_family: {
359            latin = font("crate://self/resources/IBMPlexSans-Text.ttf", -0.1, 0.0),
360            chinese = font(
361                "crate://makepad_fonts_chinese_regular/resources/LXGWWenKaiRegular.ttf",
362                "crate://makepad_fonts_chinese_regular_2/resources/LXGWWenKaiRegular.ttf.2",
363                0.0, 
364                0.0)
365            emoji = font("crate://makepad_fonts_emoji/resources/NotoColorEmoji.ttf", 0.0, 0.0)
366        },
367        line_spacing: 1.2
368    }
369    pub THEME_FONT_BOLD = {
370        font_family:{
371            latin = font("crate://self/resources/IBMPlexSans-SemiBold.ttf", -0.1, 0.0),
372            chinese = font(
373                "crate://makepad_fonts_chinese_bold/resources/LXGWWenKaiBold.ttf",
374                "crate://makepad_fonts_chinese_bold_2/resources/LXGWWenKaiBold.ttf.2",
375                0.0, 
376                0.0)
377            emoji = font("crate://makepad_fonts_emoji/resources/NotoColorEmoji.ttf", 0.0, 0.0)
378        },
379        line_spacing: 1.2
380    }
381    pub THEME_FONT_ITALIC = {
382        font_family:{
383            latin = font("crate://self/resources/IBMPlexSans-Italic.ttf", -0.1, 0.0),
384            chinese = font(
385                "crate://makepad_fonts_chinese_regular/resources/LXGWWenKaiRegular.ttf",
386                "crate://makepad_fonts_chinese_regular_2/resources/LXGWWenKaiRegular.ttf.2",
387                0.0, 
388                0.0)
389        },
390        line_spacing: 1.2
391    }
392    pub THEME_FONT_BOLD_ITALIC = {
393        font_family:{
394            latin = font("crate://self/resources/IBMPlexSans-BoldItalic.ttf", -0.1, 0.0),
395            chinese = font(
396                "crate://makepad_fonts_chinese_bold/resources/LXGWWenKaiBold.ttf",
397                "crate://makepad_fonts_chinese_bold_2/resources/LXGWWenKaiBold.ttf.2",
398                0.0, 
399                0.0)
400        },
401        line_spacing: 1.2
402    }
403    pub THEME_FONT_CODE = {
404        font_size: (THEME_FONT_SIZE_CODE),
405        font_family:{
406            latin = font("crate://self/resources/LiberationMono-Regular.ttf", 0.0, 0.0)
407        },
408        line_spacing: 1.35
409    }
410    pub THEME_FONT_ICONS = {
411        font_family:{
412            latin = font("crate://self/resources/fa-solid-900.ttf", 0.0, 0.0)
413        },
414        line_spacing: 1.2,
415    }
416}