2022-07-05 21:49:16 +00:00
|
|
|
rsx! {
|
|
|
|
div { "hello world!" }
|
2022-09-28 23:47:10 +00:00
|
|
|
div { "hello world!", "goodbye world!" }
|
2022-07-05 21:49:16 +00:00
|
|
|
|
|
|
|
// 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
|
2022-09-28 23:47:10 +00:00
|
|
|
div {
|
|
|
|
div { h1 { "highly nested" } }
|
|
|
|
}
|
|
|
|
|
|
|
|
// Anti-Nested two level
|
|
|
|
div {
|
|
|
|
div {
|
|
|
|
div { h1 { "highly nested" } }
|
|
|
|
}
|
|
|
|
}
|
2022-07-05 21:49:16 +00:00
|
|
|
|
|
|
|
// 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
|
2022-09-28 23:47:10 +00:00
|
|
|
div {
|
2023-01-14 08:42:43 +00:00
|
|
|
a {
|
|
|
|
class: "py-2 px-3 bg-indigo-500 hover:bg-indigo-600 rounded text-xs text-white",
|
|
|
|
href: "#",
|
2023-01-13 01:02:41 +00:00
|
|
|
"Send invitation"
|
|
|
|
}
|
2022-09-28 23:47:10 +00:00
|
|
|
}
|
2022-07-05 22:03:04 +00:00
|
|
|
|
|
|
|
// Components
|
|
|
|
Component { ..Props {} }
|
2022-07-05 22:23:30 +00:00
|
|
|
|
|
|
|
// multiline
|
|
|
|
div {
|
|
|
|
class: "asdaskjdhaskjdjaslkdjlakdjaslkdjaslkd asdaskjdhaskjdjaslkdjlakdjaslkdjaslkdasdaskjdhaskjdjaslkdjlakdjaslkdjaslkd",
|
|
|
|
multiple: "asd",
|
|
|
|
"hi"
|
|
|
|
}
|
2022-07-05 21:49:16 +00:00
|
|
|
}
|