Skip to main content

Style

Struct Style 

Source
pub struct Style {
Show 62 fields pub display: Option<String>, pub flex_direction: Option<String>, pub flex_wrap: Option<String>, pub align_items: Option<String>, pub align_self: Option<String>, pub justify_content: Option<String>, pub justify_items: Option<String>, pub gap: Option<String>, pub row_gap: Option<String>, pub column_gap: Option<String>, pub padding: Option<String>, pub padding_top: Option<String>, pub padding_right: Option<String>, pub padding_bottom: Option<String>, pub padding_left: Option<String>, pub margin: Option<String>, pub margin_top: Option<String>, pub margin_right: Option<String>, pub margin_bottom: Option<String>, pub margin_left: Option<String>, pub background_color: Option<String>, pub color: Option<String>, pub border_color: Option<String>, pub font_size: Option<String>, pub font_weight: Option<String>, pub font_family: Option<String>, pub line_height: Option<String>, pub text_align: Option<String>, pub text_decoration: Option<String>, pub letter_spacing: Option<String>, pub border_radius: Option<String>, pub border: Option<String>, pub border_top: Option<String>, pub border_right: Option<String>, pub border_bottom: Option<String>, pub border_left: Option<String>, pub border_width: Option<String>, pub box_shadow: Option<String>, pub width: Option<String>, pub height: Option<String>, pub min_width: Option<String>, pub min_height: Option<String>, pub max_width: Option<String>, pub max_height: Option<String>, pub position: Option<String>, pub top: Option<String>, pub right: Option<String>, pub bottom: Option<String>, pub left: Option<String>, pub z_index: Option<String>, pub cursor: Option<String>, pub opacity: Option<String>, pub transition: Option<String>, pub transform: Option<String>, pub overflow: Option<String>, pub visibility: Option<String>, pub pointer_events: Option<String>, pub user_select: Option<String>, pub white_space: Option<String>, pub word_break: Option<String>, pub outline: Option<String>, pub resize: Option<String>,
}
Expand description

CSS Style builder with fluent API

§Example

use dioxus_ui_system::styles::Style;
use dioxus_ui_system::theme::ThemeTokens;

let theme = ThemeTokens::light();
let style = Style::new()
    .flex()
    .flex_col()
    .items_center()
    .gap(&theme.spacing, "md")
    .bg(&theme.colors.primary)
    .rounded(&theme.radius, "md")
    .build();

Fields§

§display: Option<String>§flex_direction: Option<String>§flex_wrap: Option<String>§align_items: Option<String>§align_self: Option<String>§justify_content: Option<String>§justify_items: Option<String>§gap: Option<String>§row_gap: Option<String>§column_gap: Option<String>§padding: Option<String>§padding_top: Option<String>§padding_right: Option<String>§padding_bottom: Option<String>§padding_left: Option<String>§margin: Option<String>§margin_top: Option<String>§margin_right: Option<String>§margin_bottom: Option<String>§margin_left: Option<String>§background_color: Option<String>§color: Option<String>§border_color: Option<String>§font_size: Option<String>§font_weight: Option<String>§font_family: Option<String>§line_height: Option<String>§text_align: Option<String>§text_decoration: Option<String>§letter_spacing: Option<String>§border_radius: Option<String>§border: Option<String>§border_top: Option<String>§border_right: Option<String>§border_bottom: Option<String>§border_left: Option<String>§border_width: Option<String>§box_shadow: Option<String>§width: Option<String>§height: Option<String>§min_width: Option<String>§min_height: Option<String>§max_width: Option<String>§max_height: Option<String>§position: Option<String>§top: Option<String>§right: Option<String>§bottom: Option<String>§left: Option<String>§z_index: Option<String>§cursor: Option<String>§opacity: Option<String>§transition: Option<String>§transform: Option<String>§overflow: Option<String>§visibility: Option<String>§pointer_events: Option<String>§user_select: Option<String>§white_space: Option<String>§word_break: Option<String>§outline: Option<String>§resize: Option<String>

Implementations§

Source§

impl Style

Source

pub fn new() -> Self

Create a new empty style

Source

pub fn flex(self) -> Self

Set display to flex

Source

pub fn block(self) -> Self

Set display to block

Source

pub fn inline_block(self) -> Self

Set display to inline-block

Source

pub fn inline_flex(self) -> Self

Set display to inline-flex

Source

pub fn grid(self) -> Self

Set display to grid

Source

pub fn hidden(self) -> Self

Set display to none

Source

pub fn flex_col(self) -> Self

Set flex-direction to column

Source

pub fn flex_row(self) -> Self

Set flex-direction to row

Source

pub fn flex_wrap(self) -> Self

Set flex-wrap to wrap

Source

pub fn flex_nowrap(self) -> Self

Set flex-wrap to nowrap

Source

pub fn items_center(self) -> Self

Set align-items to center

Source

pub fn items_start(self) -> Self

Set align-items to start

Source

pub fn items_end(self) -> Self

Set align-items to end

Source

pub fn items_stretch(self) -> Self

Set align-items to stretch

Source

pub fn self_center(self) -> Self

Set align-self to center

Source

pub fn justify_center(self) -> Self

Set justify-content to center

Source

pub fn justify_start(self) -> Self

Set justify-content to start

Source

pub fn justify_end(self) -> Self

Set justify-content to end

Source

pub fn justify_between(self) -> Self

Set justify-content to space-between

Source

pub fn justify_around(self) -> Self

Set justify-content to space-around

Source

pub fn justify_evenly(self) -> Self

Set justify-content to space-evenly

Source

pub fn gap(self, spacing: &SpacingScale, size: &str) -> Self

Set gap from spacing scale

Source

pub fn gap_px(self, px: u16) -> Self

Set gap to a specific pixel value

Source

pub fn row_gap(self, spacing: &SpacingScale, size: &str) -> Self

Set row gap from spacing scale

Source

pub fn column_gap(self, spacing: &SpacingScale, size: &str) -> Self

Set column gap from spacing scale

Source

pub fn p(self, spacing: &SpacingScale, size: &str) -> Self

Set padding from spacing scale

Source

pub fn p_px(self, px: u16) -> Self

Set padding to specific value

Source

pub fn px(self, spacing: &SpacingScale, size: &str) -> Self

Set horizontal padding (left and right)

Source

pub fn px_px(self, px: u16) -> Self

Set horizontal padding to specific value

Source

pub fn py(self, spacing: &SpacingScale, size: &str) -> Self

Set vertical padding (top and bottom)

Source

pub fn py_px(self, px: u16) -> Self

Set vertical padding to specific value

Source

pub fn pt(self, spacing: &SpacingScale, size: &str) -> Self

Set top padding

Source

pub fn pr(self, spacing: &SpacingScale, size: &str) -> Self

Set right padding

Source

pub fn pb(self, spacing: &SpacingScale, size: &str) -> Self

Set bottom padding

Source

pub fn pl(self, spacing: &SpacingScale, size: &str) -> Self

Set left padding

Source

pub fn pt_px(self, px: u16) -> Self

Set top padding in pixels

Source

pub fn pr_px(self, px: u16) -> Self

Set right padding in pixels

Source

pub fn pb_px(self, px: u16) -> Self

Set bottom padding in pixels

Source

pub fn pl_px(self, px: u16) -> Self

Set left padding in pixels

Source

pub fn m(self, spacing: &SpacingScale, size: &str) -> Self

Set margin from spacing scale

Source

pub fn m_px(self, px: u16) -> Self

Set margin to specific value

Source

pub fn mx(self, spacing: &SpacingScale, size: &str) -> Self

Set horizontal margin

Source

pub fn my(self, spacing: &SpacingScale, size: &str) -> Self

Set vertical margin

Source

pub fn mt(self, spacing: &SpacingScale, size: &str) -> Self

Set top margin

Source

pub fn mr(self, spacing: &SpacingScale, size: &str) -> Self

Set right margin

Source

pub fn mb(self, spacing: &SpacingScale, size: &str) -> Self

Set bottom margin

Source

pub fn mb_px(self, px: i16) -> Self

Set bottom margin in pixels (can be negative)

Source

pub fn ml(self, spacing: &SpacingScale, size: &str) -> Self

Set left margin

Source

pub fn bg(self, color: &Color) -> Self

Set background color

Source

pub fn bg_hex(self, hex: &str) -> Self

Set background color from hex string

Source

pub fn text_color(self, color: &Color) -> Self

Set text color

Source

pub fn text_hex(self, hex: &str) -> Self

Set text color from hex string

Source

pub fn border_color(self, color: &Color) -> Self

Set border color

Source

pub fn text(self, typography: &TypographyScale, size: &str) -> Self

Set typography from scale

Source

pub fn font_size(self, size: u16) -> Self

Set font size

Source

pub fn font_weight(self, weight: u16) -> Self

Set font weight

Source

pub fn font_family(self, family: &str) -> Self

Set font family

Source

pub fn line_height(self, height: f32) -> Self

Set line height

Source

pub fn text_align(self, align: &str) -> Self

Set text align

Source

pub fn text_center(self) -> Self

Set text align to center

Source

pub fn text_left(self) -> Self

Set text align to left

Source

pub fn text_right(self) -> Self

Set text align to right

Source

pub fn text_align_left(self) -> Self

Set text align to left

Source

pub fn no_underline(self) -> Self

Set text decoration to none

Source

pub fn underline(self) -> Self

Set text decoration to underline

Source

pub fn rounded(self, radius: &RadiusScale, size: &str) -> Self

Set border radius from scale

Source

pub fn rounded_px(self, px: u16) -> Self

Set border radius to specific value

Source

pub fn rounded_full(self) -> Self

Set border radius to full (circle/pill)

Source

pub fn border(self, width: u8, color: &Color) -> Self

Set border with width and color

Source

pub fn border_width(self, width: u8) -> Self

Set border width only

Source

pub fn border_top(self, width: u8, color: &Color) -> Self

Set top border

Source

pub fn border_right(self, width: u8, color: &Color) -> Self

Set right border

Source

pub fn border_bottom(self, width: u8, color: &Color) -> Self

Set bottom border

Source

pub fn border_left(self, width: u8, color: &Color) -> Self

Set left border

Source

pub fn border_style(self, style: &str) -> Self

Set border style (dashed, dotted, etc.)

Source

pub fn shadow(self, shadow: &str) -> Self

Set box shadow

Source

pub fn shadow_themed(self, theme: &ThemeTokens, size: &str) -> Self

Set box shadow from theme

Source

pub fn shadow_none(self) -> Self

Remove box shadow

Source

pub fn w(self, width: &str) -> Self

Set width

Source

pub fn w_px(self, px: u16) -> Self

Set width in pixels

Source

pub fn w_percent(self, pct: u8) -> Self

Set width as percentage

Source

pub fn w_full(self) -> Self

Set width to full (100%)

Source

pub fn h(self, height: &str) -> Self

Set height

Source

pub fn h_px(self, px: u16) -> Self

Set height in pixels

Source

pub fn h_percent(self, pct: u8) -> Self

Set height as percentage

Source

pub fn h_full(self) -> Self

Set height to full (100%)

Source

pub fn min_w(self, width: &str) -> Self

Set min-width

Source

pub fn min_w_px(self, px: u16) -> Self

Set min-width in pixels

Source

pub fn min_h(self, height: &str) -> Self

Set min-height

Source

pub fn min_h_px(self, px: u16) -> Self

Set min-height in pixels

Source

pub fn max_w(self, width: &str) -> Self

Set max-width

Source

pub fn max_w_px(self, px: u16) -> Self

Set max-width in pixels

Source

pub fn max_h(self, height: &str) -> Self

Set max-height

Source

pub fn max_h_px(self, px: u16) -> Self

Set max-height in pixels

Source

pub fn position(self, value: &str) -> Self

Set position to any value

Source

pub fn relative(self) -> Self

Set position to relative

Source

pub fn absolute(self) -> Self

Set position to absolute

Source

pub fn fixed(self) -> Self

Set position to fixed

Source

pub fn sticky(self) -> Self

Set position to sticky

Source

pub fn top(self, value: &str) -> Self

Set top position

Source

pub fn right(self, value: &str) -> Self

Set right position

Source

pub fn bottom(self, value: &str) -> Self

Set bottom position

Source

pub fn left(self, value: &str) -> Self

Set left position

Source

pub fn z_index(self, z: i16) -> Self

Set z-index

Source

pub fn cursor(self, cursor: &str) -> Self

Set cursor style

Source

pub fn cursor_pointer(self) -> Self

Set cursor to pointer

Source

pub fn opacity(self, opacity: f32) -> Self

Set opacity

Source

pub fn transition(self, transition: &str) -> Self

Set transition

Source

pub fn transform(self, transform: &str) -> Self

Set transform

Source

pub fn overflow_hidden(self) -> Self

Set overflow to hidden

Source

pub fn overflow_auto(self) -> Self

Set overflow to auto

Source

pub fn overflow_scroll(self) -> Self

Set overflow to scroll

Source

pub fn invisible(self) -> Self

Set visibility to hidden

Source

pub fn visible(self) -> Self

Set visibility to visible

Source

pub fn pointer_events_none(self) -> Self

Disable pointer events

Source

pub fn pointer_events_auto(self) -> Self

Enable pointer events

Source

pub fn select_none(self) -> Self

Disable user selection

Source

pub fn whitespace_nowrap(self) -> Self

Set white-space to nowrap

Source

pub fn break_all(self) -> Self

Set word-break to break-all

Source

pub fn outline(self, value: &str) -> Self

Set outline style

Source

pub fn resize(self, value: &str) -> Self

Set resize style

Source

pub fn flex_shrink(self, value: u8) -> Self

Set flex-shrink

Source

pub fn bg_transparent(self) -> Self

Set transparent background

Source

pub fn flex_grow(self, value: u8) -> Self

Set flex-grow

Source

pub fn min_h_full(self) -> Self

Set min-height to 100%

Source

pub fn inset(self, value: &str) -> Self

Set inset (top, right, bottom, left) - shorthand for absolute positioning

Source

pub fn flex_1(self) -> Self

Set flex-grow to 1 (flex-1)

Source

pub fn overflow_x_auto(self) -> Self

Set overflow-x to auto

Source

pub fn overflow_y_auto(self) -> Self

Set overflow-y to auto

Source

pub fn custom(self, css: &str) -> Self

Add custom/raw CSS

Source

pub fn build(self) -> String

Build the style string

Source

pub fn merge(self, other: Style) -> Self

Merge another style into this one (other takes precedence)

Trait Implementations§

Source§

impl Clone for Style

Source§

fn clone(&self) -> Style

Returns a duplicate of the value. Read more
1.0.0 · Source§

fn clone_from(&mut self, source: &Self)

Performs copy-assignment from source. Read more
Source§

impl Default for Style

Source§

fn default() -> Style

Returns the “default value” for a type. Read more

Auto Trait Implementations§

§

impl Freeze for Style

§

impl RefUnwindSafe for Style

§

impl Send for Style

§

impl Sync for Style

§

impl Unpin for Style

§

impl UnsafeUnpin for Style

§

impl UnwindSafe for Style

Blanket Implementations§

Source§

impl<T> Any for T
where T: 'static + ?Sized,

Source§

fn type_id(&self) -> TypeId

Gets the TypeId of self. Read more
Source§

impl<T> Borrow<T> for T
where T: ?Sized,

Source§

fn borrow(&self) -> &T

Immutably borrows from an owned value. Read more
Source§

impl<T> BorrowMut<T> for T
where T: ?Sized,

Source§

fn borrow_mut(&mut self) -> &mut T

Mutably borrows from an owned value. Read more
Source§

impl<T> CloneToUninit for T
where T: Clone,

Source§

unsafe fn clone_to_uninit(&self, dest: *mut u8)

🔬This is a nightly-only experimental API. (clone_to_uninit)
Performs copy-assignment from self to dest. Read more
Source§

impl<T> From<T> for T

Source§

fn from(t: T) -> T

Returns the argument unchanged.

Source§

impl<T> InitializeFromFunction<T> for T

Source§

fn initialize_from_function(f: fn() -> T) -> T

Create an instance of this type from an initialization function
Source§

impl<T> Instrument for T

Source§

fn instrument(self, span: Span) -> Instrumented<Self>

Instruments this type with the provided Span, returning an Instrumented wrapper. Read more
Source§

fn in_current_span(self) -> Instrumented<Self>

Instruments this type with the current Span, returning an Instrumented wrapper. Read more
Source§

impl<T, U> Into<U> for T
where U: From<T>,

Source§

fn into(self) -> U

Calls U::from(self).

That is, this conversion is whatever the implementation of From<T> for U chooses to do.

Source§

impl<Ret> SpawnIfAsync<(), Ret> for Ret

Source§

fn spawn(self) -> Ret

Spawn the value into the dioxus runtime if it is an async block
Source§

impl<T, O> SuperFrom<T> for O
where O: From<T>,

Source§

fn super_from(input: T) -> O

Convert from a type to another type.
Source§

impl<T, O, M> SuperInto<O, M> for T
where O: SuperFrom<T, M>,

Source§

fn super_into(self) -> O

Convert from a type to another type.
Source§

impl<T> ToOwned for T
where T: Clone,

Source§

type Owned = T

The resulting type after obtaining ownership.
Source§

fn to_owned(&self) -> T

Creates owned data from borrowed data, usually by cloning. Read more
Source§

fn clone_into(&self, target: &mut T)

Uses borrowed data to replace owned data, usually by cloning. Read more
Source§

impl<T, U> TryFrom<U> for T
where U: Into<T>,

Source§

type Error = Infallible

The type returned in the event of a conversion error.
Source§

fn try_from(value: U) -> Result<T, <T as TryFrom<U>>::Error>

Performs the conversion.
Source§

impl<T, U> TryInto<U> for T
where U: TryFrom<T>,

Source§

type Error = <U as TryFrom<T>>::Error

The type returned in the event of a conversion error.
Source§

fn try_into(self) -> Result<U, <U as TryFrom<T>>::Error>

Performs the conversion.
Source§

impl<S, T> Upcast<T> for S
where T: UpcastFrom<S> + ?Sized, S: ?Sized,

Source§

fn upcast(&self) -> &T
where Self: ErasableGeneric, T: ErasableGeneric<Repr = Self::Repr>,

Perform a zero-cost type-safe upcast to a wider ref type within the Wasm bindgen generics type system. Read more
Source§

fn upcast_into(self) -> T
where Self: Sized + ErasableGeneric, T: ErasableGeneric<Repr = Self::Repr>,

Perform a zero-cost type-safe upcast to a wider type within the Wasm bindgen generics type system. Read more
Source§

impl<T> WithSubscriber for T

Source§

fn with_subscriber<S>(self, subscriber: S) -> WithDispatch<Self>
where S: Into<Dispatch>,

Attaches the provided Subscriber to this type, returning a WithDispatch wrapper. Read more
Source§

fn with_current_subscriber(self) -> WithDispatch<Self>

Attaches the current default Subscriber to this type, returning a WithDispatch wrapper. Read more