feat(treewide): Switch to tailwindcss and add more components

1 files changed, 29 insertions, 0 deletions

diff --git a/src/components/site_header.rs b/src/components/site_header.rs
new file mode 100644
index 0000000..65f7137
--- /dev/null
+++ b/src/components/site_header.rs
@@ -0,0 +1,29 @@
+use icondata_core::Icon as DataIcon;
+use leptos::prelude::{ClassAttribute, ElementChild, IntoView, OnAttribute, component, view};
+use leptos_icons::Icon;
+use leptos_router::{NavigateOptions, hooks::use_navigate};
+
+#[component]
+pub fn SiteHeader(
+    logo: DataIcon,
+    back_location: &'static str,
+    name: &'static str,
+    #[prop(default = None)] menu: Option<String>,
+) -> impl IntoView {
+    let navigate = use_navigate();
+
+    view! {
+        <div
+            class="flex flex-row justify-between items-center p-2 px-4 w-full h-1/12 bg-gray-100"
+            on:click=move |_| {
+                navigate(back_location, NavigateOptions::default());
+            }
+        >
+            <div class="max-w-14">
+                <Icon icon=logo />
+            </div>
+            <p class="text-xl">{name}</p>
+            <div>{menu}</div>
+        </div>
+    }
+}