systems-obscure/src/pages/about.tsx

import MainTemplate from "@/templates/MainTemplate"
import portrait from "../images/portrait-compressed.jpg"

const AboutPage = () => {
  return (
    <MainTemplate>
      <div className="container mx-auto p-4">
        <figure className="w-full flex flex-col items-center mb-6">
          <div className="scanlined inline-block">
            <img
              alt="A portrait of the blog author"
              src={portrait}
              className="w-80 flex"
            />
          </div>
          <figcaption className="text-sm text-muted-foreground mt-3 text-center">
            Pictured with the WITCH computer at the{" "}
            <a
              href="https://www.tnmoc.org/"
              target="_blank"
              className="text-primary hover:text-primary/80"
            >
              National Museum of Computing
            </a>
            , Bletchley Park.
          </figcaption>
        </figure>

        <p className="leading-[1.6] [&:not(:first-child)]:mt-6">
          I'm a self-taught software engineer based on the south coast of
          England. This blog is my technical scrapbook. I document the details
          of my technical life so I can have a record of progress when I look
          back.{" "}
        </p>

        <p className="leading-[1.6] [&:not(:first-child)]:mt-6">
          I completed a degree in Philosophy at the University of Warwick (2009)
          and hold a Postgraduate Certificate of Education (2011).
        </p>
        <p className="leading-[1.6] [&:not(:first-child)]:mt-6">
          Currently I work for{" "}
          <a
            href="https://en.wikipedia.org/wiki/ITV_(TV_network)"
            target="_blank"
            className="underline decoration-1 hover:text-primary/80 underline-offset-4"
          >
            ITV
          </a>{" "}
          {""}
          as a backend software engineer. Before that, I worked as a full-stack
          engineer at the{" "}
          <a
            href="https://en.wikipedia.org/wiki/BBC"
            target="_blank"
            className="underline decoration-1 hover:text-primary/80 underline-offset-4"
          >
            BBC
          </a>{" "}
          and as a frontend engineer at{" "}
          <a
            href="https://www.arria.com/"
            target="_blank"
            className="underline decoration-1 hover:text-primary/80 underline-offset-4"
          >
            Arria NLG
          </a>{" "}
          and in several web developer roles. Before software I was a
          teacher.{" "}
        </p>

        <p className="leading-[1.6] [&:not(:first-child)]:mt-6">
          Some things I like:
          <ul className="pt-2">
            <li className="mb-1">🐶 Staffies and other bull-breeds</li>
            <li className="mb-1">🎼 Classical music (Haydn, Mozart, JSB)</li>
            <li className="mb-1">🛸 Science fiction </li>
          </ul>
        </p>

        <p className="leading-[1.6] [&:not(:first-child)]:mt-6">
          Some things I'm interested in:
          <ul className="pt-2">
            <li className="mb-1">🧑‍💻 Self-hosting and digital resiliance</li>
            <li className="mb-1">🖳 The history of computing and networks</li>
            <li className="mb-1">🇮🇪 Irish history and culture</li>
            <li className="mb-1">☸️ Buddhism</li>
            {/*

					<li className="mb-1">📡 Civil communications infrastructure</li>
					*/}
          </ul>
        </p>

        <p className="leading-[1.6] [&:not(:first-child)]:mt-6">
          I self-host my own Git forge at{" "}
          <a
            href="https://forgejo.systemsobscure.net/thomasabishop"
            className="underline decoration-1 hover:text-primary/80 underline-offset-4"
          >
            forgejo.systemsobscure.net
          </a>{" "}
          rather than use Microsoft GitHub. You can view my personal projects
          there.
        </p>
      </div>
    </MainTemplate>
  )
}

export { AboutPage }