---
import "@/style/globals.css"
import ContentLayout from "@/layouts/content.astro";
import Intro from "@/components/about/intro";
import AllTimeStats from "@/components/about/stats-alltime";
import DetailedStats from "@/components/about/stats-detailed";
import Timeline from "@/components/about/timeline";
import CurrentFocus from "@/components/about/current-focus";
import OutsideCoding from "@/components/about/outside-coding";
---
<ContentLayout
  title="About | Timothy Pidashev"
  description="A software engineer passionate about the web, open source, and building innovative solutions."
>
  <div class="min-h-screen">
    <section class="h-screen flex items-center justify-center">
      <Intro client:load />
    </section>

    <section class="min-h-[40vh] md:min-h-[60vh] flex items-center justify-center py-8 md:py-16">
      <AllTimeStats client:load />
    </section>

    <section class="min-h-[60vh] md:min-h-screen flex items-center justify-center py-8 md:py-16">
      <DetailedStats client:load />
    </section>

    <section class="min-h-[50vh] md:min-h-[80vh] flex items-center justify-center py-8 md:py-16">
      <Timeline client:load />
    </section>

    <section class="min-h-[50vh] md:min-h-[80vh] flex items-center justify-center py-8 md:py-16">
      <CurrentFocus client:load />
    </section>

    <section class="min-h-[30vh] md:min-h-[50vh] flex items-center justify-center py-8 md:py-16">
      <OutsideCoding client:load />
    </section>
  </div>
</ContentLayout>
