wip: move some examples around

examples/_examples/derive.rs

@@ -0,0 +1,46 @@
+use dioxus::{events::on::MouseEvent, prelude::*};
+use dioxus_core as dioxus;
+use dioxus_html_namespace as dioxus_elements;
+use dioxus_web::WebsysRenderer;
+
+fn main() {
+    wasm_logger::init(wasm_logger::Config::new(log::Level::Debug));
+    console_error_panic_hook::set_once();
+    wasm_bindgen_futures::spawn_local(WebsysRenderer::start(App));
+}
+
+fn App(cx: Context<()>) -> VNode {
+    let cansee = use_state(cx, || false);
+    rsx! { in cx,
+        div {
+            "Shadow of the child:"
+            button { onclick: move |_| cansee.set(!**cansee)
+                "Gaze into the void"
+            }
+            {cansee.then(|| rsx!{ Child {} })}
+        }
+    }
+}
+
+fn Child(cx: Context<()>) -> VNode {
+    rsx! { in cx,
+        section { class: "py-6 bg-coolGray-100 text-coolGray-900"
+            div { class: "container mx-auto flex flex-col items-center justify-center p-4 space-y-8 md:p-10 md:px-24 xl:px-48"
+                h1 { class: "text-5xl font-bold leading-none text-center",
+                    "Sign up now"
+                }
+                p { class: "text-xl font-medium text-center",
+                    "At a assumenda quas cum earum ut itaque commodi saepe rem aspernatur quam natus quis nihil quod, hic explicabo doloribus magnam neque, exercitationem eius sunt!"
+                }
+                div { class: "flex flex-col space-y-4 sm:space-y-0 sm:flex-row sm:space-x-8"
+                    button { class: "px-8 py-3 text-lg font-semibold rounded bg-violet-600 text-coolGray-50",
+                        "Get started"
+                    }
+                    button { class: "px-8 py-3 text-lg font-normal border rounded bg-coolGray-800 text-coolGray-50 border-coolGray-700",
+                        "Learn more"
+                    }
+                }
+            }
+        }
+    }
+}