Macro html

html!() { /* proc-macro */ }

Generate HTML with maud-like syntax.

Syntax

Normal HTML elements are written with curly-braces.

html! {
    p { "Lorem ipsum dolor sit amet." }
}

Self-closing tags require a trailing semicolon.

html! {
    img src: "logo.svg" ;
    // gets automatically changed to `data-cooldown`
    button data_cooldown: "5s" onclick: "..." { "Click me" }
}

Using Rust expressions inside templates.

html! {
    p { (format!("Hello {name}")) }
    img src: (format!("assets/{name}/profile-picture.png")) ;
}

Conditional rendering with if.

html! {
    if let Some(name) = name {
        (name)
    } else {
        "stranger"
    }
}

Pattern matching using match.

html! {
    match age {
        ..18 => "You're not old enough",
        18.. => p { "Hello world" }
    }
}

Repeating markup with for.

html! {
    h1 { "Available movies" }
    ul {
        for title in titles {
            li { (title) }
        }
    }
}