{{ layout "layouts/base.vto" }}
  <main class="min-h-screen text-ctp-text justify-self-center w-full lg:w-1/2 h-card">
    <h1 class="mt-8 text-5xl text-bold text-ctp-mauve">
      hi, I'm <span><a href="/about" rel="me" class="u-url u-uid p-name p-nickname">dish</a></span>
    </h1>
    <img
      class="h-64 w-64 rounded-full mt-4"
      src="/static/images/author.png"
      transform-images="avif webp 300@2"
      alt="dish at Frost Fatales 2025. She has her head tilted 45 degrees to the left and is wearing a face mask with the trans flag on it."
    />
    <h2 class="text-2xl mt-4 p-note">Student, Sysadmin, and UX Crafter</h2>
    <p class="text-lg mt-2">
      Howdy! I play with computers, with an emphasis on accessible, secure, and enjoyable
      experiences.
    </p>
    <h2 class="my-8 text-2xl">Recent blog posts:</h2>
    <ul class="lg:w-3/4">
      {{ for post of search.pages("category=blog", "published=desc", 5) }}
        {{ await comp.post_card({ "post": post, compact: true }) }}
      {{ /for }}
    </ul>
  </main>
{{ /layout }}