Initial commit

Signed-off-by: Tuan-Dat Tran <tuan-dat.tran@tudattr.dev>

src/layout/footer.rs

@@ -0,0 +1,76 @@
+use dioxus::prelude::*;
+
+use crate::components::H1;
+
+pub fn Footer() -> Element {
+    rsx! {
+        div {
+            ToolsUsed {},
+            footer {
+                class:"bg-white rounded-lg shadow dark:bg-gray-800 my-4:wa
+    ",
+                div {
+                    class:"w-full mx-auto max-w-screen-xl p-4 md:flex md:items-center md:justify-between",
+                    span {
+                        class:"text-sm text-gray-500 sm:text-center dark:text-gray-400",
+                        "© 2024 ",
+                        a { href: "#",  class: "hover:underline", "Tuan-Dat Tran"},
+                        ". All Rights Reserved."
+                    }
+                    ul {
+                        class:"flex flex-wrap items-center mt-3 text-sm font-medium text-gray-500 dark:text-gray-400 sm:mt-0",
+                        li {
+                            Link { to:"mailto:tuan-dat.tran@tudattr.dev", class:"hover:underline", "Contact" }
+                        },
+                    }
+                }
+            }
+        }
+    }
+}
+
+fn ToolsUsed() -> Element {
+    rsx! {
+        div {
+            class:"items-center bg-white rounded-lg shadow dark:bg-gray-800 p-4 my-4",
+            div {
+                H1 {class: "justify-center", "Tools used" },
+            }
+            div {
+                class: "flex h-fill overflow-x-auto",
+                Logo {
+                    src: "https://raw.githubusercontent.com/SAWARATSUKI/ServiceLogos/main/Rust/Rust.png",
+                    alt: "Rust"
+                },
+                Logo {
+                    src: "https://raw.githubusercontent.com/SAWARATSUKI/ServiceLogos/main/Tailwindcss/Tailwindcss6.png",
+                    alt: "Tailwindcss"
+                },
+                Logo {
+                    src: "https://raw.githubusercontent.com/SAWARATSUKI/ServiceLogos/main/Html/HTML.png",
+                    alt: "HTML"
+                },
+                Logo {
+                    src: "https://raw.githubusercontent.com/Aikoyori/ProgrammingVTuberLogos/main/Docker/DockerLogo.png",
+                    alt: "Docker"
+                },
+                Logo {
+                    src: "https://raw.githubusercontent.com/Aikoyori/ProgrammingVTuberLogos/main/Neovim/NeovimLogo.png",
+                    alt: "NeoVim"
+                },
+
+            }
+        }
+    }
+}
+
+#[component]
+fn Logo(src: String, alt: String) -> Element {
+    rsx! {
+        img {
+            class: "h-auto max-w-40 transition-all duration-300 rounded-lg cursor-pointer filter grayscale hover:grayscale-0",
+            src: "{src}",
+            alt: "{alt}"
+        }
+    }
+}