Add terminal colors to ThemeColors, add _background
to some color names.
This commit is contained in:
parent
95a0827517
commit
2b0c959137
28 changed files with 224 additions and 106 deletions
|
@ -55,17 +55,17 @@ pub struct ThemeColors {
|
|||
pub border_variant: Hsla,
|
||||
pub border_focused: Hsla,
|
||||
pub border_transparent: Hsla,
|
||||
pub elevated_surface: Hsla,
|
||||
pub surface: Hsla,
|
||||
pub elevated_surface_background: Hsla,
|
||||
pub surface_background: Hsla,
|
||||
pub background: Hsla,
|
||||
pub element: Hsla,
|
||||
pub element_background: Hsla,
|
||||
pub element_hover: Hsla,
|
||||
pub element_active: Hsla,
|
||||
pub element_selected: Hsla,
|
||||
pub element_disabled: Hsla,
|
||||
pub element_placeholder: Hsla,
|
||||
pub element_drop_target: Hsla,
|
||||
pub ghost_element: Hsla,
|
||||
pub ghost_element_background: Hsla,
|
||||
pub ghost_element_hover: Hsla,
|
||||
pub ghost_element_active: Hsla,
|
||||
pub ghost_element_selected: Hsla,
|
||||
|
@ -80,15 +80,32 @@ pub struct ThemeColors {
|
|||
pub icon_disabled: Hsla,
|
||||
pub icon_placeholder: Hsla,
|
||||
pub icon_accent: Hsla,
|
||||
pub status_bar: Hsla,
|
||||
pub title_bar: Hsla,
|
||||
pub toolbar: Hsla,
|
||||
pub tab_bar: Hsla,
|
||||
pub tab_inactive: Hsla,
|
||||
pub tab_active: Hsla,
|
||||
pub editor: Hsla,
|
||||
pub editor_subheader: Hsla,
|
||||
pub status_bar_background: Hsla,
|
||||
pub title_bar_background: Hsla,
|
||||
pub toolbar_background: Hsla,
|
||||
pub tab_bar_background: Hsla,
|
||||
pub tab_inactive_background: Hsla,
|
||||
pub tab_active_background: Hsla,
|
||||
pub editor_background: Hsla,
|
||||
pub editor_subheader_background: Hsla,
|
||||
pub editor_active_line: Hsla,
|
||||
pub terminal_background: Hsla,
|
||||
pub terminal_ansi_bright_black: Hsla,
|
||||
pub terminal_ansi_bright_red: Hsla,
|
||||
pub terminal_ansi_bright_green: Hsla,
|
||||
pub terminal_ansi_bright_yellow: Hsla,
|
||||
pub terminal_ansi_bright_blue: Hsla,
|
||||
pub terminal_ansi_bright_magenta: Hsla,
|
||||
pub terminal_ansi_bright_cyan: Hsla,
|
||||
pub terminal_ansi_bright_white: Hsla,
|
||||
pub terminal_ansi_black: Hsla,
|
||||
pub terminal_ansi_red: Hsla,
|
||||
pub terminal_ansi_green: Hsla,
|
||||
pub terminal_ansi_yellow: Hsla,
|
||||
pub terminal_ansi_blue: Hsla,
|
||||
pub terminal_ansi_magenta: Hsla,
|
||||
pub terminal_ansi_cyan: Hsla,
|
||||
pub terminal_ansi_white: Hsla,
|
||||
}
|
||||
|
||||
#[derive(Refineable, Clone)]
|
||||
|
|
|
@ -206,17 +206,17 @@ impl ThemeColors {
|
|||
border_variant: neutral().light().step_5(),
|
||||
border_focused: blue().light().step_5(),
|
||||
border_transparent: system.transparent,
|
||||
elevated_surface: neutral().light().step_2(),
|
||||
surface: neutral().light().step_2(),
|
||||
elevated_surface_background: neutral().light().step_2(),
|
||||
surface_background: neutral().light().step_2(),
|
||||
background: neutral().light().step_1(),
|
||||
element: neutral().light().step_3(),
|
||||
element_background: neutral().light().step_3(),
|
||||
element_hover: neutral().light().step_4(),
|
||||
element_active: neutral().light().step_5(),
|
||||
element_selected: neutral().light().step_5(),
|
||||
element_disabled: neutral().light_alpha().step_3(),
|
||||
element_placeholder: neutral().light().step_11(),
|
||||
element_drop_target: blue().light_alpha().step_2(),
|
||||
ghost_element: system.transparent,
|
||||
ghost_element_background: system.transparent,
|
||||
ghost_element_hover: neutral().light().step_4(),
|
||||
ghost_element_active: neutral().light().step_5(),
|
||||
ghost_element_selected: neutral().light().step_5(),
|
||||
|
@ -231,15 +231,32 @@ impl ThemeColors {
|
|||
icon_disabled: neutral().light().step_9(),
|
||||
icon_placeholder: neutral().light().step_10(),
|
||||
icon_accent: blue().light().step_11(),
|
||||
status_bar: neutral().light().step_2(),
|
||||
title_bar: neutral().light().step_2(),
|
||||
toolbar: neutral().light().step_1(),
|
||||
tab_bar: neutral().light().step_2(),
|
||||
tab_active: neutral().light().step_1(),
|
||||
tab_inactive: neutral().light().step_2(),
|
||||
editor: neutral().light().step_1(),
|
||||
editor_subheader: neutral().light().step_2(),
|
||||
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(),
|
||||
tab_active_background: neutral().light().step_1(),
|
||||
tab_inactive_background: neutral().light().step_2(),
|
||||
editor_background: neutral().light().step_1(),
|
||||
editor_subheader_background: neutral().light().step_2(),
|
||||
editor_active_line: neutral().light_alpha().step_3(),
|
||||
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_white: neutral().light().step_11(),
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -251,17 +268,17 @@ impl ThemeColors {
|
|||
border_variant: neutral().dark().step_5(),
|
||||
border_focused: blue().dark().step_5(),
|
||||
border_transparent: system.transparent,
|
||||
elevated_surface: neutral().dark().step_2(),
|
||||
surface: neutral().dark().step_2(),
|
||||
elevated_surface_background: neutral().dark().step_2(),
|
||||
surface_background: neutral().dark().step_2(),
|
||||
background: neutral().dark().step_1(),
|
||||
element: neutral().dark().step_3(),
|
||||
element_background: neutral().dark().step_3(),
|
||||
element_hover: neutral().dark().step_4(),
|
||||
element_active: neutral().dark().step_5(),
|
||||
element_selected: neutral().dark().step_5(),
|
||||
element_disabled: neutral().dark_alpha().step_3(),
|
||||
element_placeholder: neutral().dark().step_11(),
|
||||
element_drop_target: blue().dark_alpha().step_2(),
|
||||
ghost_element: system.transparent,
|
||||
ghost_element_background: system.transparent,
|
||||
ghost_element_hover: neutral().dark().step_4(),
|
||||
ghost_element_active: neutral().dark().step_5(),
|
||||
ghost_element_selected: neutral().dark().step_5(),
|
||||
|
@ -276,15 +293,32 @@ impl ThemeColors {
|
|||
icon_disabled: neutral().dark().step_9(),
|
||||
icon_placeholder: neutral().dark().step_10(),
|
||||
icon_accent: blue().dark().step_11(),
|
||||
status_bar: neutral().dark().step_2(),
|
||||
title_bar: neutral().dark().step_2(),
|
||||
toolbar: neutral().dark().step_1(),
|
||||
tab_bar: neutral().dark().step_2(),
|
||||
tab_active: neutral().dark().step_1(),
|
||||
tab_inactive: neutral().dark().step_2(),
|
||||
editor: neutral().dark().step_1(),
|
||||
editor_subheader: neutral().dark().step_2(),
|
||||
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(),
|
||||
tab_active_background: neutral().dark().step_1(),
|
||||
tab_inactive_background: neutral().dark().step_2(),
|
||||
editor_background: neutral().dark().step_1(),
|
||||
editor_subheader_background: neutral().dark().step_2(),
|
||||
editor_active_line: neutral().dark_alpha().step_3(),
|
||||
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_white: neutral().dark().step_11(),
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -138,10 +138,13 @@ impl<'a> Debug for ThemeColorsPrinter<'a> {
|
|||
"border_transparent",
|
||||
&HslaPrinter(self.0.border_transparent),
|
||||
)
|
||||
.field("elevated_surface", &HslaPrinter(self.0.elevated_surface))
|
||||
.field("surface", &HslaPrinter(self.0.surface))
|
||||
.field(
|
||||
"elevated_surface",
|
||||
&HslaPrinter(self.0.elevated_surface_background),
|
||||
)
|
||||
.field("surface", &HslaPrinter(self.0.surface_background))
|
||||
.field("background", &HslaPrinter(self.0.background))
|
||||
.field("element", &HslaPrinter(self.0.element))
|
||||
.field("element", &HslaPrinter(self.0.element_background))
|
||||
.field("element_hover", &HslaPrinter(self.0.element_hover))
|
||||
.field("element_active", &HslaPrinter(self.0.element_active))
|
||||
.field("element_selected", &HslaPrinter(self.0.element_selected))
|
||||
|
@ -154,7 +157,10 @@ impl<'a> Debug for ThemeColorsPrinter<'a> {
|
|||
"element_drop_target",
|
||||
&HslaPrinter(self.0.element_drop_target),
|
||||
)
|
||||
.field("ghost_element", &HslaPrinter(self.0.ghost_element))
|
||||
.field(
|
||||
"ghost_element",
|
||||
&HslaPrinter(self.0.ghost_element_background),
|
||||
)
|
||||
.field(
|
||||
"ghost_element_hover",
|
||||
&HslaPrinter(self.0.ghost_element_hover),
|
||||
|
@ -181,14 +187,17 @@ impl<'a> Debug for ThemeColorsPrinter<'a> {
|
|||
.field("icon_disabled", &HslaPrinter(self.0.icon_disabled))
|
||||
.field("icon_placeholder", &HslaPrinter(self.0.icon_placeholder))
|
||||
.field("icon_accent", &HslaPrinter(self.0.icon_accent))
|
||||
.field("status_bar", &HslaPrinter(self.0.status_bar))
|
||||
.field("title_bar", &HslaPrinter(self.0.title_bar))
|
||||
.field("toolbar", &HslaPrinter(self.0.toolbar))
|
||||
.field("tab_bar", &HslaPrinter(self.0.tab_bar))
|
||||
.field("tab_inactive", &HslaPrinter(self.0.tab_inactive))
|
||||
.field("tab_active", &HslaPrinter(self.0.tab_active))
|
||||
.field("editor", &HslaPrinter(self.0.editor))
|
||||
.field("editor_subheader", &HslaPrinter(self.0.editor_subheader))
|
||||
.field("status_bar", &HslaPrinter(self.0.status_bar_background))
|
||||
.field("title_bar", &HslaPrinter(self.0.title_bar_background))
|
||||
.field("toolbar", &HslaPrinter(self.0.toolbar_background))
|
||||
.field("tab_bar", &HslaPrinter(self.0.tab_bar_background))
|
||||
.field("tab_inactive", &HslaPrinter(self.0.tab_inactive_background))
|
||||
.field("tab_active", &HslaPrinter(self.0.tab_active_background))
|
||||
.field("editor", &HslaPrinter(self.0.editor_background))
|
||||
.field(
|
||||
"editor_subheader",
|
||||
&HslaPrinter(self.0.editor_subheader_background),
|
||||
)
|
||||
.field(
|
||||
"editor_active_line",
|
||||
&HslaPrinter(self.0.editor_active_line),
|
||||
|
|
|
@ -27,7 +27,24 @@ pub struct VsCodeColors {
|
|||
#[serde(rename = "editor.foreground")]
|
||||
text: String,
|
||||
#[serde(rename = "editor.background")]
|
||||
editor: String,
|
||||
editor_background: String,
|
||||
terminal_background: String,
|
||||
terminal_ansi_bright_black: String,
|
||||
terminal_ansi_bright_red: String,
|
||||
terminal_ansi_bright_green: String,
|
||||
terminal_ansi_bright_yellow: String,
|
||||
terminal_ansi_bright_blue: String,
|
||||
terminal_ansi_bright_magenta: String,
|
||||
terminal_ansi_bright_cyan: String,
|
||||
terminal_ansi_bright_white: String,
|
||||
terminal_ansi_black: String,
|
||||
terminal_ansi_red: String,
|
||||
terminal_ansi_green: String,
|
||||
terminal_ansi_yellow: String,
|
||||
terminal_ansi_blue: String,
|
||||
terminal_ansi_magenta: String,
|
||||
terminal_ansi_cyan: String,
|
||||
terminal_ansi_white: String,
|
||||
}
|
||||
|
||||
fn try_parse_color(color: &str) -> Result<Hsla> {
|
||||
|
@ -58,8 +75,41 @@ impl VsCodeThemeConverter {
|
|||
let vscode_colors = &self.theme.colors;
|
||||
|
||||
let theme_colors_refinements = ThemeColorsRefinement {
|
||||
background: Some(try_parse_color(&vscode_colors.editor)?),
|
||||
background: Some(try_parse_color(&vscode_colors.editor_background)?),
|
||||
text: Some(try_parse_color(&vscode_colors.text)?),
|
||||
terminal_background: Some(try_parse_color(&vscode_colors.terminal_background)?),
|
||||
terminal_ansi_bright_black: Some(try_parse_color(
|
||||
&vscode_colors.terminal_ansi_bright_black,
|
||||
)?),
|
||||
terminal_ansi_bright_red: Some(try_parse_color(
|
||||
&vscode_colors.terminal_ansi_bright_red,
|
||||
)?),
|
||||
terminal_ansi_bright_green: Some(try_parse_color(
|
||||
&vscode_colors.terminal_ansi_bright_green,
|
||||
)?),
|
||||
terminal_ansi_bright_yellow: Some(try_parse_color(
|
||||
&vscode_colors.terminal_ansi_bright_yellow,
|
||||
)?),
|
||||
terminal_ansi_bright_blue: Some(try_parse_color(
|
||||
&vscode_colors.terminal_ansi_bright_blue,
|
||||
)?),
|
||||
terminal_ansi_bright_magenta: Some(try_parse_color(
|
||||
&vscode_colors.terminal_ansi_bright_magenta,
|
||||
)?),
|
||||
terminal_ansi_bright_cyan: Some(try_parse_color(
|
||||
&vscode_colors.terminal_ansi_bright_cyan,
|
||||
)?),
|
||||
terminal_ansi_bright_white: Some(try_parse_color(
|
||||
&vscode_colors.terminal_ansi_bright_white,
|
||||
)?),
|
||||
terminal_ansi_black: Some(try_parse_color(&vscode_colors.terminal_ansi_black)?),
|
||||
terminal_ansi_red: Some(try_parse_color(&vscode_colors.terminal_ansi_red)?),
|
||||
terminal_ansi_green: Some(try_parse_color(&vscode_colors.terminal_ansi_green)?),
|
||||
terminal_ansi_yellow: Some(try_parse_color(&vscode_colors.terminal_ansi_yellow)?),
|
||||
terminal_ansi_blue: Some(try_parse_color(&vscode_colors.terminal_ansi_blue)?),
|
||||
terminal_ansi_magenta: Some(try_parse_color(&vscode_colors.terminal_ansi_magenta)?),
|
||||
terminal_ansi_cyan: Some(try_parse_color(&vscode_colors.terminal_ansi_cyan)?),
|
||||
terminal_ansi_white: Some(try_parse_color(&vscode_colors.terminal_ansi_white)?),
|
||||
..Default::default()
|
||||
};
|
||||
|
||||
|
@ -81,22 +131,22 @@ impl VsCodeThemeConverter {
|
|||
}
|
||||
}
|
||||
|
||||
#[cfg(test)]
|
||||
mod tests {
|
||||
use super::*;
|
||||
use std::path::PathBuf;
|
||||
// #[cfg(test)]
|
||||
// mod tests {
|
||||
// use super::*;
|
||||
// use std::path::PathBuf;
|
||||
|
||||
#[test]
|
||||
fn test_deserialize_theme() {
|
||||
let manifest_dir = PathBuf::from(env!("CARGO_MANIFEST_DIR"));
|
||||
let root_dir = manifest_dir.parent().unwrap().parent().unwrap();
|
||||
// #[test]
|
||||
// fn test_deserialize_theme() {
|
||||
// let manifest_dir = PathBuf::from(env!("CARGO_MANIFEST_DIR"));
|
||||
// let root_dir = manifest_dir.parent().unwrap().parent().unwrap();
|
||||
|
||||
let mut d = root_dir.to_path_buf();
|
||||
d.push("assets/themes/src/vsc/dracula/dracula.json");
|
||||
// let mut d = root_dir.to_path_buf();
|
||||
// d.push("assets/themes/src/vsc/dracula/dracula.json");
|
||||
|
||||
let data = std::fs::read_to_string(d).expect("Unable to read file");
|
||||
// let data = std::fs::read_to_string(d).expect("Unable to read file");
|
||||
|
||||
let result: Theme = serde_json::from_str(&data).unwrap();
|
||||
println!("{:#?}", result);
|
||||
}
|
||||
}
|
||||
// let result: Theme = serde_json::from_str(&data).unwrap();
|
||||
// println!("{:#?}", result);
|
||||
// }
|
||||
// }
|
||||
|
|
|
@ -220,7 +220,7 @@ impl Buffer {
|
|||
.flex_1()
|
||||
.w_full()
|
||||
.h_full()
|
||||
.bg(cx.theme().colors().editor)
|
||||
.bg(cx.theme().colors().editor_background)
|
||||
.children(rows)
|
||||
}
|
||||
}
|
||||
|
|
|
@ -30,14 +30,17 @@ impl Render for BufferSearch {
|
|||
type Element = Div<Self>;
|
||||
|
||||
fn render(&mut self, cx: &mut ViewContext<Self>) -> Div<Self> {
|
||||
h_stack().bg(cx.theme().colors().toolbar).p_2().child(
|
||||
h_stack().child(Input::new("Search")).child(
|
||||
IconButton::<Self>::new("replace", Icon::Replace)
|
||||
.when(self.is_replace_open, |this| this.color(IconColor::Accent))
|
||||
.on_click(|buffer_search, cx| {
|
||||
buffer_search.toggle_replace(cx);
|
||||
}),
|
||||
),
|
||||
)
|
||||
h_stack()
|
||||
.bg(cx.theme().colors().toolbar_background)
|
||||
.p_2()
|
||||
.child(
|
||||
h_stack().child(Input::new("Search")).child(
|
||||
IconButton::<Self>::new("replace", Icon::Replace)
|
||||
.when(self.is_replace_open, |this| this.color(IconColor::Accent))
|
||||
.on_click(|buffer_search, cx| {
|
||||
buffer_search.toggle_replace(cx);
|
||||
}),
|
||||
),
|
||||
)
|
||||
}
|
||||
}
|
||||
|
|
|
@ -18,7 +18,7 @@ impl CollabPanel {
|
|||
v_stack()
|
||||
.id(self.id.clone())
|
||||
.h_full()
|
||||
.bg(cx.theme().colors().surface)
|
||||
.bg(cx.theme().colors().surface_background)
|
||||
.child(
|
||||
v_stack()
|
||||
.id("crdb")
|
||||
|
|
|
@ -46,7 +46,7 @@ impl ContextMenu {
|
|||
fn render<V: 'static>(self, _view: &mut V, cx: &mut ViewContext<V>) -> impl Component<V> {
|
||||
v_stack()
|
||||
.flex()
|
||||
.bg(cx.theme().colors().elevated_surface)
|
||||
.bg(cx.theme().colors().elevated_surface_background)
|
||||
.border()
|
||||
.border_color(cx.theme().colors().border)
|
||||
.child(
|
||||
|
|
|
@ -73,12 +73,12 @@ impl<V: 'static> IconButton<V> {
|
|||
|
||||
let (bg_color, bg_hover_color, bg_active_color) = match self.variant {
|
||||
ButtonVariant::Filled => (
|
||||
cx.theme().colors().element,
|
||||
cx.theme().colors().element_background,
|
||||
cx.theme().colors().element_hover,
|
||||
cx.theme().colors().element_active,
|
||||
),
|
||||
ButtonVariant::Ghost => (
|
||||
cx.theme().colors().ghost_element,
|
||||
cx.theme().colors().ghost_element_background,
|
||||
cx.theme().colors().ghost_element_hover,
|
||||
cx.theme().colors().ghost_element_active,
|
||||
),
|
||||
|
|
|
@ -66,7 +66,7 @@ impl Key {
|
|||
.rounded_md()
|
||||
.text_sm()
|
||||
.text_color(cx.theme().colors().text)
|
||||
.bg(cx.theme().colors().element)
|
||||
.bg(cx.theme().colors().element_background)
|
||||
.child(self.key.clone())
|
||||
}
|
||||
}
|
||||
|
|
|
@ -106,7 +106,7 @@ impl ListHeader {
|
|||
|
||||
h_stack()
|
||||
.w_full()
|
||||
.bg(cx.theme().colors().surface)
|
||||
.bg(cx.theme().colors().surface_background)
|
||||
// TODO: Add focus state
|
||||
// .when(self.state == InteractionState::Focused, |this| {
|
||||
// this.border()
|
||||
|
@ -399,7 +399,7 @@ impl ListEntry {
|
|||
div()
|
||||
.relative()
|
||||
.group("")
|
||||
.bg(cx.theme().colors().surface)
|
||||
.bg(cx.theme().colors().surface_background)
|
||||
.when(self.state == InteractionState::Focused, |this| {
|
||||
this.border()
|
||||
.border_color(cx.theme().colors().border_focused)
|
||||
|
@ -490,7 +490,7 @@ impl<V: 'static> ListDetailsEntry<V> {
|
|||
let settings = user_settings(cx);
|
||||
|
||||
let (item_bg, item_bg_hover, item_bg_active) = (
|
||||
cx.theme().colors().ghost_element,
|
||||
cx.theme().colors().ghost_element_background,
|
||||
cx.theme().colors().ghost_element_hover,
|
||||
cx.theme().colors().ghost_element_active,
|
||||
);
|
||||
|
@ -516,7 +516,7 @@ impl<V: 'static> ListDetailsEntry<V> {
|
|||
.top_3()
|
||||
.rounded_full()
|
||||
.border_2()
|
||||
.border_color(cx.theme().colors().surface)
|
||||
.border_color(cx.theme().colors().surface_background)
|
||||
.w(px(9.0))
|
||||
.h(px(9.0))
|
||||
.z_index(2)
|
||||
|
|
|
@ -24,7 +24,7 @@ impl MultiBuffer {
|
|||
.items_center()
|
||||
.justify_between()
|
||||
.p_4()
|
||||
.bg(cx.theme().colors().editor_subheader)
|
||||
.bg(cx.theme().colors().editor_subheader_background)
|
||||
.child(Label::new("main.rs"))
|
||||
.child(IconButton::new("arrow_up_right", Icon::ArrowUpRight)),
|
||||
)
|
||||
|
|
|
@ -34,7 +34,7 @@ impl NotificationToast {
|
|||
.px_1p5()
|
||||
.rounded_lg()
|
||||
.shadow_md()
|
||||
.bg(cx.theme().colors().elevated_surface)
|
||||
.bg(cx.theme().colors().elevated_surface_background)
|
||||
.child(div().size_full().child(self.label.clone()))
|
||||
}
|
||||
}
|
||||
|
|
|
@ -22,7 +22,7 @@ impl NotificationsPanel {
|
|||
.flex()
|
||||
.flex_col()
|
||||
.size_full()
|
||||
.bg(cx.theme().colors().surface)
|
||||
.bg(cx.theme().colors().surface_background)
|
||||
.child(
|
||||
ListHeader::new("Notifications").meta(Some(ListHeaderMeta::Tools(vec![
|
||||
Icon::AtSign,
|
||||
|
@ -43,7 +43,7 @@ impl NotificationsPanel {
|
|||
.p_1()
|
||||
// TODO: Add cursor style
|
||||
// .cursor(Cursor::IBeam)
|
||||
.bg(cx.theme().colors().element)
|
||||
.bg(cx.theme().colors().element_background)
|
||||
.border()
|
||||
.border_color(cx.theme().colors().border_variant)
|
||||
.child(
|
||||
|
|
|
@ -47,7 +47,7 @@ impl Palette {
|
|||
.id(self.id.clone())
|
||||
.w_96()
|
||||
.rounded_lg()
|
||||
.bg(cx.theme().colors().elevated_surface)
|
||||
.bg(cx.theme().colors().elevated_surface_background)
|
||||
.border()
|
||||
.border_color(cx.theme().colors().border)
|
||||
.child(
|
||||
|
@ -56,7 +56,12 @@ impl Palette {
|
|||
.child(v_stack().py_0p5().px_1().child(div().px_2().py_0p5().child(
|
||||
Label::new(self.input_placeholder.clone()).color(LabelColor::Placeholder),
|
||||
)))
|
||||
.child(div().h_px().w_full().bg(cx.theme().colors().element))
|
||||
.child(
|
||||
div()
|
||||
.h_px()
|
||||
.w_full()
|
||||
.bg(cx.theme().colors().element_background),
|
||||
)
|
||||
.child(
|
||||
v_stack()
|
||||
.id("items")
|
||||
|
|
|
@ -107,7 +107,7 @@ impl<V: 'static> Panel<V> {
|
|||
PanelSide::Right => this.border_l(),
|
||||
PanelSide::Bottom => this.border_b().w_full().h(current_size),
|
||||
})
|
||||
.bg(cx.theme().colors().surface)
|
||||
.bg(cx.theme().colors().surface_background)
|
||||
.border_color(cx.theme().colors().border)
|
||||
.children(self.children)
|
||||
}
|
||||
|
|
|
@ -113,7 +113,7 @@ impl<V: 'static> PaneGroup<V> {
|
|||
.gap_px()
|
||||
.w_full()
|
||||
.h_full()
|
||||
.bg(cx.theme().colors().editor)
|
||||
.bg(cx.theme().colors().editor_background)
|
||||
.children(self.groups.into_iter().map(|group| group.render(view, cx)));
|
||||
|
||||
if self.split_direction == SplitDirection::Horizontal {
|
||||
|
|
|
@ -20,7 +20,7 @@ impl ProjectPanel {
|
|||
.flex_col()
|
||||
.w_full()
|
||||
.h_full()
|
||||
.bg(cx.theme().colors().surface)
|
||||
.bg(cx.theme().colors().surface_background)
|
||||
.child(
|
||||
div()
|
||||
.id("project-panel-contents")
|
||||
|
|
|
@ -93,7 +93,7 @@ impl StatusBar {
|
|||
.items_center()
|
||||
.justify_between()
|
||||
.w_full()
|
||||
.bg(cx.theme().colors().status_bar)
|
||||
.bg(cx.theme().colors().status_bar_background)
|
||||
.child(self.left_tools(view, cx))
|
||||
.child(self.right_tools(view, cx))
|
||||
}
|
||||
|
|
|
@ -109,12 +109,12 @@ impl Tab {
|
|||
|
||||
let (tab_bg, tab_hover_bg, tab_active_bg) = match self.current {
|
||||
false => (
|
||||
cx.theme().colors().tab_inactive,
|
||||
cx.theme().colors().tab_inactive_background,
|
||||
cx.theme().colors().ghost_element_hover,
|
||||
cx.theme().colors().ghost_element_active,
|
||||
),
|
||||
true => (
|
||||
cx.theme().colors().tab_active,
|
||||
cx.theme().colors().tab_active_background,
|
||||
cx.theme().colors().element_hover,
|
||||
cx.theme().colors().element_active,
|
||||
),
|
||||
|
|
|
@ -31,7 +31,7 @@ impl TabBar {
|
|||
.id(self.id.clone())
|
||||
.w_full()
|
||||
.flex()
|
||||
.bg(cx.theme().colors().tab_bar)
|
||||
.bg(cx.theme().colors().tab_bar_background)
|
||||
// Left Side
|
||||
.child(
|
||||
div()
|
||||
|
|
|
@ -24,7 +24,7 @@ impl Terminal {
|
|||
div()
|
||||
.w_full()
|
||||
.flex()
|
||||
.bg(cx.theme().colors().surface)
|
||||
.bg(cx.theme().colors().surface_background)
|
||||
.child(
|
||||
div().px_1().flex().flex_none().gap_2().child(
|
||||
div()
|
||||
|
|
|
@ -54,7 +54,7 @@ impl<V: 'static> Toast<V> {
|
|||
.rounded_lg()
|
||||
.shadow_md()
|
||||
.overflow_hidden()
|
||||
.bg(cx.theme().colors().elevated_surface)
|
||||
.bg(cx.theme().colors().elevated_surface_background)
|
||||
.children(self.children)
|
||||
}
|
||||
}
|
||||
|
|
|
@ -56,7 +56,7 @@ impl<V: 'static> Toolbar<V> {
|
|||
|
||||
fn render(self, _view: &mut V, cx: &mut ViewContext<V>) -> impl Component<V> {
|
||||
div()
|
||||
.bg(cx.theme().colors().toolbar)
|
||||
.bg(cx.theme().colors().toolbar_background)
|
||||
.p_2()
|
||||
.flex()
|
||||
.justify_between()
|
||||
|
|
|
@ -28,7 +28,7 @@ impl TrafficLight {
|
|||
(true, TrafficLightColor::Red) => system_colors.mac_os_traffic_light_red,
|
||||
(true, TrafficLightColor::Yellow) => system_colors.mac_os_traffic_light_yellow,
|
||||
(true, TrafficLightColor::Green) => system_colors.mac_os_traffic_light_green,
|
||||
(false, _) => cx.theme().colors().element,
|
||||
(false, _) => cx.theme().colors().element_background,
|
||||
};
|
||||
|
||||
div().w_3().h_3().rounded_full().bg(fill)
|
||||
|
|
|
@ -22,8 +22,8 @@ pub enum ButtonVariant {
|
|||
impl ButtonVariant {
|
||||
pub fn bg_color(&self, cx: &mut WindowContext) -> Hsla {
|
||||
match self {
|
||||
ButtonVariant::Ghost => cx.theme().colors().ghost_element,
|
||||
ButtonVariant::Filled => cx.theme().colors().element,
|
||||
ButtonVariant::Ghost => cx.theme().colors().ghost_element_background,
|
||||
ButtonVariant::Filled => cx.theme().colors().element_background,
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -14,7 +14,7 @@ impl UnreadIndicator {
|
|||
div()
|
||||
.rounded_full()
|
||||
.border_2()
|
||||
.border_color(cx.theme().colors().surface)
|
||||
.border_color(cx.theme().colors().surface_background)
|
||||
.w(px(9.0))
|
||||
.h(px(9.0))
|
||||
.z_index(2)
|
||||
|
|
|
@ -59,12 +59,12 @@ impl Input {
|
|||
fn render<V: 'static>(self, _view: &mut V, cx: &mut ViewContext<V>) -> impl Component<V> {
|
||||
let (input_bg, input_hover_bg, input_active_bg) = match self.variant {
|
||||
InputVariant::Ghost => (
|
||||
cx.theme().colors().ghost_element,
|
||||
cx.theme().colors().ghost_element_background,
|
||||
cx.theme().colors().ghost_element_hover,
|
||||
cx.theme().colors().ghost_element_active,
|
||||
),
|
||||
InputVariant::Filled => (
|
||||
cx.theme().colors().element,
|
||||
cx.theme().colors().element_background,
|
||||
cx.theme().colors().element_hover,
|
||||
cx.theme().colors().element_active,
|
||||
),
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue