Struct wasm_css::Style

pub struct Style {
    pub css: String,
    pub class: String,
    pub effects: HashMap<String, String>,
    pub components: HashMap<String, String>,
}

Represents a CSS Style

Fields

css: String

class: String

effects: HashMap<String, String>

components: HashMap<String, String>

Implementations

impl Style

pub fn new(css: String, class: Option<String>) -> Result<Self, WasmCssError>

Construct a Style from a CSS string

• See style! for built-in formatting

• Generates random class name if one is not provided

• Returns WasmCssError if unable to locate Crypto when generating uuid

• Returns WasmCssError if unable to locate Document/Window/Head

---

Example Usage:

let style: Style = Style::new(
    "
        gap: 10rem;
        display: flex;
        flex-direction: column;
    ",
    None,
)?;

pub fn class(&self) -> &String

Returns this Styles class name

pub fn append(&mut self, source: &Style) -> Result<(), WasmCssError>

Append another Style to this one, overwriting any fields on self matching with source, or adding them if they did not previously exist, updating the Style

---

Example Usage:

let mut style_one = style!("color: red; font-size: 10rem;")?;

let style_two = style!("font-size: 30rem; background-color: red;")?;

style_one.append(&style_two)?;

// style_one.css: "color: red; font-size: 30rem; background-color: red;"

pub fn insert<V: Into<String>>( &mut self, key: &str, value: V, ) -> Result<(), WasmCssError>

Insert a new CSS line into the Style

• Skips invalid keys

---

Example Usage:

let mut style = style!("color: red; font-size: 10rem;")?;

style.insert("font-weight", "bold");

pub fn remove(&mut self, key: &str) -> Result<(), WasmCssError>

Remove a CSS line from Style

---

Example Usage:

let mut style = style!("color: red; font-size: 10rem;")?;

style.remove("color", "red")?;

pub fn insert_many<V: Into<String>>( &mut self, components: Vec<(&str, V)>, ) -> Result<(), WasmCssError>

Insert many CSS lines into the Style

• Skips invalid keys

---

Example Usage:

let mut style = style!("color: red; font-size: 10rem;")?;

style.insert_many(vec![
    ("font-weight", "bold"),
    ("background-color", "red")
])?;

pub fn remove_many(&mut self, keys: Vec<&str>) -> Result<(), WasmCssError>

Remove CSS lines from Style

---

Example Usage:

let mut style = style!("color: red; font-size: 10rem;")?;

style.remove("color", "red")?;

pub fn insert_effect<E: Into<String>>( &mut self, effect: E, ) -> Result<(), WasmCssError>

Add a effect to the Style

Effect meaning sub-components to a class like MediaQuery, Hover, Etc.

The ID of the effect becomes its tag component.

---

Example Usage:

let mut style = style!("color: red;")?;

// Effect ID = '&:hover'
style.insert_effect("&:hover { font-size: 10rem; }")?;

pub fn remove_effect(&mut self, id: &str) -> Result<(), WasmCssError>

Remove a effect from the Style

Effect meaning sub-components to a class like MediaQuery, Hover, Etc.

The ID or name of the added effect is just its tag.

---

Example Usage:

let mut style = style!("color: red;")?;

// Effect ID = '&:hover'
style.insert_effect("&:hover { font-size: 10rem; };")?;

style.remove_effect("&:hover")?;

pub fn insert_effect_many<E: Into<String>>( &mut self, effects: Vec<E>, ) -> Result<(), WasmCssError>

Add many effects to the Style

Effect meaning sub-components to a class like MediaQuery, Hover, Etc.

The ID of the effect becomes its tag component.

---

Example Usage:

let mut style = style!("color: red;")?;

// Effect IDs = '&:hover' & '@media (max-width: 400px)'
style.insert_effect_many(vec![
    "&:hover { font-size: 10rem; }",
    "@media (max-width: 400px) { color: blue; }"
])?;

pub fn remove_effect_many( &mut self, effect_ids: Vec<&str>, ) -> Result<(), WasmCssError>

Remove many effects from the Style

Effect meaning sub-components to a class like MediaQuery, Hover, Etc.

The ID of the effect becomes its tag component.

---

Example Usage:

let mut style = style!("color: red;")?;

// Effect IDs = '&:hover' & '@media (max-width: 400px)'
style.insert_effect_many(vec![
    "&:hover { font-size: 10rem; }",
    "@media (max-width: 400px) { color: blue; }"
])?;

style.remove_effect_many(vec!["&:hover", "@media (max-width: 400px)"])?;

Trait Implementations

impl Clone for Style

fn clone(&self) -> Style

Returns a copy of the value.

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

Performs copy-assignment from source.

impl Debug for Style

fn fmt(&self, f: &mut Formatter<'_>) -> Result

Formats the value using the given formatter.