{{ layout "layouts/base.vto" }}
  <main class="ml-4 my-8 min-h-screen text-ctp-text justify-self-center w-full lg:w-1/2 h-card">
    <h1 class="text-5xl text-bold text-ctp-mauve">
      About
      <span class="p-name p-nickname inline">
        dish
      </span>
    </h1>
    <img
      class="h-64 w-64 rounded-full my-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."
    />

    <div class="text-lg h-entry">
      {{ content }}
    </div>

    <h2 class="mt-8 mb-1 text-ctp-mauve text-2xl">Webrings!</h2>
    <p class="text-ctp-text text-lg mb-4">
      We're a big fan of old-school web discovery. Here's the
      <a href="https://en.wikipedia.org/wiki/Webring" class="text-ctp-blue underline">webrings</a>
      we're part of:
    </p>
    <ul>
      {{ for ring of webrings.rings }}
        {{ await comp.webring({ "ring": ring }) }}
      {{ /for }}
    </ul>

    <h2 class="mt-8 text-ctp-mauve text-2xl">About This Site</h2>
    <p class="text-ctp-text text-lg">I've used the following to build this site:</p>
    <ul>
      {{ for tech of about.techs }}
        {{ await comp.about.technology_item({ "tech": tech }) }}
      {{ /for }}
    </ul>

    <p class="mt-4 text-lg">
      Profile picture by Richard Ngo. <a
        class="text-ctp-blue underline"
        href="https://photos.gamesdonequick.com/FrostFatales2025/i-B3c9P48/A"
      >Original Source</a> from Games Done Quick, modified by dish.
    </p>
  </main>
{{ /layout }}