Trait StyledExt

Source

pub trait StyledExt: Styled + Sized {
Show 16 methods    // Provided methods
    fn h_flex(self) -> Self { ... }
    fn v_flex(self) -> Self { ... }
    fn elevation_1(self, cx: &App) -> Self { ... }
    fn elevation_1_borderless(self, cx: &mut App) -> Self { ... }
    fn elevation_2(self, cx: &App) -> Self { ... }
    fn elevation_2_borderless(self, cx: &mut App) -> Self { ... }
    fn elevation_3(self, cx: &App) -> Self { ... }
    fn elevation_3_borderless(self, cx: &mut App) -> Self { ... }
    fn border_primary(self, cx: &mut App) -> Self { ... }
    fn border_muted(self, cx: &mut App) -> Self { ... }
    fn debug_bg_red(self) -> Self { ... }
    fn debug_bg_green(self) -> Self { ... }
    fn debug_bg_blue(self) -> Self { ... }
    fn debug_bg_yellow(self) -> Self { ... }
    fn debug_bg_cyan(self) -> Self { ... }
    fn debug_bg_magenta(self) -> Self { ... }
}

Expand description

Extends gpui::Styled with app-specific styling methods.

Provided Methods§

Source

fn h_flex(self) -> Self

Horizontally stacks elements.

Sets flex(), flex_row(), items_center()

Source

fn v_flex(self) -> Self

Vertically stacks elements.

Sets flex(), flex_col()

Source

fn elevation_1(self, cx: &App) -> Self

The Surface elevation level, located above the app background, is the standard level for all elements

Sets bg(), rounded_lg(), border(), border_color(), shadow()

Example Elements: Title Bar, Panel, Tab Bar, Editor

Source

fn elevation_1_borderless(self, cx: &mut App) -> Self

See elevation_1.

Renders a borderless version elevation_1.

Source

fn elevation_2(self, cx: &App) -> Self

Non-Modal Elevated Surfaces appear above the 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.

Sets bg(), rounded_lg(), border(), border_color(), shadow()

Examples: Notifications, Palettes, Detached/Floating Windows, Detached/Floating Panels

Source

fn elevation_2_borderless(self, cx: &mut App) -> Self

See elevation_2.

Renders a borderless version elevation_2.

Source

fn elevation_3(self, cx: &App) -> Self

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 in their default state.

Elements rendered at this layer should 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.

Sets bg(), rounded_lg(), border(), border_color(), shadow()

Examples: Settings Modal, Channel Management, Wizards/Setup UI, Dialogs

Source