---
import Layout from "@layouts/index.astro";
import Image from "@components/image.astro";
import miku from "@assets/miku.jpg";
import gato from "@assets/gato.jpg";

const links = {
  git: { alt: "Git", href: "https://git.lua.re/" },
  twt: { alt: "Twitter", href: "https://twitter.com/luanekos" },
  mail: { alt: "Email", href: "mailto:lumi(at)lua.re" },
  pgp: {
    alt: "PGP",
    href: "https://git.lua.re/luaneko/.profile/raw/branch/master/luaneko.pgp.pub",
  },
  // bsky: { alt: "Bluesky", href: "https://bsky.app/profile/lua.re" },
};
---

<Layout class="max-h-screen">
  <main
    class="px-5 py-4 space-y-2 bg-white rounded-lg shadow-xs min-h-0 overflow-scroll"
  >
    <pre>{
`   ∧...∧  𝜗𝜚
 (  ̳• · • ̳)   ᭢
 /         づ   ////  ⋆.⁺₊`
   }</pre>
    <p>hi i'm luaneko ^^</p>
    <p>this is my site where i put a bunch of random stuff !</p>
    <p><Image src={miku} class="rounded-lg max-w-80" /></p>
    <pre>{
`          へ     ╱ 、
    ૮  -   ՛ )  (˚ˎ 。7
     /   ⁻  ៸|   |、˜〵   ᢉ𐭩 p&g
乀(ˍ, ل ل  じしˍ,)ノ`
   }</pre>
    <p>i love cats they miau miau</p>
    <p><Image src={gato} class="rounded-lg max-w-60" /></p>
    <p>best way to contact me is by twt or mail {`<3`}</p>
  </main>

  <footer class="flex flex-row space-x-1 my-2 text-sm">
    {
      Object.entries(links).map(([name, { alt, href }], i) => [
        i ? <span>·</span> : null,
        <a href={href} title={alt} set:text={name} />,
      ])
    }
  </footer>

  <script>
    for (const link of document.querySelectorAll(`a[href^="mailto:"]`)) {
      const href = link.attributes.getNamedItem("href")!;
      href.value = href.value.replace("(at)", "@");
    }
  </script>
</Layout>