Add new colors to themes

Nate Butler and Marshall Bowers created 2 years ago

Co-Authored-By: Marshall Bowers <[e-mail]>

Change summary

crates/theme2/src/default_colors.rs | 216 ++++++++++++++++++------------
crates/theme2/src/default_theme.rs  |  32 ++++
crates/theme2/src/prelude.rs        |   6 
crates/theme2/src/registry.rs       |   1 
crates/theme2/src/theme2.rs         |   1 
5 files changed, 166 insertions(+), 90 deletions(-)

Detailed changes

crates/theme2/src/default_colors.rs

@@ -13,73 +13,91 @@ impl ThemeColors {
         let system = SystemColors::default();
 
         Self {
+            background: neutral().light().step_1(),
             border: neutral().light().step_6(),
-            border_variant: neutral().light().step_5(),
-            border_focused: blue().light().step_5(),
             border_disabled: neutral().light().step_3(),
+            border_focused: blue().light().step_5(),
             border_selected: blue().light().step_5(),
             border_transparent: system.transparent,
-            elevated_surface_background: neutral().light().step_2(),
-            surface_background: neutral().light().step_2(),
-            background: neutral().light().step_1(),
+            border_variant: neutral().light().step_5(),
+            code_block_background: gpui::transparent_black(),
+            code_block_border: gpui::transparent_black(),
+            drop_target_background: blue().light_alpha().step_2(),
+            editor_active_line_background: neutral().light_alpha().step_3(),
+            editor_active_line_number: neutral().light().step_11(),
+            editor_active_wrap_guide: neutral().light_alpha().step_8(), // todo!("pick the right colors")
+            editor_foreground: neutral().light().step_12(),
+            editor_background: neutral().light().step_1(),
+            editor_document_highlight_read_background: neutral().light_alpha().step_3(), // todo!("pick the right colors")
+            editor_document_highlight_write_background: neutral().light_alpha().step_4(), // todo!("pick the right colors")
+            editor_gutter_background: neutral().light().step_1(), // todo!("pick the right colors")
+            editor_highlighted_line_background: neutral().light_alpha().step_3(),
+            editor_invisible: neutral().light().step_10(),
+            editor_line_number: neutral().light().step_10(),
+            editor_subheader_background: neutral().light().step_2(),
+            editor_wrap_guide: neutral().light_alpha().step_7(),
+            element_active: neutral().light_alpha().step_5(),
             element_background: neutral().light().step_3(),
+            element_disabled: neutral().light_alpha().step_3(),
             element_hover: neutral().light_alpha().step_4(),
-            element_active: neutral().light_alpha().step_5(),
             element_selected: neutral().light_alpha().step_5(),
-            element_disabled: neutral().light_alpha().step_3(),
-            drop_target_background: blue().light_alpha().step_2(),
+            elevated_surface_background: neutral().light().step_2(),
+            emphasis: neutral().light().step_12(),
+            ghost_element_active: neutral().light_alpha().step_4(),
             ghost_element_background: system.transparent,
+            ghost_element_disabled: neutral().light_alpha().step_3(),
             ghost_element_hover: neutral().light_alpha().step_3(),
-            ghost_element_active: neutral().light_alpha().step_4(),
             ghost_element_selected: neutral().light_alpha().step_5(),
-            ghost_element_disabled: neutral().light_alpha().step_3(),
-            text: neutral().light().step_12(),
-            text_muted: neutral().light().step_10(),
-            text_placeholder: neutral().light().step_10(),
-            text_disabled: neutral().light().step_9(),
-            text_accent: blue().light().step_11(),
+            headline: blue().light().step_9(),
             icon: neutral().light().step_11(),
-            icon_muted: neutral().light().step_10(),
+            icon_accent: blue().light().step_11(),
             icon_disabled: neutral().light().step_9(),
+            icon_muted: neutral().light().step_10(),
             icon_placeholder: neutral().light().step_10(),
-            icon_accent: blue().light().step_11(),
+            inline_code_background: gpui::transparent_black(),
+            inline_code_border: gpui::transparent_black(),
+            link_text: orange().light().step_9(),
+            link_text_hover: orange().light().step_10(),
+            link_uri: green().light().step_9(),
+            pane_focused_border: blue().light().step_5(),
+            panel_background: neutral().light().step_2(),
+            panel_focused_border: blue().light().step_5(),
+            paragraph: neutral().light().step_12(),
+            scrollbar_thumb_background: neutral().light_alpha().step_3(),
+            scrollbar_thumb_border: gpui::transparent_black(),
+            scrollbar_thumb_hover_background: neutral().light_alpha().step_4(),
+            scrollbar_track_background: gpui::transparent_black(),
+            scrollbar_track_border: neutral().light().step_5(),
+            search_match_background: neutral().light().step_2(), // todo!(this was inserted by Mikayla)
             status_bar_background: neutral().light().step_2(),
-            title_bar_background: neutral().light().step_2(),
-            toolbar_background: neutral().light().step_1(),
-            tab_bar_background: neutral().light().step_2(),
+            surface_background: neutral().light().step_2(),
             tab_active_background: neutral().light().step_1(),
+            tab_bar_background: neutral().light().step_2(),
             tab_inactive_background: neutral().light().step_2(),
-            search_match_background: neutral().light().step_2(), // todo!(this was inserted by Mikayla)
-
-            editor_background: neutral().light().step_1(),
-            editor_gutter_background: neutral().light().step_1(), // todo!("pick the right colors")
-            editor_subheader_background: neutral().light().step_2(),
-            editor_active_line_background: neutral().light_alpha().step_3(),
-            editor_line_number: neutral().light().step_10(),
-            editor_active_line_number: neutral().light().step_11(),
-            editor_highlighted_line_background: neutral().light_alpha().step_3(),
-            editor_invisible: neutral().light().step_10(),
-            editor_wrap_guide: neutral().light_alpha().step_7(),
-            editor_active_wrap_guide: neutral().light_alpha().step_8(), // todo!("pick the right colors")
-            editor_document_highlight_read_background: neutral().light_alpha().step_3(), // todo!("pick the right colors")
-            editor_document_highlight_write_background: neutral().light_alpha().step_4(), // todo!("pick the right colors")
-            terminal_background: neutral().light().step_1(),
             terminal_ansi_black: black().light().step_12(),
-            terminal_ansi_red: red().light().step_11(),
-            terminal_ansi_green: green().light().step_11(),
-            terminal_ansi_yellow: yellow().light().step_11(),
             terminal_ansi_blue: blue().light().step_11(),
-            terminal_ansi_magenta: violet().light().step_11(),
-            terminal_ansi_cyan: cyan().light().step_11(),
-            terminal_ansi_white: neutral().light().step_12(),
             terminal_ansi_bright_black: black().light().step_11(),
-            terminal_ansi_bright_red: red().light().step_10(),
-            terminal_ansi_bright_green: green().light().step_10(),
-            terminal_ansi_bright_yellow: yellow().light().step_10(),
             terminal_ansi_bright_blue: blue().light().step_10(),
-            terminal_ansi_bright_magenta: violet().light().step_10(),
             terminal_ansi_bright_cyan: cyan().light().step_10(),
+            terminal_ansi_bright_green: green().light().step_10(),
+            terminal_ansi_bright_magenta: violet().light().step_10(),
+            terminal_ansi_bright_red: red().light().step_10(),
             terminal_ansi_bright_white: neutral().light().step_11(),
+            terminal_ansi_bright_yellow: yellow().light().step_10(),
+            terminal_ansi_cyan: cyan().light().step_11(),
+            terminal_ansi_green: green().light().step_11(),
+            terminal_ansi_magenta: violet().light().step_11(),
+            terminal_ansi_red: red().light().step_11(),
+            terminal_ansi_white: neutral().light().step_12(),
+            terminal_ansi_yellow: yellow().light().step_11(),
+            terminal_background: neutral().light().step_1(),
+            text: neutral().light().step_12(),
+            text_accent: blue().light().step_11(),
+            text_disabled: neutral().light().step_9(),
+            text_muted: neutral().light().step_10(),
+            text_placeholder: neutral().light().step_10(),
+            title_bar_background: neutral().light().step_2(),
+            toolbar_background: neutral().light().step_1(),
         }
     }
 
@@ -87,73 +105,91 @@ impl ThemeColors {
         let system = SystemColors::default();
 
         Self {
+            background: neutral().dark().step_1(),
             border: neutral().dark().step_6(),
-            border_variant: neutral().dark().step_5(),
-            border_focused: blue().dark().step_5(),
             border_disabled: neutral().dark().step_3(),
+            border_focused: blue().dark().step_5(),
             border_selected: blue().dark().step_5(),
             border_transparent: system.transparent,
-            elevated_surface_background: neutral().dark().step_2(),
-            surface_background: neutral().dark().step_2(),
-            background: neutral().dark().step_1(),
+            border_variant: neutral().dark().step_5(),
+            code_block_background: gpui::transparent_black(),
+            code_block_border: gpui::transparent_black(),
+            drop_target_background: blue().dark_alpha().step_2(),
+            editor_active_line_background: neutral().dark_alpha().step_3(),
+            editor_active_line_number: neutral().dark_alpha().step_12(),
+            editor_active_wrap_guide: neutral().dark_alpha().step_4(), // todo!("pick the right colors")
+            editor_background: neutral().dark().step_1(),
+            editor_document_highlight_read_background: neutral().dark_alpha().step_4(), // todo!("pick the right colors")
+            editor_document_highlight_write_background: neutral().dark_alpha().step_4(), // todo!("pick the right colors")
+            editor_foreground: neutral().dark().step_12(),
+            editor_gutter_background: neutral().dark().step_1(),
+            editor_highlighted_line_background: neutral().dark_alpha().step_4(), // todo!("pick the right colors")
+            editor_invisible: neutral().dark_alpha().step_4(), // todo!("pick the right colors")
+            editor_line_number: neutral().dark_alpha().step_10(),
+            editor_subheader_background: neutral().dark().step_3(),
+            editor_wrap_guide: neutral().dark_alpha().step_4(), // todo!("pick the right colors")
+            element_active: neutral().dark_alpha().step_5(),
             element_background: neutral().dark().step_3(),
+            element_disabled: neutral().dark_alpha().step_3(),
             element_hover: neutral().dark_alpha().step_4(),
-            element_active: neutral().dark_alpha().step_5(),
             element_selected: neutral().dark_alpha().step_5(),
-            element_disabled: neutral().dark_alpha().step_3(),
-            drop_target_background: blue().dark_alpha().step_2(),
+            elevated_surface_background: neutral().dark().step_2(),
+            emphasis: neutral().dark().step_12(),
+            ghost_element_active: neutral().dark_alpha().step_5(),
             ghost_element_background: system.transparent,
+            ghost_element_disabled: neutral().dark_alpha().step_3(),
             ghost_element_hover: neutral().dark_alpha().step_4(),
-            ghost_element_active: neutral().dark_alpha().step_5(),
             ghost_element_selected: neutral().dark_alpha().step_5(),
-            ghost_element_disabled: neutral().dark_alpha().step_3(),
-            text: neutral().dark().step_12(),
-            text_muted: neutral().dark().step_11(),
-            text_placeholder: neutral().dark().step_10(),
-            text_disabled: neutral().dark().step_9(),
-            text_accent: blue().dark().step_11(),
+            headline: blue().dark().step_9(),
             icon: neutral().dark().step_11(),
-            icon_muted: neutral().dark().step_10(),
+            icon_accent: blue().dark().step_11(),
             icon_disabled: neutral().dark().step_9(),
+            icon_muted: neutral().dark().step_10(),
             icon_placeholder: neutral().dark().step_10(),
-            icon_accent: blue().dark().step_11(),
+            inline_code_background: gpui::transparent_black(),
+            inline_code_border: gpui::transparent_black(),
+            link_text: orange().dark().step_9(),
+            link_text_hover: orange().dark().step_10(),
+            link_uri: green().dark().step_9(),
+            pane_focused_border: blue().dark().step_5(),
+            panel_background: neutral().dark().step_2(),
+            panel_focused_border: blue().dark().step_5(),
+            paragraph: neutral().dark().step_12(),
+            scrollbar_thumb_background: neutral().dark_alpha().step_3(),
+            scrollbar_thumb_border: gpui::transparent_black(),
+            scrollbar_thumb_hover_background: neutral().dark_alpha().step_4(),
+            scrollbar_track_background: gpui::transparent_black(),
+            scrollbar_track_border: neutral().dark().step_5(),
+            search_match_background: neutral().dark().step_2(), // todo!(this was inserted by Mikayla)
             status_bar_background: neutral().dark().step_2(),
-            title_bar_background: neutral().dark().step_2(),
-            toolbar_background: neutral().dark().step_1(),
-            tab_bar_background: neutral().dark().step_2(),
+            surface_background: neutral().dark().step_2(),
             tab_active_background: neutral().dark().step_1(),
+            tab_bar_background: neutral().dark().step_2(),
             tab_inactive_background: neutral().dark().step_2(),
-            search_match_background: neutral().dark().step_2(), // todo!(this was inserted by Mikayla)
-
-            editor_background: neutral().dark().step_1(),
-            editor_gutter_background: neutral().dark().step_1(),
-            editor_subheader_background: neutral().dark().step_3(),
-            editor_active_line_background: neutral().dark_alpha().step_3(),
-            editor_line_number: neutral().dark_alpha().step_10(),
-            editor_active_line_number: neutral().dark_alpha().step_12(),
-            editor_highlighted_line_background: neutral().dark_alpha().step_4(), // todo!("pick the right colors")
-            editor_invisible: neutral().dark_alpha().step_4(), // todo!("pick the right colors")
-            editor_wrap_guide: neutral().dark_alpha().step_4(), // todo!("pick the right colors")
-            editor_active_wrap_guide: neutral().dark_alpha().step_4(), // todo!("pick the right colors")
-            editor_document_highlight_read_background: neutral().dark_alpha().step_4(), // todo!("pick the right colors")
-            editor_document_highlight_write_background: neutral().dark_alpha().step_4(), // todo!("pick the right colors")
-            terminal_background: neutral().dark().step_1(),
             terminal_ansi_black: black().dark().step_12(),
-            terminal_ansi_red: red().dark().step_11(),
-            terminal_ansi_green: green().dark().step_11(),
-            terminal_ansi_yellow: yellow().dark().step_11(),
             terminal_ansi_blue: blue().dark().step_11(),
-            terminal_ansi_magenta: violet().dark().step_11(),
-            terminal_ansi_cyan: cyan().dark().step_11(),
-            terminal_ansi_white: neutral().dark().step_12(),
             terminal_ansi_bright_black: black().dark().step_11(),
-            terminal_ansi_bright_red: red().dark().step_10(),
-            terminal_ansi_bright_green: green().dark().step_10(),
-            terminal_ansi_bright_yellow: yellow().dark().step_10(),
             terminal_ansi_bright_blue: blue().dark().step_10(),
-            terminal_ansi_bright_magenta: violet().dark().step_10(),
             terminal_ansi_bright_cyan: cyan().dark().step_10(),
+            terminal_ansi_bright_green: green().dark().step_10(),
+            terminal_ansi_bright_magenta: violet().dark().step_10(),
+            terminal_ansi_bright_red: red().dark().step_10(),
             terminal_ansi_bright_white: neutral().dark().step_11(),
+            terminal_ansi_bright_yellow: yellow().dark().step_10(),
+            terminal_ansi_cyan: cyan().dark().step_11(),
+            terminal_ansi_green: green().dark().step_11(),
+            terminal_ansi_magenta: violet().dark().step_11(),
+            terminal_ansi_red: red().dark().step_11(),
+            terminal_ansi_white: neutral().dark().step_12(),
+            terminal_ansi_yellow: yellow().dark().step_11(),
+            terminal_background: neutral().dark().step_1(),
+            text: neutral().dark().step_12(),
+            text_accent: blue().dark().step_11(),
+            text_disabled: neutral().dark().step_9(),
+            text_muted: neutral().dark().step_11(),
+            text_placeholder: neutral().dark().step_10(),
+            title_bar_background: neutral().dark().step_2(),
+            toolbar_background: neutral().dark().step_1(),
         }
     }
 }

crates/theme2/src/default_theme.rs

@@ -1,5 +1,7 @@
 use std::sync::Arc;
 
+use crate::prelude::*;
+
 use crate::{
     default_color_scales,
     one_themes::{one_dark, one_family},
@@ -18,6 +20,21 @@ fn zed_pro_daylight() -> Theme {
             status: StatusColors::light(),
             player: PlayerColors::light(),
             syntax: Arc::new(SyntaxTheme::light()),
+            accents: vec![
+                blue().light().step_9(),
+                orange().light().step_9(),
+                pink().light().step_9(),
+                lime().light().step_9(),
+                purple().light().step_9(),
+                amber().light().step_9(),
+                jade().light().step_9(),
+                tomato().light().step_9(),
+                cyan().light().step_9(),
+                gold().light().step_9(),
+                grass().light().step_9(),
+                indigo().light().step_9(),
+                iris().light().step_9(),
+            ],
         },
     }
 }
@@ -33,6 +50,21 @@ pub(crate) fn zed_pro_moonlight() -> Theme {
             status: StatusColors::dark(),
             player: PlayerColors::dark(),
             syntax: Arc::new(SyntaxTheme::dark()),
+            accents: vec![
+                blue().dark().step_9(),
+                orange().dark().step_9(),
+                pink().dark().step_9(),
+                lime().dark().step_9(),
+                purple().dark().step_9(),
+                amber().dark().step_9(),
+                jade().dark().step_9(),
+                tomato().dark().step_9(),
+                cyan().dark().step_9(),
+                gold().dark().step_9(),
+                grass().dark().step_9(),
+                indigo().dark().step_9(),
+                iris().dark().step_9(),
+            ],
         },
     }
 }

crates/theme2/src/prelude.rs

@@ -0,0 +1,6 @@
+#[allow(unused)]
+pub(crate) use crate::default_colors::{
+    amber, black, blue, bronze, brown, crimson, cyan, gold, grass, gray, green, indigo, iris, jade,
+    lime, mauve, mint, olive, orange, pink, plum, purple, red, ruby, sage, sand, sky, slate, teal,
+    tomato, violet, white, yellow,
+};

crates/theme2/src/registry.rs

@@ -87,6 +87,7 @@ impl ThemeRegistry {
                         Appearance::Dark => PlayerColors::dark(),
                     },
                     syntax: Arc::new(syntax_colors),
+                    accents: Vec::new(),
                 },
             }
         }));

crates/theme2/src/theme2.rs

@@ -1,6 +1,7 @@
 mod default_colors;
 mod default_theme;
 mod one_themes;
+pub mod prelude;
 mod registry;
 mod scale;
 mod settings;