colors.rs

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