1use crate::{PlayerColors, SyntaxTheme};
2use gpui::Hsla;
3use refineable::Refineable;
4use std::sync::Arc;
5
6#[derive(Clone)]
7pub struct SystemColors {
8 pub transparent: Hsla,
9 pub mac_os_traffic_light_red: Hsla,
10 pub mac_os_traffic_light_yellow: Hsla,
11 pub mac_os_traffic_light_green: Hsla,
12}
13
14#[derive(Refineable, Clone, Debug)]
15#[refineable(Debug, serde::Deserialize)]
16pub struct StatusColors {
17 pub conflict: Hsla,
18 pub created: Hsla,
19 pub deleted: Hsla,
20 pub error: Hsla,
21 pub hidden: Hsla,
22 pub ignored: Hsla,
23 pub info: Hsla,
24 pub modified: Hsla,
25 pub renamed: Hsla,
26 pub success: Hsla,
27 pub warning: Hsla,
28}
29
30#[derive(Refineable, Clone, Debug)]
31#[refineable(Debug, serde::Deserialize)]
32pub struct ThemeColors {
33 pub border: Hsla,
34 /// Border color. Used for deemphasized borders, like a visual divider between two sections
35 pub border_variant: Hsla,
36 /// Border color. Used for focused elements, like keyboard focused list item.
37 pub border_focused: Hsla,
38 /// Border color. Used for selected elements, like an active search filter or selected checkbox.
39 pub border_selected: Hsla,
40 /// Border color. Used for transparent borders. Used for placeholder borders when an element gains a border on state change.
41 pub border_transparent: Hsla,
42 /// Border color. Used for disabled elements, like a disabled input or button.
43 pub border_disabled: Hsla,
44 /// Border color. Used for elevated surfaces, like a context menu, popup, or dialog.
45 pub elevated_surface_background: Hsla,
46 /// Background Color. Used for grounded surfaces like a panel or tab.
47 pub surface_background: Hsla,
48 /// Background Color. Used for the app background and blank panels or windows.
49 pub background: Hsla,
50 /// Background Color. Used for the background of an element that should have a different background than the surface it's on.
51 ///
52 /// Elements might include: Buttons, Inputs, Checkboxes, Radio Buttons...
53 ///
54 /// For an element that should have the same background as the surface it's on, use `ghost_element_background`.
55 pub element_background: Hsla,
56 /// Background Color. Used for the hover state of an element that should have a different background than the surface it's on.
57 ///
58 /// Hover states are triggered by the mouse entering an element, or a finger touching an element on a touch screen.
59 pub element_hover: Hsla,
60 /// Background Color. Used for the active state of an element that should have a different background than the surface it's on.
61 ///
62 /// Active states are triggered by the mouse button being pressed down on an element, or the Return button or other activator being pressd.
63 pub element_active: Hsla,
64 /// Background Color. Used for the selected state of an element that should have a different background than the surface it's on.
65 ///
66 /// Selected states are triggered by the element being selected (or "activated") by the user.
67 ///
68 /// This could include a selected checkbox, a toggleable button that is toggled on, etc.
69 pub element_selected: Hsla,
70 /// Background Color. Used for the disabled state of an element that should have a different background than the surface it's on.
71 ///
72 /// Disabled states are shown when a user cannot interact with an element, like a disabled button or input.
73 pub element_disabled: Hsla,
74 /// Background Color. Used for the area that shows where a dragged element will be dropped.
75 pub drop_target_background: Hsla,
76 /// Border Color. Used to show the area that shows where a dragged element will be dropped.
77 // pub drop_target_border: Hsla,
78 /// Used for the background of a ghost element that should have the same background as the surface it's on.
79 ///
80 /// Elements might include: Buttons, Inputs, Checkboxes, Radio Buttons...
81 ///
82 /// For an element that should have a different background than the surface it's on, use `element_background`.
83 pub ghost_element_background: Hsla,
84 /// Background Color. Used for the hover state of a ghost element that should have the same background as the surface it's on.
85 ///
86 /// Hover states are triggered by the mouse entering an element, or a finger touching an element on a touch screen.
87 pub ghost_element_hover: Hsla,
88 /// Background Color. Used for the active state of a ghost element that should have the same background as the surface it's on.
89 ///
90 /// Active states are triggered by the mouse button being pressed down on an element, or the Return button or other activator being pressd.
91 pub ghost_element_active: Hsla,
92 /// Background Color. Used for the selected state of a ghost element that should have the same background as the surface it's on.
93 ///
94 /// Selected states are triggered by the element being selected (or "activated") by the user.
95 ///
96 /// This could include a selected checkbox, a toggleable button that is toggled on, etc.
97 pub ghost_element_selected: Hsla,
98 /// Background Color. Used for the disabled state of a ghost element that should have the same background as the surface it's on.
99 ///
100 /// Disabled states are shown when a user cannot interact with an element, like a disabled button or input.
101 pub ghost_element_disabled: Hsla,
102 /// Text Color. Default text color used for most text.
103 pub text: Hsla,
104 /// Text Color. Color of muted or deemphasized text. It is a subdued version of the standard text color.
105 pub text_muted: Hsla,
106 /// Text Color. Color of the placeholder text typically shown in input fields to guide the user to enter valid data.
107 pub text_placeholder: Hsla,
108 /// Text Color. Color used for text denoting disabled elements. Typically, the color is faded or grayed out to emphasize the disabled state.
109 pub text_disabled: Hsla,
110 /// Text Color. Color used for emphasis or highlighting certain text, like an active filter or a matched character in a search.
111 pub text_accent: Hsla,
112 /// Fill Color. Used for the default fill color of an icon.
113 pub icon: Hsla,
114 /// Fill Color. Used for the muted or deemphasized fill color of an icon.
115 ///
116 /// This might be used to show an icon in an inactive pane, or to demphasize a series of icons to give them less visual weight.
117 pub icon_muted: Hsla,
118 /// Fill Color. Used for the disabled fill color of an icon.
119 ///
120 /// Disabled states are shown when a user cannot interact with an element, like a icon button.
121 pub icon_disabled: Hsla,
122 /// Fill Color. Used for the placeholder fill color of an icon.
123 ///
124 /// This might be used to show an icon in an input that disappears when the user enters text.
125 pub icon_placeholder: Hsla,
126 /// Fill Color. Used for the accent fill color of an icon.
127 ///
128 /// This might be used to show when a toggleable icon button is selected.
129 pub icon_accent: Hsla,
130
131 // ===
132 // UI Elements
133 // ===
134 pub status_bar_background: Hsla,
135 pub title_bar_background: Hsla,
136 pub toolbar_background: Hsla,
137 pub tab_bar_background: Hsla,
138 pub tab_inactive_background: Hsla,
139 pub tab_active_background: Hsla,
140 // pub panel_background: Hsla,
141 // pub pane_focused_border: Hsla,
142 // /// The color of the scrollbar thumb.
143 // pub scrollbar_thumb_background: Hsla,
144 // /// The color of the scrollbar thumb when hovered over.
145 // pub scrollbar_thumb_hover_background: Hsla,
146 // /// The border color of the scrollbar thumb.
147 // pub scrollbar_thumb_border: Hsla,
148 // /// The background color of the scrollbar track.
149 // pub scrollbar_track_background: Hsla,
150 // /// The border color of the scrollbar track.
151 // pub scrollbar_track_border: Hsla,
152 // /// The opacity of the scrollbar status marks, like diagnostic states and git status..
153 // pub scrollbar_status_opacity: Hsla,
154
155 // ===
156 // Editor
157 // ===
158 pub editor_background: Hsla,
159 // pub editor_inactive_background: Hsla,
160 pub editor_gutter_background: Hsla,
161 pub editor_subheader_background: Hsla,
162 pub editor_active_line_background: Hsla,
163 pub editor_highlighted_line_background: Hsla,
164 /// Text Color. Used for the text of the line number in the editor gutter.
165 pub editor_line_number: Hsla,
166 /// Text Color. Used for the text of the line number in the editor gutter when the line is highlighted.
167 pub editor_active_line_number: Hsla,
168 /// Text Color. Used to mark invisible characters in the editor.
169 ///
170 /// Example: spaces, tabs, carriage returns, etc.
171 pub editor_invisible: Hsla,
172 pub editor_wrap_guide: Hsla,
173 pub editor_active_wrap_guide: Hsla,
174 pub editor_document_highlight_read_background: Hsla,
175 pub editor_document_highlight_write_background: Hsla,
176
177 // ===
178 // Terminal
179 // ===
180 /// Terminal Background Color
181 pub terminal_background: Hsla,
182 /// Bright Black Color for ANSI Terminal
183 pub terminal_ansi_bright_black: Hsla,
184 /// Bright Red Color for ANSI Terminal
185 pub terminal_ansi_bright_red: Hsla,
186 /// Bright Green Color for ANSI Terminal
187 pub terminal_ansi_bright_green: Hsla,
188 /// Bright Yellow Color for ANSI Terminal
189 pub terminal_ansi_bright_yellow: Hsla,
190 /// Bright Blue Color for ANSI Terminal
191 pub terminal_ansi_bright_blue: Hsla,
192 /// Bright Magenta Color for ANSI Terminal
193 pub terminal_ansi_bright_magenta: Hsla,
194 /// Bright Cyan Color for ANSI Terminal
195 pub terminal_ansi_bright_cyan: Hsla,
196 /// Bright White Color for ANSI Terminal
197 pub terminal_ansi_bright_white: Hsla,
198 /// Black Color for ANSI Terminal
199 pub terminal_ansi_black: Hsla,
200 /// Red Color for ANSI Terminal
201 pub terminal_ansi_red: Hsla,
202 /// Green Color for ANSI Terminal
203 pub terminal_ansi_green: Hsla,
204 /// Yellow Color for ANSI Terminal
205 pub terminal_ansi_yellow: Hsla,
206 /// Blue Color for ANSI Terminal
207 pub terminal_ansi_blue: Hsla,
208 /// Magenta Color for ANSI Terminal
209 pub terminal_ansi_magenta: Hsla,
210 /// Cyan Color for ANSI Terminal
211 pub terminal_ansi_cyan: Hsla,
212 /// White Color for ANSI Terminal
213 pub terminal_ansi_white: Hsla,
214 // new colors
215
216 // ===
217 // Elevation
218 // ===
219 // elevation_0_shadow
220 // elevation_0_shadow_color
221 // elevation_1_shadow
222 // elevation_1_shadow_color
223 // elevation_2_shadow
224 // elevation_2_shadow_color
225 // elevation_3_shadow
226 // elevation_3_shadow_color
227 // elevation_4_shadow
228 // elevation_4_shadow_color
229 // elevation_5_shadow
230 // elevation_5_shadow_color
231
232 // ===
233 // UI Text
234 // ===
235 // pub headline: Hsla,
236 // pub paragraph: Hsla,
237 // pub link: Hsla,
238 // pub link_hover: Hsla,
239 // pub code_block_background: Hsla,
240 // pub code_block_border: Hsla,
241}
242
243#[derive(Refineable, Clone)]
244pub struct ThemeStyles {
245 pub system: SystemColors,
246
247 #[refineable]
248 pub colors: ThemeColors,
249 pub status: StatusColors,
250 pub player: PlayerColors,
251 pub syntax: Arc<SyntaxTheme>,
252}
253
254#[cfg(test)]
255mod tests {
256 use serde_json::json;
257
258 use super::*;
259
260 #[test]
261 fn override_a_single_theme_color() {
262 let mut colors = ThemeColors::default_light();
263
264 let magenta: Hsla = gpui::rgb(0xff00ff);
265
266 assert_ne!(colors.text, magenta);
267
268 let overrides = ThemeColorsRefinement {
269 text: Some(magenta),
270 ..Default::default()
271 };
272
273 colors.refine(&overrides);
274
275 assert_eq!(colors.text, magenta);
276 }
277
278 #[test]
279 fn override_multiple_theme_colors() {
280 let mut colors = ThemeColors::default_light();
281
282 let magenta: Hsla = gpui::rgb(0xff00ff);
283 let green: Hsla = gpui::rgb(0x00ff00);
284
285 assert_ne!(colors.text, magenta);
286 assert_ne!(colors.background, green);
287
288 let overrides = ThemeColorsRefinement {
289 text: Some(magenta),
290 background: Some(green),
291 ..Default::default()
292 };
293
294 colors.refine(&overrides);
295
296 assert_eq!(colors.text, magenta);
297 assert_eq!(colors.background, green);
298 }
299
300 #[test]
301 fn deserialize_theme_colors_refinement_from_json() {
302 let colors: ThemeColorsRefinement = serde_json::from_value(json!({
303 "background": "#ff00ff",
304 "text": "#ff0000"
305 }))
306 .unwrap();
307
308 assert_eq!(colors.background, Some(gpui::rgb(0xff00ff)));
309 assert_eq!(colors.text, Some(gpui::rgb(0xff0000)));
310 }
311}