edger-dev / dioxus-class

Dioxus Class

When using dioxus for GUI development, by default plain strings are used for CSS class, which is not ideal IMO, there is no compile time validation, and also the auto completion is only text based, and it's not easy to reuse class constants.

dioxus-class

Class type been provided, which is just a wrapper struct around Vec<String>, some basic From<> and Add<> implementation make it easier to be used.

constant! macro for easier definition for css values, e.g.

constant!(table column group);

will be transformed to:

pub const table_column_group: &'static str = "table-column-group";

class! macro provided for easier definition using string constants, e.g.

cx.render(rsx!{
    div {
        class: class!(card_body text_center items_center hover(scale_105)),
        div {
            class: class!(card_title text_sm text_base_content),
            cx.props.alias
        }
    }
})

dioxus-tailwindcss

Defined constants and modifiers for tailwindcss v3.2.7

dioxus-daisyui

Defined constants and modifiers for daisyui v2.50.2

Emoji Browser

Open web app in new tab

Search emoji by shortcode, built as demo project.