import { PhotoCircle } from "../components/PhotoCircle.tsx";

export default function Home() {
  return (
    <body>
      <div class="min-w-screen flex flex-col items-center justify-between bg-[#313244] sm:min-h-screen">
        <div class="sm:mt-14 sm:mb-14 mt-12 mb-4 flex flex-col items-center gap-y-5 gap-x-10 md:flex-row">
          <PhotoCircle
            src="https://websites.us-east-1.linodeobjects.com/IMG_1480-min.png"
            alt="Wyatt's profile photo"
          />
          <div class="space-y-2 text-center md:text-left">
            <h1 class="text-2xl text-[#f5e0dc] font-bold sm:text-4xl">
              Heya! I'm Wyatt
            </h1>
            <h2 class="text-md font-medium text-[#f2cdcd] sm:text-xl">
              Thanks for checking out this corner of the Internet!
            </h2>
            <h3 class="text-sm font-light italic text-[#f5e0dc] sm:text-md">
              I design and develop software for developers, for end users, and
              everyone in between
            </h3>
          </div>
        </div>
      </div>
    </body>
  );
}
