refactor: add native ui theme tokens

This commit is contained in:
ZacharyZhang-NY committed 2026-04-19 01:36:21 -04:00
1 parent 5e6e929779
commit 308be17264
14 files changed
+248 -108

No files matched your search

+27 -12
View File
@@ -1,5 +1,5 @@
use crate::{ use crate::{
SharedStore, SharedStore, theme,
widgets::{ widgets::{
button::{primary_button, secondary_button}, button::{primary_button, secondary_button},
text_input::TextInput, text_input::TextInput,
@@ -7,7 +7,7 @@ use crate::{
}; };
use app_models::AppState; use app_models::AppState;
use domain::{ApprovalState, ProfileSnapshot, SectionId}; use domain::{ApprovalState, ProfileSnapshot, SectionId};
use gpui::{App, Context, Entity, SharedString, Window, div, prelude::*, px, rgb}; use gpui::{App, Context, Entity, SharedString, Window, div, prelude::*, px};
use storage::NewCompanyInput; use storage::NewCompanyInput;
mod approvals; mod approvals;
@@ -234,11 +234,21 @@ impl AppRoot {
.gap_2() .gap_2()
.border_1() .border_1()
.rounded_md() .rounded_md()
.border_color(rgb(0xd9cdbf)) .border_color(theme::panel_border())
.bg(rgb(0xfffbf5)) .bg(theme::panel())
.child(div().text_sm().text_color(rgb(0x6f665d)).child(label)) .child(div().text_sm().text_color(theme::text_muted()).child(label))
.child(div().text_3xl().text_color(rgb(0x171411)).child(value)) .child(
.child(div().text_sm().text_color(rgb(0x6f665d)).child(detail)) div()
.text_3xl()
.text_color(theme::text_primary())
.child(value),
)
.child(
div()
.text_sm()
.text_color(theme::text_muted())
.child(detail),
)
} }
} }
@@ -257,7 +267,7 @@ impl Render for AppRoot {
div() div()
.size_full() .size_full()
.flex() .flex()
.bg(rgb(0xf3efe8)) .bg(theme::canvas())
.child(self.render_sidebar(cx)) .child(self.render_sidebar(cx))
.child( .child(
div() div()
@@ -269,10 +279,15 @@ impl Render for AppRoot {
.px_6() .px_6()
.py_4() .py_4()
.border_b_1() .border_b_1()
.border_color(rgb(0xd9cdbf)) .border_color(theme::panel_border())
.bg(rgb(0xf8f2e9)) .bg(theme::shell_header())
.child(div().text_xl().text_color(rgb(0x171411)).child(header)) .child(
.child(div().text_sm().text_color(rgb(0x6f665d)).child( div()
.text_xl()
.text_color(theme::text_primary())
.child(header),
)
.child(div().text_sm().text_color(theme::text_muted()).child(
self.state.status_line.clone().unwrap_or_else(|| { self.state.status_line.clone().unwrap_or_else(|| {
"Native Rust shell is reading the shared local profile." "Native Rust shell is reading the shared local profile."
.to_string() .to_string()
@@ -24,8 +24,8 @@ impl AppRoot {
.gap_2() .gap_2()
.border_1() .border_1()
.rounded_md() .rounded_md()
.border_color(rgb(0xd9cdbf)) .border_color(theme::panel_border())
.bg(rgb(0xfffbf5)) .bg(theme::panel())
.overflow_scroll() .overflow_scroll()
.child(div().text_lg().child("Approval queue")) .child(div().text_lg().child("Approval queue"))
.children(self.snapshot.approvals.iter().map(|item| { .children(self.snapshot.approvals.iter().map(|item| {
@@ -38,8 +38,12 @@ impl AppRoot {
.py_2() .py_2()
.rounded_md() .rounded_md()
.cursor_pointer() .cursor_pointer()
.bg(if active { rgb(0xefe2d4) } else { rgb(0xfffbf5) }) .bg(if active {
.hover(|style| style.bg(rgb(0xf4ede4))) theme::selection_fill()
} else {
theme::panel()
})
.hover(|style| style.bg(theme::panel_hover()))
.on_click(cx.listener(move |this, _, _, cx| { .on_click(cx.listener(move |this, _, _, cx| {
this.state.selected_approval_id = Some(approval_id.clone()); this.state.selected_approval_id = Some(approval_id.clone());
cx.notify(); cx.notify();
@@ -54,13 +58,13 @@ impl AppRoot {
.gap_3() .gap_3()
.border_1() .border_1()
.rounded_md() .rounded_md()
.border_color(rgb(0xd9cdbf)) .border_color(theme::panel_border())
.bg(rgb(0xfffbf5)) .bg(theme::panel())
.child(div().text_lg().child("Decision")) .child(div().text_lg().child("Decision"))
.child( .child(
div() div()
.text_sm() .text_sm()
.text_color(rgb(0x6f665d)) .text_color(theme::text_muted())
.child(approval_type), .child(approval_type),
) )
.child( .child(
@@ -68,9 +72,9 @@ impl AppRoot {
.min_h(px(160.0)) .min_h(px(160.0))
.p_3() .p_3()
.border_1() .border_1()
.border_color(rgb(0xeee3d7)) .border_color(theme::panel_inset_border())
.rounded_md() .rounded_md()
.bg(rgb(0xf7f0e7)) .bg(theme::panel_inset())
.child(approval_summary), .child(approval_summary),
) )
.child( .child(
@@ -24,8 +24,8 @@ impl AppRoot {
.gap_2() .gap_2()
.border_1() .border_1()
.rounded_md() .rounded_md()
.border_color(rgb(0xd9cdbf)) .border_color(theme::panel_border())
.bg(rgb(0xfffbf5)) .bg(theme::panel())
.overflow_scroll() .overflow_scroll()
.child(div().text_lg().child("Document center")) .child(div().text_lg().child("Document center"))
.children(self.snapshot.documents.iter().map(|item| { .children(self.snapshot.documents.iter().map(|item| {
@@ -38,8 +38,12 @@ impl AppRoot {
.py_2() .py_2()
.rounded_md() .rounded_md()
.cursor_pointer() .cursor_pointer()
.bg(if active { rgb(0xefe2d4) } else { rgb(0xfffbf5) }) .bg(if active {
.hover(|style| style.bg(rgb(0xf4ede4))) theme::selection_fill()
} else {
theme::panel()
})
.hover(|style| style.bg(theme::panel_hover()))
.on_click(cx.listener(move |this, _, _, cx| { .on_click(cx.listener(move |this, _, _, cx| {
this.state.selected_document_id = Some(document_id.clone()); this.state.selected_document_id = Some(document_id.clone());
cx.notify(); cx.notify();
@@ -54,19 +58,19 @@ impl AppRoot {
.gap_3() .gap_3()
.border_1() .border_1()
.rounded_md() .rounded_md()
.border_color(rgb(0xd9cdbf)) .border_color(theme::panel_border())
.bg(rgb(0xfffbf5)) .bg(theme::panel())
.child(div().text_lg().child("Quick draft")) .child(div().text_lg().child("Quick draft"))
.child(self.document_title_input.clone()) .child(self.document_title_input.clone())
.child(self.document_body_input.clone()) .child(self.document_body_input.clone())
.child(primary_button("Save draft", cx, |this, cx| { .child(primary_button("Save draft", cx, |this, cx| {
this.create_document(cx) this.create_document(cx)
})) }))
.child(div().h(px(1.0)).bg(rgb(0xeee3d7))) .child(div().h(px(1.0)).bg(theme::panel_inset_border()))
.child( .child(
div() div()
.text_sm() .text_sm()
.text_color(rgb(0x6f665d)) .text_color(theme::text_muted())
.child(document_title), .child(document_title),
) )
.child( .child(
@@ -74,9 +78,9 @@ impl AppRoot {
.min_h(px(200.0)) .min_h(px(200.0))
.p_3() .p_3()
.border_1() .border_1()
.border_color(rgb(0xeee3d7)) .border_color(theme::panel_inset_border())
.rounded_md() .rounded_md()
.bg(rgb(0xf7f0e7)) .bg(theme::panel_inset())
.child(document_content), .child(document_content),
), ),
) )
@@ -12,8 +12,8 @@ impl AppRoot {
.gap_2() .gap_2()
.border_1() .border_1()
.rounded_md() .rounded_md()
.border_color(rgb(0xd9cdbf)) .border_color(theme::panel_border())
.bg(rgb(0xfffbf5)) .bg(theme::panel())
.child(div().text_lg().child("Unread messages")) .child(div().text_lg().child("Unread messages"))
.children( .children(
self.snapshot self.snapshot
@@ -25,7 +25,7 @@ impl AppRoot {
div() div()
.py_2() .py_2()
.border_b_1() .border_b_1()
.border_color(rgb(0xeee3d7)) .border_color(theme::panel_inset_border())
.child(format!("{} · {}", item.subject, item.body)) .child(format!("{} · {}", item.subject, item.body))
}), }),
), ),
@@ -37,8 +37,8 @@ impl AppRoot {
.gap_2() .gap_2()
.border_1() .border_1()
.rounded_md() .rounded_md()
.border_color(rgb(0xd9cdbf)) .border_color(theme::panel_border())
.bg(rgb(0xfffbf5)) .bg(theme::panel())
.child(div().text_lg().child("Pending approvals")) .child(div().text_lg().child("Pending approvals"))
.children( .children(
self.snapshot self.snapshot
@@ -47,9 +47,14 @@ impl AppRoot {
.filter(|item| item.state == "pending") .filter(|item| item.state == "pending")
.take(8) .take(8)
.map(|item| { .map(|item| {
div().py_2().border_b_1().border_color(rgb(0xeee3d7)).child( div()
format!("{} · {}", item.approval_type, item.payload_summary), .py_2()
) .border_b_1()
.border_color(theme::panel_inset_border())
.child(format!(
"{} · {}",
item.approval_type, item.payload_summary
))
}), }),
), ),
) )
@@ -25,8 +25,8 @@ impl AppRoot {
.gap_2() .gap_2()
.border_1() .border_1()
.rounded_md() .rounded_md()
.border_color(rgb(0xd9cdbf)) .border_color(theme::panel_border())
.bg(rgb(0xfffbf5)) .bg(theme::panel())
.overflow_scroll() .overflow_scroll()
.child(div().text_lg().child("Channels")) .child(div().text_lg().child("Channels"))
.children(self.snapshot.agent_messages.iter().map(|item| { .children(self.snapshot.agent_messages.iter().map(|item| {
@@ -39,8 +39,12 @@ impl AppRoot {
.py_2() .py_2()
.rounded_md() .rounded_md()
.cursor_pointer() .cursor_pointer()
.bg(if active { rgb(0xefe2d4) } else { rgb(0xfffbf5) }) .bg(if active {
.hover(|style| style.bg(rgb(0xf4ede4))) theme::selection_fill()
} else {
theme::panel()
})
.hover(|style| style.bg(theme::panel_hover()))
.on_click(cx.listener(move |this, _, _, cx| { .on_click(cx.listener(move |this, _, _, cx| {
this.state.selected_message_id = Some(message_id.clone()); this.state.selected_message_id = Some(message_id.clone());
cx.notify(); cx.notify();
@@ -55,13 +59,13 @@ impl AppRoot {
.gap_3() .gap_3()
.border_1() .border_1()
.rounded_md() .rounded_md()
.border_color(rgb(0xd9cdbf)) .border_color(theme::panel_border())
.bg(rgb(0xfffbf5)) .bg(theme::panel())
.child(div().text_lg().child("Conversation")) .child(div().text_lg().child("Conversation"))
.child( .child(
div() div()
.text_sm() .text_sm()
.text_color(rgb(0x6f665d)) .text_color(theme::text_muted())
.child(selected_subject), .child(selected_subject),
) )
.child( .child(
@@ -69,9 +73,9 @@ impl AppRoot {
.min_h(px(220.0)) .min_h(px(220.0))
.p_3() .p_3()
.border_1() .border_1()
.border_color(rgb(0xeee3d7)) .border_color(theme::panel_inset_border())
.rounded_md() .rounded_md()
.bg(rgb(0xf7f0e7)) .bg(theme::panel_inset())
.child(selected_body), .child(selected_body),
) )
.child(self.message_input.clone()) .child(self.message_input.clone())
@@ -7,13 +7,13 @@ impl AppRoot {
.p_8() .p_8()
.flex() .flex()
.gap_8() .gap_8()
.bg(rgb(0xf3efe8)) .bg(theme::canvas())
.child( .child(
div() div()
.flex_1() .flex_1()
.gap_4() .gap_4()
.child(div().text_3xl().text_color(rgb(0x171411)).child("Start a native AgentCompany profile")) .child(div().text_3xl().text_color(theme::text_primary()).child("Start a native AgentCompany profile"))
.child(div().text_sm().text_color(rgb(0x6f665d)).child("Create the first company, point it at a workspace, and keep the SQLite profile local.")) .child(div().text_sm().text_color(theme::text_muted()).child("Create the first company, point it at a workspace, and keep the SQLite profile local."))
.child(self.company_name_input.clone()) .child(self.company_name_input.clone())
.child(self.mission_input.clone()) .child(self.mission_input.clone())
.child(self.workspace_input.clone()) .child(self.workspace_input.clone())
@@ -26,13 +26,13 @@ impl AppRoot {
.gap_3() .gap_3()
.border_1() .border_1()
.rounded_md() .rounded_md()
.border_color(rgb(0xd9cdbf)) .border_color(theme::panel_border())
.bg(rgb(0xfffbf5)) .bg(theme::panel())
.child(div().text_lg().child("What lands in SQLite")) .child(div().text_lg().child("What lands in SQLite"))
.child(div().text_sm().text_color(rgb(0x6f665d)).child("Company")) .child(div().text_sm().text_color(theme::text_muted()).child("Company"))
.child(div().text_sm().text_color(rgb(0x6f665d)).child("Primary workspace")) .child(div().text_sm().text_color(theme::text_muted()).child("Primary workspace"))
.child(div().text_sm().text_color(rgb(0x6f665d)).child("Connector catalog")) .child(div().text_sm().text_color(theme::text_muted()).child("Connector catalog"))
.child(div().text_sm().text_color(rgb(0x6f665d)).child("Shared profile settings")), .child(div().text_sm().text_color(theme::text_muted()).child("Shared profile settings")),
) )
} }
} }
@@ -46,14 +46,14 @@ impl AppRoot {
.gap_2() .gap_2()
.border_1() .border_1()
.rounded_md() .rounded_md()
.border_color(rgb(0xd9cdbf)) .border_color(theme::panel_border())
.bg(rgb(0xfffbf5)) .bg(theme::panel())
.child(div().text_lg().child(company_name)) .child(div().text_lg().child(company_name))
.children(self.snapshot.tasks.iter().take(6).map(|task| { .children(self.snapshot.tasks.iter().take(6).map(|task| {
div() div()
.py_2() .py_2()
.border_b_1() .border_b_1()
.border_color(rgb(0xeee3d7)) .border_color(theme::panel_inset_border())
.child(format!("{} · {}", task.status, task.title)) .child(format!("{} · {}", task.status, task.title))
})), })),
) )
@@ -64,14 +64,14 @@ impl AppRoot {
.gap_2() .gap_2()
.border_1() .border_1()
.rounded_md() .rounded_md()
.border_color(rgb(0xd9cdbf)) .border_color(theme::panel_border())
.bg(rgb(0xfffbf5)) .bg(theme::panel())
.child(div().text_lg().child("Recent activity")) .child(div().text_lg().child("Recent activity"))
.children(self.snapshot.activity.iter().take(6).map(|item| { .children(self.snapshot.activity.iter().take(6).map(|item| {
div() div()
.py_2() .py_2()
.border_b_1() .border_b_1()
.border_color(rgb(0xeee3d7)) .border_color(theme::panel_inset_border())
.child(format!("{} · {}", item.action, item.detail)) .child(format!("{} · {}", item.action, item.detail))
})), })),
), ),
@@ -52,8 +52,8 @@ impl AppRoot {
.gap_2() .gap_2()
.border_1() .border_1()
.rounded_md() .rounded_md()
.border_color(rgb(0xd9cdbf)) .border_color(theme::panel_border())
.bg(rgb(0xfffbf5)) .bg(theme::panel())
.overflow_scroll() .overflow_scroll()
.child(div().text_lg().child("Run queue")) .child(div().text_lg().child("Run queue"))
.children(self.snapshot.runs.iter().map(|item| { .children(self.snapshot.runs.iter().map(|item| {
@@ -71,8 +71,12 @@ impl AppRoot {
.py_2() .py_2()
.rounded_md() .rounded_md()
.cursor_pointer() .cursor_pointer()
.bg(if active { rgb(0xefe2d4) } else { rgb(0xfffbf5) }) .bg(if active {
.hover(|style| style.bg(rgb(0xf4ede4))) theme::selection_fill()
} else {
theme::panel()
})
.hover(|style| style.bg(theme::panel_hover()))
.on_click(cx.listener(move |this, _, _, cx| { .on_click(cx.listener(move |this, _, _, cx| {
this.state.selected_run_id = Some(run_id.clone()); this.state.selected_run_id = Some(run_id.clone());
cx.notify(); cx.notify();
@@ -87,13 +91,13 @@ impl AppRoot {
.gap_3() .gap_3()
.border_1() .border_1()
.rounded_md() .rounded_md()
.border_color(rgb(0xd9cdbf)) .border_color(theme::panel_border())
.bg(rgb(0xfffbf5)) .bg(theme::panel())
.child(div().text_lg().child("Run inspector")) .child(div().text_lg().child("Run inspector"))
.child( .child(
div() div()
.text_sm() .text_sm()
.text_color(rgb(0x6f665d)) .text_color(theme::text_muted())
.child(selected_status), .child(selected_status),
) )
.child( .child(
@@ -131,9 +135,9 @@ impl AppRoot {
.min_h(px(180.0)) .min_h(px(180.0))
.p_3() .p_3()
.border_1() .border_1()
.border_color(rgb(0xeee3d7)) .border_color(theme::panel_inset_border())
.rounded_md() .rounded_md()
.bg(rgb(0xf7f0e7)) .bg(theme::panel_inset())
.child(selected_summary), .child(selected_summary),
) )
.when(!selected_error.is_empty(), |container| { .when(!selected_error.is_empty(), |container| {
@@ -141,9 +145,9 @@ impl AppRoot {
div() div()
.p_3() .p_3()
.border_1() .border_1()
.border_color(rgb(0x9e3d2d)) .border_color(theme::primary_action())
.rounded_md() .rounded_md()
.bg(rgb(0xffefe8)) .bg(theme::danger_bg())
.child(selected_error), .child(selected_error),
) )
}), }),
@@ -19,8 +19,8 @@ impl AppRoot {
.gap_4() .gap_4()
.flex() .flex()
.flex_col() .flex_col()
.bg(rgb(0x161514)) .bg(theme::sidebar_bg())
.text_color(rgb(0xf5eee4)) .text_color(theme::sidebar_text())
.child(div().text_lg().child("AgentCompany")) .child(div().text_lg().child("AgentCompany"))
.children(self.snapshot.companies.iter().map(|company| { .children(self.snapshot.companies.iter().map(|company| {
let active = let active =
@@ -32,14 +32,18 @@ impl AppRoot {
.py_2() .py_2()
.rounded_md() .rounded_md()
.cursor_pointer() .cursor_pointer()
.bg(if active { rgb(0x9e3d2d) } else { rgb(0x211d1a) }) .bg(if active {
.hover(|style| style.bg(rgb(0x362c27))) theme::primary_action()
} else {
theme::sidebar_surface()
})
.hover(|style| style.bg(theme::sidebar_surface_hover()))
.on_click(cx.listener(move |this, _, _, cx| { .on_click(cx.listener(move |this, _, _, cx| {
this.switch_company(company_id.clone(), cx) this.switch_company(company_id.clone(), cx)
})) }))
.child(company.name.clone()) .child(company.name.clone())
})) }))
.child(div().h(px(1.0)).bg(rgb(0x2f2924))) .child(div().h(px(1.0)).bg(theme::sidebar_divider()))
.children(sections.into_iter().map(|section| { .children(sections.into_iter().map(|section| {
let active = self.state.section == section; let active = self.state.section == section;
div() div()
@@ -51,9 +55,17 @@ impl AppRoot {
.py_2() .py_2()
.rounded_md() .rounded_md()
.cursor_pointer() .cursor_pointer()
.bg(if active { rgb(0xefe2d4) } else { rgb(0x161514) }) .bg(if active {
.text_color(if active { rgb(0x171411) } else { rgb(0xf5eee4) }) theme::selection_fill()
.hover(|style| style.bg(rgb(0x2c2825))) } else {
theme::sidebar_bg()
})
.text_color(if active {
theme::text_primary()
} else {
theme::sidebar_text()
})
.hover(|style| style.bg(theme::sidebar_hover()))
.on_click(cx.listener(move |this, _, _, cx| { .on_click(cx.listener(move |this, _, _, cx| {
this.state.section = section; this.state.section = section;
cx.notify(); cx.notify();
@@ -16,10 +16,14 @@ impl AppRoot {
.gap_2() .gap_2()
.border_1() .border_1()
.rounded_md() .rounded_md()
.border_color(rgb(0xd9cdbf)) .border_color(theme::panel_border())
.bg(if active { rgb(0xf7f0e7) } else { rgb(0xfffbf5) }) .bg(if active {
theme::panel_inset()
} else {
theme::panel()
})
.cursor_pointer() .cursor_pointer()
.hover(|style| style.bg(rgb(0xf4ede4))) .hover(|style| style.bg(theme::panel_hover()))
.on_click(cx.listener(move |this, _, _, cx| { .on_click(cx.listener(move |this, _, _, cx| {
this.state.selected_workspace_id = Some(workspace_id.clone()); this.state.selected_workspace_id = Some(workspace_id.clone());
cx.notify(); cx.notify();
@@ -28,18 +32,23 @@ impl AppRoot {
.child( .child(
div() div()
.text_sm() .text_sm()
.text_color(rgb(0x6f665d)) .text_color(theme::text_muted())
.child(workspace.local_path.clone()), .child(workspace.local_path.clone()),
) )
.child(div().text_sm().text_color(rgb(0x6f665d)).child(format!( .child(
"{} · {}", div()
workspace.state, .text_sm()
if workspace.is_primary { .text_color(theme::text_muted())
"primary" .child(format!(
} else { "{} · {}",
"linked" workspace.state,
} if workspace.is_primary {
))) "primary"
} else {
"linked"
}
)),
)
})) }))
} }
} }
@@ -1,4 +1,5 @@
mod app_root; mod app_root;
mod theme;
mod widgets; mod widgets;
use app_root::AppRoot; use app_root::AppRoot;
@@ -0,0 +1,81 @@
use gpui::{Hsla, rgb};
pub fn canvas() -> Hsla {
rgb(0xf3efe8).into()
}
pub fn shell_header() -> Hsla {
rgb(0xf8f2e9).into()
}
pub fn panel() -> Hsla {
rgb(0xfffbf5).into()
}
pub fn panel_border() -> Hsla {
rgb(0xd9cdbf).into()
}
pub fn panel_hover() -> Hsla {
rgb(0xf4ede4).into()
}
pub fn panel_inset() -> Hsla {
rgb(0xf7f0e7).into()
}
pub fn panel_inset_border() -> Hsla {
rgb(0xeee3d7).into()
}
pub fn text_primary() -> Hsla {
rgb(0x171411).into()
}
pub fn text_muted() -> Hsla {
rgb(0x6f665d).into()
}
pub fn primary_action() -> Hsla {
rgb(0x9e3d2d).into()
}
pub fn primary_action_hover() -> Hsla {
rgb(0xb24f3e).into()
}
pub fn primary_action_text() -> Hsla {
rgb(0xfff7f0).into()
}
pub fn danger_bg() -> Hsla {
rgb(0xffefe8).into()
}
pub fn sidebar_bg() -> Hsla {
rgb(0x161514).into()
}
pub fn sidebar_surface() -> Hsla {
rgb(0x211d1a).into()
}
pub fn sidebar_hover() -> Hsla {
rgb(0x2c2825).into()
}
pub fn sidebar_surface_hover() -> Hsla {
rgb(0x362c27).into()
}
pub fn sidebar_divider() -> Hsla {
rgb(0x2f2924).into()
}
pub fn sidebar_text() -> Hsla {
rgb(0xf5eee4).into()
}
pub fn selection_fill() -> Hsla {
rgb(0xefe2d4).into()
}
@@ -1,4 +1,5 @@
use gpui::{Context, SharedString, Window, div, prelude::*, rgb}; use crate::theme;
use gpui::{Context, SharedString, Window, div, prelude::*};
pub fn primary_button<V>( pub fn primary_button<V>(
label: &'static str, label: &'static str,
@@ -14,9 +15,9 @@ where
.py_2() .py_2()
.rounded_md() .rounded_md()
.cursor_pointer() .cursor_pointer()
.bg(rgb(0x9e3d2d)) .bg(theme::primary_action())
.text_color(rgb(0xfff7f0)) .text_color(theme::primary_action_text())
.hover(|style| style.bg(rgb(0xb24f3e))) .hover(|style| style.bg(theme::primary_action_hover()))
.on_click( .on_click(
cx.listener(move |this, _: &gpui::ClickEvent, _: &mut Window, cx| on_click(this, cx)), cx.listener(move |this, _: &gpui::ClickEvent, _: &mut Window, cx| on_click(this, cx)),
) )
@@ -37,11 +38,11 @@ where
.py_2() .py_2()
.rounded_md() .rounded_md()
.cursor_pointer() .cursor_pointer()
.bg(rgb(0xfffbf5)) .bg(theme::panel())
.border_1() .border_1()
.border_color(rgb(0xd9cdbf)) .border_color(theme::panel_border())
.text_color(rgb(0x171411)) .text_color(theme::text_primary())
.hover(|style| style.bg(rgb(0xf4ede4))) .hover(|style| style.bg(theme::panel_hover()))
.on_click( .on_click(
cx.listener(move |this, _: &gpui::ClickEvent, _: &mut Window, cx| on_click(this, cx)), cx.listener(move |this, _: &gpui::ClickEvent, _: &mut Window, cx| on_click(this, cx)),
) )
@@ -1,9 +1,9 @@
use crate::theme;
use gpui::{ use gpui::{
App, Bounds, Context, CursorStyle, Element, ElementId, ElementInputHandler, Entity, App, Bounds, Context, CursorStyle, Element, ElementId, ElementInputHandler, Entity,
EntityInputHandler, FocusHandle, Focusable, GlobalElementId, KeyBinding, LayoutId, MouseButton, EntityInputHandler, FocusHandle, Focusable, GlobalElementId, KeyBinding, LayoutId, MouseButton,
MouseDownEvent, PaintQuad, Pixels, Point, ShapedLine, SharedString, Style, TextRun, MouseDownEvent, PaintQuad, Pixels, Point, ShapedLine, SharedString, Style, TextRun,
UTF16Selection, Window, actions, div, fill, hsla, point, prelude::*, px, relative, rgb, size, UTF16Selection, Window, actions, div, fill, hsla, point, prelude::*, px, relative, size, white,
white,
}; };
use std::ops::Range; use std::ops::Range;
use unicode_segmentation::UnicodeSegmentation; use unicode_segmentation::UnicodeSegmentation;
@@ -371,7 +371,7 @@ impl Element for TextElement {
point(cursor_x, bounds.top()), point(cursor_x, bounds.top()),
size(px(2.0), bounds.bottom() - bounds.top()), size(px(2.0), bounds.bottom() - bounds.top()),
), ),
rgb(0x9e3d2d), theme::primary_action(),
); );
PrepaintState { line, cursor } PrepaintState { line, cursor }
} }
@@ -422,9 +422,9 @@ impl Render for TextInput {
.on_action(cx.listener(Self::paste)) .on_action(cx.listener(Self::paste))
.on_action(cx.listener(Self::show_character_palette)) .on_action(cx.listener(Self::show_character_palette))
.on_mouse_down(MouseButton::Left, cx.listener(Self::on_mouse_down)) .on_mouse_down(MouseButton::Left, cx.listener(Self::on_mouse_down))
.bg(rgb(0xfffbf5)) .bg(theme::panel())
.border_1() .border_1()
.border_color(rgb(0xd9cdbf)) .border_color(theme::panel_border())
.rounded_md() .rounded_md()
.px_3() .px_3()
.py_2() .py_2()