theme: Update GPUI and imporve dark color. (#358)
## Before <img width="1712" alt="image" src="https://github.com/user-attachments/assets/f4e74cf0-e386-4e91-86d1-05ee75b26471"> ## After <img width="1712" alt="image" src="https://github.com/user-attachments/assets/da393ea9-79ee-4535-a46d-68684d7ad738">
This commit is contained in:
Jason Lee
GitHub
parent
6b54396c9c
commit
f35db249a6
5 changed files with 54 additions and 45 deletions
24
Cargo.lock
generated
24
Cargo.lock
generated
|
|
@ -474,7 +474,7 @@ dependencies = [
|
|||
"bitflags 2.6.0",
|
||||
"cexpr",
|
||||
"clang-sys",
|
||||
"itertools 0.13.0",
|
||||
"itertools 0.11.0",
|
||||
"log",
|
||||
"prettyplease",
|
||||
"proc-macro2",
|
||||
|
|
@ -947,7 +947,7 @@ dependencies = [
|
|||
[[package]]
|
||||
name = "collections"
|
||||
version = "0.1.0"
|
||||
source = "git+https://github.com/huacnlee/zed.git?branch=export-platform-window#e681a4bad2503f0cd8dec16d29591318a344a06a"
|
||||
source = "git+https://github.com/huacnlee/zed.git?branch=export-platform-window#d048d70f8d4349dddbae0bea280d3264d87ba22f"
|
||||
dependencies = [
|
||||
"rustc-hash",
|
||||
]
|
||||
|
|
@ -1282,7 +1282,7 @@ dependencies = [
|
|||
[[package]]
|
||||
name = "derive_refineable"
|
||||
version = "0.1.0"
|
||||
source = "git+https://github.com/huacnlee/zed.git?branch=export-platform-window#e681a4bad2503f0cd8dec16d29591318a344a06a"
|
||||
source = "git+https://github.com/huacnlee/zed.git?branch=export-platform-window#d048d70f8d4349dddbae0bea280d3264d87ba22f"
|
||||
dependencies = [
|
||||
"proc-macro2",
|
||||
"quote",
|
||||
|
|
@ -2223,7 +2223,7 @@ dependencies = [
|
|||
[[package]]
|
||||
name = "gpui"
|
||||
version = "0.1.0"
|
||||
source = "git+https://github.com/huacnlee/zed.git?branch=export-platform-window#e681a4bad2503f0cd8dec16d29591318a344a06a"
|
||||
source = "git+https://github.com/huacnlee/zed.git?branch=export-platform-window#d048d70f8d4349dddbae0bea280d3264d87ba22f"
|
||||
dependencies = [
|
||||
"anyhow",
|
||||
"as-raw-xcb-connection",
|
||||
|
|
@ -2322,7 +2322,7 @@ dependencies = [
|
|||
[[package]]
|
||||
name = "gpui_macros"
|
||||
version = "0.1.0"
|
||||
source = "git+https://github.com/huacnlee/zed.git?branch=export-platform-window#e681a4bad2503f0cd8dec16d29591318a344a06a"
|
||||
source = "git+https://github.com/huacnlee/zed.git?branch=export-platform-window#d048d70f8d4349dddbae0bea280d3264d87ba22f"
|
||||
dependencies = [
|
||||
"proc-macro2",
|
||||
"quote",
|
||||
|
|
@ -2506,7 +2506,7 @@ dependencies = [
|
|||
[[package]]
|
||||
name = "http_client"
|
||||
version = "0.1.0"
|
||||
source = "git+https://github.com/huacnlee/zed.git?branch=export-platform-window#e681a4bad2503f0cd8dec16d29591318a344a06a"
|
||||
source = "git+https://github.com/huacnlee/zed.git?branch=export-platform-window#d048d70f8d4349dddbae0bea280d3264d87ba22f"
|
||||
dependencies = [
|
||||
"anyhow",
|
||||
"bytes",
|
||||
|
|
@ -3023,7 +3023,7 @@ dependencies = [
|
|||
[[package]]
|
||||
name = "media"
|
||||
version = "0.1.0"
|
||||
source = "git+https://github.com/huacnlee/zed.git?branch=export-platform-window#e681a4bad2503f0cd8dec16d29591318a344a06a"
|
||||
source = "git+https://github.com/huacnlee/zed.git?branch=export-platform-window#d048d70f8d4349dddbae0bea280d3264d87ba22f"
|
||||
dependencies = [
|
||||
"anyhow",
|
||||
"bindgen",
|
||||
|
|
@ -3325,7 +3325,7 @@ version = "0.7.3"
|
|||
source = "registry+https://github.com/rust-lang/crates.io-index"
|
||||
checksum = "af1844ef2428cc3e1cb900be36181049ef3d3193c63e43026cfe202983b27a56"
|
||||
dependencies = [
|
||||
"proc-macro-crate 3.1.0",
|
||||
"proc-macro-crate 1.3.1",
|
||||
"proc-macro2",
|
||||
"quote",
|
||||
"syn 2.0.71",
|
||||
|
|
@ -4288,7 +4288,7 @@ dependencies = [
|
|||
[[package]]
|
||||
name = "refineable"
|
||||
version = "0.1.0"
|
||||
source = "git+https://github.com/huacnlee/zed.git?branch=export-platform-window#e681a4bad2503f0cd8dec16d29591318a344a06a"
|
||||
source = "git+https://github.com/huacnlee/zed.git?branch=export-platform-window#d048d70f8d4349dddbae0bea280d3264d87ba22f"
|
||||
dependencies = [
|
||||
"derive_refineable",
|
||||
]
|
||||
|
|
@ -4591,7 +4591,7 @@ checksum = "d369a96f978623eb3dc28807c4852d6cc617fed53da5d3c400feff1ef34a714a"
|
|||
[[package]]
|
||||
name = "semantic_version"
|
||||
version = "0.1.0"
|
||||
source = "git+https://github.com/huacnlee/zed.git?branch=export-platform-window#e681a4bad2503f0cd8dec16d29591318a344a06a"
|
||||
source = "git+https://github.com/huacnlee/zed.git?branch=export-platform-window#d048d70f8d4349dddbae0bea280d3264d87ba22f"
|
||||
dependencies = [
|
||||
"anyhow",
|
||||
"serde",
|
||||
|
|
@ -5008,7 +5008,7 @@ checksum = "13c2bddecc57b384dee18652358fb23172facb8a2c51ccc10d74c157bdea3292"
|
|||
[[package]]
|
||||
name = "sum_tree"
|
||||
version = "0.1.0"
|
||||
source = "git+https://github.com/huacnlee/zed.git?branch=export-platform-window#e681a4bad2503f0cd8dec16d29591318a344a06a"
|
||||
source = "git+https://github.com/huacnlee/zed.git?branch=export-platform-window#d048d70f8d4349dddbae0bea280d3264d87ba22f"
|
||||
dependencies = [
|
||||
"arrayvec",
|
||||
"log",
|
||||
|
|
@ -5616,7 +5616,7 @@ checksum = "09cc8ee72d2a9becf2f2febe0205bbed8fc6615b7cb429ad062dc7b7ddd036a9"
|
|||
[[package]]
|
||||
name = "util"
|
||||
version = "0.1.0"
|
||||
source = "git+https://github.com/huacnlee/zed.git?branch=export-platform-window#e681a4bad2503f0cd8dec16d29591318a344a06a"
|
||||
source = "git+https://github.com/huacnlee/zed.git?branch=export-platform-window#d048d70f8d4349dddbae0bea280d3264d87ba22f"
|
||||
dependencies = [
|
||||
"anyhow",
|
||||
"async-fs 1.6.0",
|
||||
|
|
|
|||
|
|
@ -289,8 +289,7 @@ impl ModalStory {
|
|||
|
||||
let overlay = self.modal_overlay;
|
||||
cx.open_drawer(move |this, cx| {
|
||||
this.margin_top(px(33.))
|
||||
.placement(placement)
|
||||
this.placement(placement)
|
||||
.overlay(overlay)
|
||||
.size(px(400.))
|
||||
.title("Drawer Title")
|
||||
|
|
|
|||
|
|
@ -14,6 +14,7 @@ use crate::{
|
|||
root::ContextModal as _,
|
||||
scroll::ScrollbarAxis,
|
||||
theme::ActiveTheme,
|
||||
title_bar::TITLE_BAR_HEIGHT,
|
||||
v_flex, IconName, Placement, Sizable, StyledExt as _,
|
||||
};
|
||||
|
||||
|
|
@ -48,7 +49,7 @@ impl Drawer {
|
|||
title: None,
|
||||
footer: None,
|
||||
content: v_flex(),
|
||||
margin_top: px(0.),
|
||||
margin_top: TITLE_BAR_HEIGHT,
|
||||
overlay: true,
|
||||
on_close: Rc::new(|_, _| {}),
|
||||
}
|
||||
|
|
|
|||
|
|
@ -144,6 +144,7 @@ impl Colorize for Hsla {
|
|||
#[derive(Debug, Clone, Copy)]
|
||||
struct Colors {
|
||||
pub title_bar_background: Hsla,
|
||||
pub title_bar_border: Hsla,
|
||||
pub background: Hsla,
|
||||
pub foreground: Hsla,
|
||||
pub card: Hsla,
|
||||
|
|
@ -186,6 +187,7 @@ impl Colors {
|
|||
fn light() -> Colors {
|
||||
Colors {
|
||||
title_bar_background: hsl(0.0, 0.0, 100.),
|
||||
title_bar_border: hsl(240.0, 5.9, 90.0),
|
||||
background: hsl(0.0, 0.0, 100.),
|
||||
foreground: hsl(240.0, 10., 3.9),
|
||||
card: hsl(0.0, 0.0, 100.0),
|
||||
|
|
@ -196,9 +198,9 @@ impl Colors {
|
|||
primary_hover: hsl(223.0, 5.9, 15.0),
|
||||
primary_active: hsl(223.0, 1.9, 25.0),
|
||||
primary_foreground: hsl(223.0, 0.0, 98.0),
|
||||
secondary: hsl(240.0, 4.8, 95.9),
|
||||
secondary_hover: hsl(240.0, 5.8, 10.).opacity(0.05),
|
||||
secondary_active: hsl(240.0, 5.9, 10.).opacity(0.1),
|
||||
secondary: hsl(240.0, 5.9, 96.9),
|
||||
secondary_hover: hsl(240.0, 5.9, 98.),
|
||||
secondary_active: hsl(240.0, 5.9, 93.),
|
||||
secondary_foreground: hsl(240.0, 59.0, 10.),
|
||||
destructive: hsl(0.0, 84.2, 60.2),
|
||||
destructive_hover: hsl(0.0, 84.2, 65.0),
|
||||
|
|
@ -227,41 +229,42 @@ impl Colors {
|
|||
|
||||
fn dark() -> Colors {
|
||||
Colors {
|
||||
title_bar_background: hsl(0., 0., 12.),
|
||||
background: hsl(0.0, 0.0, 6.0),
|
||||
foreground: hsl(0., 0., 98.),
|
||||
card: hsl(299.0, 2., 9.),
|
||||
card_foreground: hsl(0.0, 0.0, 98.0),
|
||||
popover: hsl(240.0, 10.0, 3.9),
|
||||
popover_foreground: hsl(0.0, 0.0, 98.0),
|
||||
title_bar_background: hsl(0., 0., 9.7),
|
||||
title_bar_border: hsl(240.0, 3.7, 15.9),
|
||||
background: hsl(0.0, 0.0, 8.0),
|
||||
foreground: hsl(0., 0., 78.),
|
||||
card: hsl(299.0, 2., 11.),
|
||||
card_foreground: hsl(0.0, 0.0, 78.0),
|
||||
popover: hsl(0.0, 0.0, 10.),
|
||||
popover_foreground: hsl(0.0, 0.0, 78.0),
|
||||
primary: hsl(223.0, 0.0, 98.0),
|
||||
primary_hover: hsl(223.0, 0.0, 90.0),
|
||||
primary_active: hsl(223.0, 0.0, 80.0),
|
||||
primary_foreground: hsl(223.0, 5.9, 10.0),
|
||||
secondary: hsl(240.0, 3.7, 15.9),
|
||||
secondary_hover: hsl(240.0, 3.7, 20.9).opacity(0.5),
|
||||
secondary_active: hsl(240.0, 3.7, 20.9).opacity(0.8),
|
||||
secondary_foreground: hsl(0.0, 0.0, 98.0),
|
||||
secondary: hsl(240.0, 3.7, 17.9),
|
||||
secondary_hover: hsl(240.0, 3.7, 22.9).opacity(0.5),
|
||||
secondary_active: hsl(240.0, 3.7, 22.9).opacity(0.8),
|
||||
secondary_foreground: hsl(0.0, 0.0, 78.0),
|
||||
destructive: hsl(0.0, 62.8, 30.6),
|
||||
destructive_hover: hsl(0.0, 62.8, 35.6),
|
||||
destructive_active: hsl(0.0, 62.8, 20.6),
|
||||
destructive_foreground: hsl(0.0, 0.0, 98.0),
|
||||
destructive_foreground: hsl(0.0, 0.0, 78.0),
|
||||
muted: hsl(240.0, 3.7, 15.9),
|
||||
muted_foreground: hsl(240.0, 5.0, 64.9),
|
||||
accent: hsl(240.0, 3.7, 15.9),
|
||||
accent_foreground: hsl(0.0, 0.0, 98.0),
|
||||
border: hsl(240.0, 3.7, 15.9),
|
||||
accent_foreground: hsl(0.0, 0.0, 78.0),
|
||||
border: hsl(240.0, 3.7, 16.9),
|
||||
input: hsl(240.0, 3.7, 15.9),
|
||||
ring: hsl(240.0, 4.9, 83.9),
|
||||
selection: hsl(211.0, 97.0, 22.0),
|
||||
scrollbar: hsl(240., 1., 15.).opacity(0.3),
|
||||
scrollbar_thumb: hsl(0., 0., 68.),
|
||||
panel: hsl(299.0, 2., 9.),
|
||||
tab_bar: hsl(299.0, 2., 9.),
|
||||
list: hsl(0.0, 0.0, 6.0),
|
||||
list_even: hsl(240.0, 3.7, 8.0),
|
||||
list_active: hsl(240.0, 3.7, 15.0),
|
||||
list_head: hsl(0.0, 0.0, 6.0),
|
||||
panel: hsl(299.0, 2., 11.),
|
||||
tab_bar: hsl(299.0, 0., 5.5),
|
||||
list: hsl(0.0, 0.0, 8.0),
|
||||
list_even: hsl(240.0, 3.7, 10.0),
|
||||
list_active: hsl(240.0, 3.7, 17.0),
|
||||
list_head: hsl(0.0, 0.0, 8.0),
|
||||
link: hsl(221.0, 83.0, 53.0),
|
||||
drop_target: hsl(235.0, 30., 44.0).opacity(0.1),
|
||||
}
|
||||
|
|
@ -273,6 +276,7 @@ pub struct Theme {
|
|||
pub mode: ThemeMode,
|
||||
pub transparent: Hsla,
|
||||
pub title_bar_background: Hsla,
|
||||
pub title_bar_border: Hsla,
|
||||
/// Basic font size
|
||||
pub font_size: f32,
|
||||
pub font_family: SharedString,
|
||||
|
|
@ -348,6 +352,7 @@ impl Theme {
|
|||
|
||||
pub fn apply_color(&mut self, mask_color: Hsla) {
|
||||
self.title_bar_background = self.title_bar_background.apply(mask_color);
|
||||
self.title_bar_border = self.title_bar_border.apply(mask_color);
|
||||
self.background = self.background.apply(mask_color);
|
||||
self.foreground = self.foreground.apply(mask_color);
|
||||
self.card = self.card.apply(mask_color);
|
||||
|
|
@ -362,10 +367,10 @@ impl Theme {
|
|||
self.secondary_hover = self.secondary_hover.apply(mask_color);
|
||||
self.secondary_active = self.secondary_active.apply(mask_color);
|
||||
self.secondary_foreground = self.secondary_foreground.apply(mask_color);
|
||||
self.destructive = self.destructive.apply(mask_color);
|
||||
self.destructive_hover = self.destructive_hover.apply(mask_color);
|
||||
self.destructive_active = self.destructive_active.apply(mask_color);
|
||||
self.destructive_foreground = self.destructive_foreground.apply(mask_color);
|
||||
// self.destructive = self.destructive.apply(mask_color);
|
||||
// self.destructive_hover = self.destructive_hover.apply(mask_color);
|
||||
// self.destructive_active = self.destructive_active.apply(mask_color);
|
||||
// self.destructive_foreground = self.destructive_foreground.apply(mask_color);
|
||||
self.muted = self.muted.apply(mask_color);
|
||||
self.muted_foreground = self.muted_foreground.apply(mask_color);
|
||||
self.accent = self.accent.apply(mask_color);
|
||||
|
|
@ -424,6 +429,7 @@ impl From<Colors> for Theme {
|
|||
radius: 4.0,
|
||||
shadow: true,
|
||||
title_bar_background: colors.title_bar_background,
|
||||
title_bar_border: colors.title_bar_border,
|
||||
background: colors.background,
|
||||
foreground: colors.foreground,
|
||||
card: colors.card,
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
use crate::{h_flex, theme::ActiveTheme, Icon, IconName, InteractiveElementExt as _, Sizable as _};
|
||||
use gpui::{
|
||||
div, prelude::FluentBuilder as _, px, AnyElement, Hsla, InteractiveElement as _, IntoElement,
|
||||
ParentElement, RenderOnce, StatefulInteractiveElement as _, Styled, WindowContext,
|
||||
ParentElement, Pixels, RenderOnce, StatefulInteractiveElement as _, Styled, WindowContext,
|
||||
};
|
||||
|
||||
/// TitleBar used to customize the appearance of the title bar.
|
||||
|
|
@ -12,6 +12,8 @@ pub struct TitleBar {
|
|||
children: Vec<AnyElement>,
|
||||
}
|
||||
|
||||
pub const TITLE_BAR_HEIGHT: Pixels = px(35.);
|
||||
|
||||
impl TitleBar {
|
||||
pub fn new() -> Self {
|
||||
Self {
|
||||
|
|
@ -120,7 +122,7 @@ impl RenderOnce for ControlIcon {
|
|||
.id(self.id())
|
||||
.flex()
|
||||
.cursor_pointer()
|
||||
.w(px(35.))
|
||||
.w(TITLE_BAR_HEIGHT)
|
||||
.h_full()
|
||||
.justify_center()
|
||||
.content_center()
|
||||
|
|
@ -189,7 +191,8 @@ impl RenderOnce for TitleBar {
|
|||
this.when_some(macos_pl, |this, pl| this.pl(pl))
|
||||
})
|
||||
.border_b_1()
|
||||
.border_color(cx.theme().border)
|
||||
.border_color(cx.theme().title_bar_border)
|
||||
.bg(cx.theme().title_bar_background)
|
||||
.on_double_click(|_, cx| cx.zoom_window())
|
||||
.child(
|
||||
h_flex()
|
||||
|
|
|
|||
Loading…
Reference in a new issue