use crate::components::{Card, P};
use dioxus::prelude::*;
use dioxus_i18n::t;

#[component]
pub fn Home() -> Element {
    rsx! {
        div {
            class: "container mx-auto p-4 flex items-center justify-center max-w-md w-full",
            Card {
                name: t!("home_card_name"),
                gender: t!("home_card_gender"),
                picture: asset!("./assets/pictures/headshot.webp"),
                div {
                    class: "py-4",
                    div {
                        class: "mb-2",
                        for line in t!("home_card_text").split("\n").into_iter() {
                            P {{line}}
                        }
                    },
                },
                Link {
                    to: "mailto:tuan-dat.tran@tudattr.dev",
                    class: "text-gray-900 bg-gradient-to-br from-green-400 to-blue-600 group-hover:from-green-400 group-hover:to-blue-600 hover:text-white rounded-full shadow-lg py-4 px-4",
                    { t!("home_card_contact_button") }
                }
            },
        }
    }
}