---
import Base from '~/layouts/Base.astro';
import { author } from '~/data/site';

const sameAs = [author.socials.linkedin, author.socials.github, author.socials.x, author.socials.mastodon].filter(Boolean);
---
<Base
  title={`About — ${author.name}`}
  description={author.shortBio}
  extraJsonLd={{
    '@context': 'https://schema.org',
    '@type': 'Person',
    name: author.name,
    jobTitle: author.jobTitle,
    description: author.longBio,
    url: new URL(Astro.url.pathname, Astro.site).toString(),
    sameAs,
    knowsAbout: author.knowsAbout,
  }}
>
  <article class="container-prose pt-12 sm:pt-16 pb-16">
    <p class="label-eyebrow">About</p>
    <h1
      class="font-serif text-4xl sm:text-5xl font-bold tracking-tight mt-2 leading-[1.1]"
      style="letter-spacing: -0.025em;"
    >
      {author.name}
    </h1>
    <p class="mt-3 label-meta">
      {author.jobTitle} &middot; {author.location}
    </p>

    <div class="prose-blog mt-10">
      <p>{author.longBio}</p>
      <p>
        I publish essays here once or twice a month. They tend to be longer than they need to be — that's a feature, not a bug. If you want the short version, follow me on{' '}
        <a href={author.socials.linkedin} rel="me noopener noreferrer" target="_blank">LinkedIn</a>.
        If you want to argue with me about something I wrote, my inbox is{' '}
        <a href={`mailto:${author.email}`}>{author.email}</a>.
      </p>
      <h2>What I tend to write about</h2>
      <ul>
        {author.knowsAbout.map((topic) => (
          <li>{topic}</li>
        ))}
      </ul>
      <h2>Where else to find me</h2>
      <p>
        <a href={author.socials.linkedin} rel="me noopener noreferrer" target="_blank">LinkedIn</a> for professional context.
        {' '}<a href={author.socials.github} rel="me noopener noreferrer" target="_blank">GitHub</a> for code I've written or am writing.
        {' '}<a href={author.socials.x} rel="me noopener noreferrer" target="_blank">X / Twitter</a> for half-formed thoughts that didn't justify an essay.
      </p>
      <h2>Colophon</h2>
      <p>
        This site is built with <a href="https://astro.build" rel="noopener noreferrer">Astro</a>, deployed to GitHub Pages, MIT-licensed, and uses{' '}
        <a href="https://fonts.google.com/specimen/Newsreader" rel="noopener noreferrer">Newsreader</a> for body text and{' '}
        <a href="https://rsms.me/inter/" rel="noopener noreferrer">Inter</a> for the chrome. There is no analytics script and no third-party tracker. RSS is the subscription channel.
      </p>
    </div>
  </article>
</Base>
