mirror of
https://github.com/DioxusLabs/dioxus
synced 2024-11-23 20:53:06 +00:00
56 lines
1.3 KiB
R
56 lines
1.3 KiB
R
rsx! {
|
|
div { "hello world!" }
|
|
div { "hello world!", "goodbye world!" }
|
|
|
|
// Simple div
|
|
div { "hello world!" }
|
|
|
|
// Compression with attributes
|
|
div { key: "a", class: "ban", style: "color: red" }
|
|
|
|
// Nested one level
|
|
div { div { "nested" } }
|
|
|
|
// Nested two level
|
|
div {
|
|
div { h1 { "highly nested" } }
|
|
}
|
|
|
|
// Anti-Nested two level
|
|
div {
|
|
div {
|
|
div { h1 { "highly nested" } }
|
|
}
|
|
}
|
|
|
|
// Compression
|
|
h3 { class: "mb-2 text-xl font-bold", "Invite Member" }
|
|
a { class: "text-white", "Send invitation" }
|
|
|
|
// Props on tops
|
|
h3 { class: "mb-2 text-xl font-bold mb-2 text-xl font-bold mb-2 text-xl font-bold mb-2 text-xl font-bold mb-2 text-xl font-bold",
|
|
"Invite Member"
|
|
}
|
|
|
|
// No children, minimal props
|
|
img { class: "mb-6 mx-auto h-24", src: "artemis-assets/images/friends.png", alt: "" }
|
|
|
|
// One level compression
|
|
div {
|
|
a {
|
|
class: "py-2 px-3 bg-indigo-500 hover:bg-indigo-600 rounded text-xs text-white",
|
|
href: "#",
|
|
"Send invitation"
|
|
}
|
|
}
|
|
|
|
// Components
|
|
Component { ..Props {} }
|
|
|
|
// multiline
|
|
div {
|
|
class: "asdaskjdhaskjdjaslkdjlakdjaslkdjaslkd asdaskjdhaskjdjaslkdjlakdjaslkdjaslkdasdaskjdhaskjdjaslkdjlakdjaslkdjaslkd",
|
|
multiple: "asd",
|
|
"hi"
|
|
}
|
|
}
|