CSS with classes!
Yew does not natively provide a CSS-in-Rust solution but helps with styling by providing
programmatic ways to interact with the HTML class
attribute.
Classes
The classes!
macro and associated Classes
struct simplify the use of HTML classes:
- Literal
- Multiple
- String
- Optional
- Vector
- Slice
use yew::{classes, html};
html! {
<div class={classes!("container")}></div>
};
use yew::{classes, html};
html! {
<div class={classes!("class-1", "class-2")}></div>
};
use yew::{classes, html};
html! {
<div class={classes!(String::from("class-1 class-2"))}></div>
};
use yew::{classes, html};
html! {
<div class={classes!(Some("class"))} />
};
use yew::{classes, html};
html! {
<div class={classes!(vec!["class-1", "class-2"])}></div>
};