From 297cef14ed4b8a7b1aa69ec0dc6868fd65e65256 Mon Sep 17 00:00:00 2001 From: Nate Butler Date: Mon, 23 Oct 2023 11:21:48 -0400 Subject: [PATCH 1/5] WIP add Elevation Docs --- crates/ui2/src/elevation.rs | 63 +++++++++++++++++++++++++++++++++++++ crates/ui2/src/lib.rs | 1 + 2 files changed, 64 insertions(+) create mode 100644 crates/ui2/src/elevation.rs diff --git a/crates/ui2/src/elevation.rs b/crates/ui2/src/elevation.rs new file mode 100644 index 0000000000..22045af093 --- /dev/null +++ b/crates/ui2/src/elevation.rs @@ -0,0 +1,63 @@ +// TODO: Originally source from Material Design 3 +// TODO: Rewrite to be more Zed specific + +//! # Elevation +//! +//! Elevation in Zed applies to all surfaces and components. Elevation is categorized into levels. +//! +//! Elevation accomplishes the following: +//! - Allows surfaces to move in front of or behind others, such as content scrolling beneath app top bars. +//! - Reflects spatial relationships, for instance, how a floating action button’s shadow intimates its disconnection from a collection of cards. +//! - Directs attention to structures at the highest elevation, like a temporary dialog arising in front of other surfaces. +//! +//! Elevations are the initial elevation values assigned to components by default. +//! +//! Components may transition to a higher elevation in some cases, like user interations. +//! +//! On such occasions, components transition to predetermined dynamic elevation offsets. These are the typical elevations to which components move when they are not at rest. +//! +//! ## Understanding Elevation +//! +//! Elevation can be thought of as the physical closeness of an element to the user. Elements with lower elevations are physically further away from the user on the z-axis and appear to be underneath elements with higher elevations. +//! +//! Material Design 3 has a some great visualizations of elevation that may be helpful to understanding the mental modal of elevation. [Material Design – Elevation](https://m3.material.io/styles/elevation/overview) +//! +//! ## Elevation Level Overview +//! +//! Zed integrates six unique elevation levels in its design system. The elevation of a surface is expressed as a whole number ranging from 0 to 5, both numbers inclusive. A component’s elevation is ascertained by combining the component’s resting elevation with any dynamic elevation offsets. +//! +//! The levels are detailed as follows: +//! +//! 0. App Background (e.x.: Workspace, system window) +//! 1. UI Surface (e.x.: Title Bar, Panel, Tab Bar) +//! 2. Non-Modal Elevated Surfaces (e.x.: Floating Window) +//! 3. Elevated Elements (e.x.: Popover, Context Menu, Tooltip) +//! 4. Wash +//! 5. Modal Elevated Surfaces (e.x.: Palette, Modal, Notification) +//! 6. Dragged Element +//! +//! ## 0. App Background +//! +//! The app background constitutes the lowest elevation layer, appearing behind all other surfaces and components. It is predominantly used for the background color of the app. +//! +//! ## 1. UI Surface +//! +//! The UI Surface is the standard elevation for all elements and is placed above the app background. +//! +//! ## 2. Elevated Elements +//! +//! Elevated elements appear above the UI surface layer surfaces and components. Elevated elements are predominantly used for creating popovers, context menus, and tooltips. +//! +//! ## 3. Wash +//! +//! Wash denotes a distinct elevation reserved to isolate app UI layers from high elevation components such as modals, notifications, and overlaid panels. The wash may not consistently be visible when these components are active. This layer is often referred to as a scrim or overlay and the background color of the wash is typically deployed in its design. +//! +//! ## 4. Focused Element +//! +//! Focused elements obtain a higher elevation above surfaces and components at wash elevation. They are often used for modals, notifications, and overlaid panels and indicate that they are the sole element the user is interacting with at the moment. +//! +//! ## 5. Dragged Element +//! +//! Dragged elements gain the highest elevation, thus appearing above surfaces and components at the elevation of focused elements. These are typically used for elements that are being dragged, following the cursor + +pub enum Elevation {} diff --git a/crates/ui2/src/lib.rs b/crates/ui2/src/lib.rs index 841599c4b4..48ca6f5d2f 100644 --- a/crates/ui2/src/lib.rs +++ b/crates/ui2/src/lib.rs @@ -24,6 +24,7 @@ mod color; mod components; mod element_ext; mod elements; +mod elevation; pub mod prelude; pub mod settings; mod static_data; From c1c9db2ae2bf570cdf022075d699c812b9fc9b26 Mon Sep 17 00:00:00 2001 From: Nate Butler Date: Mon, 23 Oct 2023 13:50:39 -0400 Subject: [PATCH 2/5] Add elevation enums + docs --- crates/ui2/src/elevation.md | 85 ++++++++++++++++++++++++ crates/ui2/src/elevation.rs | 129 +++++++++++++++++++----------------- crates/ui2/src/prelude.rs | 1 + 3 files changed, 154 insertions(+), 61 deletions(-) create mode 100644 crates/ui2/src/elevation.md diff --git a/crates/ui2/src/elevation.md b/crates/ui2/src/elevation.md new file mode 100644 index 0000000000..08acc6b12e --- /dev/null +++ b/crates/ui2/src/elevation.md @@ -0,0 +1,85 @@ +TODO: Originally sourced from Material Design 3, Rewrite to be more Zed specific + +# Elevation + +Zed applies elevation to all surfaces and components, which are categorized into levels. + +Elevation accomplishes the following: +- Allows surfaces to move in front of or behind others, such as content scrolling beneath app top bars. +- Reflects spatial relationships, for instance, how a floating action button’s shadow intimates its disconnection from a collection of cards. +- Directs attention to structures at the highest elevation, like a temporary dialog arising in front of other surfaces. + +Elevations are the initial elevation values assigned to components by default. + +Components may transition to a higher elevation in some cases, like user interations. + +On such occasions, components transition to predetermined dynamic elevation offsets. These are the typical elevations to which components move when they are not at rest. + +## Understanding Elevation + +Elevation can be thought of as the physical closeness of an element to the user. Elements with lower elevations are physically further away from the user on the z-axis and appear to be underneath elements with higher elevations. + +Material Design 3 has a some great visualizations of elevation that may be helpful to understanding the mental modal of elevation. [Material Design – Elevation](https://m3.material.io/styles/elevation/overview) + +## Elevation + +1. App Background (e.x.: Workspace, system window) +1. UI Surface (e.x.: Title Bar, Panel, Tab Bar) +1. Elevated Surface (e.x.: Palette, Notification, Floating Window) +1. Wash +1. Modal Surfaces (e.x.: Modal) +1. Dragged Element (This is a special case, see Layer section below) + +### App Background + +The app background constitutes the lowest elevation layer, appearing behind all other surfaces and components. It is predominantly used for the background color of the app. + +### UI Surface + +The UI Surface, located above the app background, is the standard level for all elements + +Example Elements: Title Bar, Panel, Tab Bar, Editor + +### Elevated Surface + +Non-Modal Elevated Surfaces appear above the UI surface layer and is used for things that should appear above most UI elements like an editor or panel, but not elements like popovers, context menus, modals, etc. + +Examples: Notifications, Palettes, Detached/Floating Windows, Detached/Floating Panels + +You could imagine a variant of the assistant that floats in a window above the editor on this elevation, or a floating terminal window that becomes less opaque when not focused. + +### Wash + +Wash denotes a distinct elevation reserved to isolate app UI layers from high elevation components such as modals, notifications, and overlaid panels. The wash may not consistently be visible when these components are active. This layer is often referred to as a scrim or overlay and the background color of the wash is typically deployed in its design. + +### Modal Surfaces + +Modal Surfaces are used for elements that should appear above all other UI elements and are located above the wash layer. This is the maximum elevation at which UI elements can be rendered + +Elements rendered at this layer have an enforced behavior: Any interaction outside of the modal will either dismiss the modal or prompt an action (Save your progress, etc) then dismiss the modal. + +If the element does not have this behavior, it should be rendered at the Elevated Surface layer. + +## Layer +Each elevation that can contain elements has its own set of layers that are nested within the elevations. + +1. TBD (Z -1 layer) +1. Element (Text, button, surface, etc) +1. Elevated Element (Popover, Context Menu, Tooltip) +999. Dragged Element -> Highest Elevation + +Dragged elements jump to the highest elevation the app can render. An active drag should _always_ be the most foreground element in the app at any time. + +🚧 Work in Progress 🚧 + +## Element +Each elevation that can contain elements has it's own set of layers: + +1. Effects +1. Background +1. Tint +1. Highlight +1. Content +1. Overlay + +🚧 Work in Progress 🚧 diff --git a/crates/ui2/src/elevation.rs b/crates/ui2/src/elevation.rs index 22045af093..3218f3f5f1 100644 --- a/crates/ui2/src/elevation.rs +++ b/crates/ui2/src/elevation.rs @@ -1,63 +1,70 @@ -// TODO: Originally source from Material Design 3 -// TODO: Rewrite to be more Zed specific +#[doc = include_str!("elevation.md")] +#[derive(Debug, Clone, Copy, PartialEq, Eq)] +pub enum Elevation { + ElevationIndex(ElevationIndex), + LayerIndex(LayerIndex), + ElementIndex(ElementIndex), +} -//! # Elevation -//! -//! Elevation in Zed applies to all surfaces and components. Elevation is categorized into levels. -//! -//! Elevation accomplishes the following: -//! - Allows surfaces to move in front of or behind others, such as content scrolling beneath app top bars. -//! - Reflects spatial relationships, for instance, how a floating action button’s shadow intimates its disconnection from a collection of cards. -//! - Directs attention to structures at the highest elevation, like a temporary dialog arising in front of other surfaces. -//! -//! Elevations are the initial elevation values assigned to components by default. -//! -//! Components may transition to a higher elevation in some cases, like user interations. -//! -//! On such occasions, components transition to predetermined dynamic elevation offsets. These are the typical elevations to which components move when they are not at rest. -//! -//! ## Understanding Elevation -//! -//! Elevation can be thought of as the physical closeness of an element to the user. Elements with lower elevations are physically further away from the user on the z-axis and appear to be underneath elements with higher elevations. -//! -//! Material Design 3 has a some great visualizations of elevation that may be helpful to understanding the mental modal of elevation. [Material Design – Elevation](https://m3.material.io/styles/elevation/overview) -//! -//! ## Elevation Level Overview -//! -//! Zed integrates six unique elevation levels in its design system. The elevation of a surface is expressed as a whole number ranging from 0 to 5, both numbers inclusive. A component’s elevation is ascertained by combining the component’s resting elevation with any dynamic elevation offsets. -//! -//! The levels are detailed as follows: -//! -//! 0. App Background (e.x.: Workspace, system window) -//! 1. UI Surface (e.x.: Title Bar, Panel, Tab Bar) -//! 2. Non-Modal Elevated Surfaces (e.x.: Floating Window) -//! 3. Elevated Elements (e.x.: Popover, Context Menu, Tooltip) -//! 4. Wash -//! 5. Modal Elevated Surfaces (e.x.: Palette, Modal, Notification) -//! 6. Dragged Element -//! -//! ## 0. App Background -//! -//! The app background constitutes the lowest elevation layer, appearing behind all other surfaces and components. It is predominantly used for the background color of the app. -//! -//! ## 1. UI Surface -//! -//! The UI Surface is the standard elevation for all elements and is placed above the app background. -//! -//! ## 2. Elevated Elements -//! -//! Elevated elements appear above the UI surface layer surfaces and components. Elevated elements are predominantly used for creating popovers, context menus, and tooltips. -//! -//! ## 3. Wash -//! -//! Wash denotes a distinct elevation reserved to isolate app UI layers from high elevation components such as modals, notifications, and overlaid panels. The wash may not consistently be visible when these components are active. This layer is often referred to as a scrim or overlay and the background color of the wash is typically deployed in its design. -//! -//! ## 4. Focused Element -//! -//! Focused elements obtain a higher elevation above surfaces and components at wash elevation. They are often used for modals, notifications, and overlaid panels and indicate that they are the sole element the user is interacting with at the moment. -//! -//! ## 5. Dragged Element -//! -//! Dragged elements gain the highest elevation, thus appearing above surfaces and components at the elevation of focused elements. These are typically used for elements that are being dragged, following the cursor +#[derive(Debug, Clone, Copy, PartialEq, Eq)] +pub enum ElevationIndex { + AppBackground, + UISurface, + ElevatedSurface, + Wash, + ModalSurfaces, + DraggedElement, +} -pub enum Elevation {} +impl ElevationIndex { + pub fn usize(&self) -> usize { + match *self { + ElevationIndex::AppBackground => 0, + ElevationIndex::UISurface => 100, + ElevationIndex::ElevatedSurface => 200, + ElevationIndex::Wash => 300, + ElevationIndex::ModalSurfaces => 400, + ElevationIndex::DraggedElement => 900, + } + } +} + +#[derive(Debug, Clone, Copy, PartialEq, Eq)] +pub enum LayerIndex { + BehindElement, + Element, + ElevatedElement, +} + +impl LayerIndex { + pub fn usize(&self) -> usize { + match *self { + LayerIndex::BehindElement => 0, + LayerIndex::Element => 100, + LayerIndex::ElevatedElement => 200, + } + } +} + +#[derive(Debug, Clone, Copy, PartialEq, Eq)] +pub enum ElementIndex { + Effect, + Background, + Tint, + Highlight, + Content, + Overlay, +} + +impl ElementIndex { + pub fn usize(&self) -> usize { + match *self { + ElementIndex::Effect => 0, + ElementIndex::Background => 100, + ElementIndex::Tint => 200, + ElementIndex::Highlight => 300, + ElementIndex::Content => 400, + ElementIndex::Overlay => 500, + } + } +} diff --git a/crates/ui2/src/prelude.rs b/crates/ui2/src/prelude.rs index c79c30ee68..05f21f0a24 100644 --- a/crates/ui2/src/prelude.rs +++ b/crates/ui2/src/prelude.rs @@ -4,6 +4,7 @@ pub use gpui2::{ }; pub use crate::color::*; +pub use crate::elevation::*; use crate::settings::user_settings; pub use crate::{theme, ButtonVariant, ElementExt, Theme}; From e99d862f3f3f87c14527fb9f88b11bd2e04d72a8 Mon Sep 17 00:00:00 2001 From: Nate Butler Date: Mon, 23 Oct 2023 14:50:53 -0400 Subject: [PATCH 3/5] WIP Button Refactor --- crates/ui2/src/color.rs | 8 +- crates/ui2/src/elements/button.rs | 127 +++++++++++++++--------------- 2 files changed, 67 insertions(+), 68 deletions(-) diff --git a/crates/ui2/src/color.rs b/crates/ui2/src/color.rs index 7e7453dc72..03e141831b 100644 --- a/crates/ui2/src/color.rs +++ b/crates/ui2/src/color.rs @@ -166,13 +166,13 @@ impl ThemeColor { surface: theme.middle.base.default.background, background: theme.lowest.base.default.background, filled_element: theme.lowest.base.default.background, - filled_element_hover: theme.lowest.base.hovered.background, - filled_element_active: theme.lowest.base.active.background, + filled_element_hover: hsla(0.0, 0.0, 100.0, 0.16), + filled_element_active: hsla(0.0, 0.0, 100.0, 0.32), filled_element_selected: theme.lowest.accent.default.background, filled_element_disabled: transparent, ghost_element: transparent, - ghost_element_hover: theme.lowest.base.default.background, - ghost_element_active: theme.lowest.base.hovered.background, + ghost_element_hover: hsla(0.0, 0.0, 100.0, 0.08), + ghost_element_active: hsla(0.0, 0.0, 100.0, 0.16), ghost_element_selected: theme.lowest.accent.default.background, ghost_element_disabled: transparent, text: theme.lowest.base.default.foreground, diff --git a/crates/ui2/src/elements/button.rs b/crates/ui2/src/elements/button.rs index 9d7897cb24..d38905ef57 100644 --- a/crates/ui2/src/elements/button.rs +++ b/crates/ui2/src/elements/button.rs @@ -1,7 +1,7 @@ use std::marker::PhantomData; use std::sync::Arc; -use gpui2::{DefiniteLength, Hsla, MouseButton, WindowContext}; +use gpui2::{div, DefiniteLength, Hsla, MouseButton, WindowContext}; use crate::settings::user_settings; use crate::{h_stack, Icon, IconColor, IconElement, Label, LabelColor}; @@ -21,6 +21,35 @@ pub enum ButtonVariant { Filled, } +impl ButtonVariant { + pub fn bg_color(&self, cx: &mut WindowContext) -> Hsla { + let color = ThemeColor::new(cx); + + match self { + ButtonVariant::Ghost => color.ghost_element, + ButtonVariant::Filled => color.filled_element, + } + } + + pub fn bg_color_hover(&self, cx: &mut WindowContext) -> Hsla { + let color = ThemeColor::new(cx); + + match self { + ButtonVariant::Ghost => color.ghost_element_hover, + ButtonVariant::Filled => color.filled_element_hover, + } + } + + pub fn bg_color_active(&self, cx: &mut WindowContext) -> Hsla { + let color = ThemeColor::new(cx); + + match self { + ButtonVariant::Ghost => color.ghost_element_active, + ButtonVariant::Filled => color.filled_element_active, + } + } +} + pub type ClickHandler = Arc) + 'static + Send + Sync>; struct ButtonHandlers { @@ -36,26 +65,26 @@ impl Default for ButtonHandlers { #[derive(Element)] pub struct Button { state_type: PhantomData, - label: SharedString, - variant: ButtonVariant, - state: InteractionState, + disabled: bool, + handlers: ButtonHandlers, icon: Option, icon_position: Option, + label: SharedString, + variant: ButtonVariant, width: Option, - handlers: ButtonHandlers, } impl Button { pub fn new(label: impl Into) -> Self { Self { state_type: PhantomData, - label: label.into(), - variant: Default::default(), - state: Default::default(), + disabled: false, + handlers: ButtonHandlers::default(), icon: None, icon_position: None, + label: label.into(), + variant: Default::default(), width: Default::default(), - handlers: ButtonHandlers::default(), } } @@ -68,11 +97,6 @@ impl Button { self } - pub fn state(mut self, state: InteractionState) -> Self { - self.state = state; - self - } - pub fn icon(mut self, icon: Icon) -> Self { self.icon = Some(icon); self @@ -96,43 +120,24 @@ impl Button { self } - fn background_color(&self, cx: &mut ViewContext) -> Hsla { - let color = ThemeColor::new(cx); - - match (self.variant, self.state) { - (ButtonVariant::Ghost, InteractionState::Enabled) => color.ghost_element, - (ButtonVariant::Ghost, InteractionState::Focused) => color.ghost_element, - (ButtonVariant::Ghost, InteractionState::Hovered) => color.ghost_element_hover, - (ButtonVariant::Ghost, InteractionState::Active) => color.ghost_element_active, - (ButtonVariant::Ghost, InteractionState::Disabled) => color.filled_element_disabled, - (ButtonVariant::Filled, InteractionState::Enabled) => color.filled_element, - (ButtonVariant::Filled, InteractionState::Focused) => color.filled_element, - (ButtonVariant::Filled, InteractionState::Hovered) => color.filled_element_hover, - (ButtonVariant::Filled, InteractionState::Active) => color.filled_element_active, - (ButtonVariant::Filled, InteractionState::Disabled) => color.filled_element_disabled, - } + pub fn disabled(mut self, disabled: bool) -> Self { + self.disabled = disabled; + self } fn label_color(&self) -> LabelColor { - match self.state { - InteractionState::Disabled => LabelColor::Disabled, - _ => Default::default(), + if self.disabled { + LabelColor::Disabled + } else { + self.label_color() } } fn icon_color(&self) -> IconColor { - match self.state { - InteractionState::Disabled => IconColor::Disabled, - _ => Default::default(), - } - } - - fn border_color(&self, cx: &WindowContext) -> Hsla { - let color = ThemeColor::new(cx); - - match self.state { - InteractionState::Focused => color.border_focused, - _ => color.border_transparent, + if self.disabled { + IconColor::Disabled + } else { + self.icon_color() } } @@ -151,53 +156,47 @@ impl Button { _view: &mut S, cx: &mut ViewContext, ) -> impl Element { - let icon_color = self.icon_color(); - let border_color = self.border_color(cx); + let color = ThemeColor::new(cx); let settings = user_settings(cx); + let icon_color = self.icon_color(); - let mut el = h_stack() + let mut button = h_stack() + .relative() + .id(SharedString::from(format!("{}", self.label))) .p_1() .text_size(ui_size(cx, 1.)) .rounded_md() - .border() - .border_color(border_color) - .bg(self.background_color(cx)) - .hover(|style| { - let color = ThemeColor::new(cx); - - style.bg(match self.variant { - ButtonVariant::Ghost => color.ghost_element_hover, - ButtonVariant::Filled => color.filled_element_hover, - }) - }); + .bg(self.variant.bg_color(cx)) + .hover(|style| style.bg(self.variant.bg_color_hover(cx))) + .active(|style| style.bg(self.variant.bg_color_active(cx))); match (self.icon, self.icon_position) { (Some(_), Some(IconPosition::Left)) => { - el = el + button = button .gap_1() .child(self.render_label()) .children(self.render_icon(icon_color)) } (Some(_), Some(IconPosition::Right)) => { - el = el + button = button .gap_1() .children(self.render_icon(icon_color)) .child(self.render_label()) } - (_, _) => el = el.child(self.render_label()), + (_, _) => button = button.child(self.render_label()), } if let Some(width) = self.width { - el = el.w(width).justify_center(); + button = button.w(width).justify_center(); } if let Some(click_handler) = self.handlers.click.clone() { - el = el.on_mouse_down(MouseButton::Left, move |state, event, cx| { + button = button.on_mouse_down(MouseButton::Left, move |state, event, cx| { click_handler(state, cx); }); } - el + button } } From 6f5cf10acb31297dd9b61469b74e67a3a0014a56 Mon Sep 17 00:00:00 2001 From: Marshall Bowers Date: Tue, 24 Oct 2023 11:39:10 +0200 Subject: [PATCH 4/5] Comment out `.state` setting --- crates/ui2/src/elements/button.rs | 26 +++++++++----------------- 1 file changed, 9 insertions(+), 17 deletions(-) diff --git a/crates/ui2/src/elements/button.rs b/crates/ui2/src/elements/button.rs index d38905ef57..34e5636dc7 100644 --- a/crates/ui2/src/elements/button.rs +++ b/crates/ui2/src/elements/button.rs @@ -272,9 +272,7 @@ mod stories { Label::new(state.to_string()).color(LabelColor::Muted), ) .child( - Button::new("Label") - .variant(ButtonVariant::Ghost) - .state(state), + Button::new("Label").variant(ButtonVariant::Ghost), // .state(state), ) }))) .child(Story::label(cx, "Ghost – Left Icon")) @@ -288,8 +286,7 @@ mod stories { Button::new("Label") .variant(ButtonVariant::Ghost) .icon(Icon::Plus) - .icon_position(IconPosition::Left) - .state(state), + .icon_position(IconPosition::Left), // .state(state), ) }))) .child(Story::label(cx, "Ghost – Right Icon")) @@ -303,8 +300,7 @@ mod stories { Button::new("Label") .variant(ButtonVariant::Ghost) .icon(Icon::Plus) - .icon_position(IconPosition::Right) - .state(state), + .icon_position(IconPosition::Right), // .state(state), ) }))), ) @@ -318,9 +314,7 @@ mod stories { Label::new(state.to_string()).color(LabelColor::Muted), ) .child( - Button::new("Label") - .variant(ButtonVariant::Filled) - .state(state), + Button::new("Label").variant(ButtonVariant::Filled), // .state(state), ) }))) .child(Story::label(cx, "Filled – Left Button")) @@ -334,8 +328,7 @@ mod stories { Button::new("Label") .variant(ButtonVariant::Filled) .icon(Icon::Plus) - .icon_position(IconPosition::Left) - .state(state), + .icon_position(IconPosition::Left), // .state(state), ) }))) .child(Story::label(cx, "Filled – Right Button")) @@ -349,8 +342,7 @@ mod stories { Button::new("Label") .variant(ButtonVariant::Filled) .icon(Icon::Plus) - .icon_position(IconPosition::Right) - .state(state), + .icon_position(IconPosition::Right), // .state(state), ) }))), ) @@ -366,7 +358,7 @@ mod stories { .child( Button::new("Label") .variant(ButtonVariant::Filled) - .state(state) + // .state(state) .width(Some(rems(6.).into())), ) }))) @@ -380,7 +372,7 @@ mod stories { .child( Button::new("Label") .variant(ButtonVariant::Filled) - .state(state) + // .state(state) .icon(Icon::Plus) .icon_position(IconPosition::Left) .width(Some(rems(6.).into())), @@ -396,7 +388,7 @@ mod stories { .child( Button::new("Label") .variant(ButtonVariant::Filled) - .state(state) + // .state(state) .icon(Icon::Plus) .icon_position(IconPosition::Right) .width(Some(rems(6.).into())), From 171db00f6ef06a229b4e9646d3180e4f7cf4dc82 Mon Sep 17 00:00:00 2001 From: Marshall Bowers Date: Tue, 24 Oct 2023 11:39:15 +0200 Subject: [PATCH 5/5] Fix stack overflow --- crates/ui2/src/elements/button.rs | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/crates/ui2/src/elements/button.rs b/crates/ui2/src/elements/button.rs index 34e5636dc7..c3413399cd 100644 --- a/crates/ui2/src/elements/button.rs +++ b/crates/ui2/src/elements/button.rs @@ -129,7 +129,7 @@ impl Button { if self.disabled { LabelColor::Disabled } else { - self.label_color() + Default::default() } } @@ -137,7 +137,7 @@ impl Button { if self.disabled { IconColor::Disabled } else { - self.icon_color() + Default::default() } }