---
import Layout from '../layouts/Layout.astro'
import Button from '../../fwt/components/Button/Button'
import Logo from '../../fwt/components/Logo/Logo'
import OptimizeLogo from '../../fwt/components/Optimizer/OptimizeLogo'
import OptimizeImage from '../../fwt/components/Optimizer/OptimizeImage'
import Link from '../../fwt/components/Link/Link'
import Counter from '../components/Counter/Counter'
import Page from '../../fwt/components/Page/Page'
import Footer from '../../fwt/components/Footer/Footer'
import Row from '../../fwt/components/Row/Row'
import Image from '../../fwt/components/Image/Image'
import PA1 from '../../fwt/images/pat-alcala.avif'
import PA2 from '../../fwt/images/pat-alcala.webp'
import Copyright from '../../fwt/components/Copyright/Copyright'

// const sample = import.meta.env.SAMPLE
---

<Layout title="FWT">
  <Page alignment="column">
    <Link to="https://git.patalcala.com/patalcala9/fwt">
      <Logo size={250} />
    </Link>

    <h1>Fast WebApp Template</h1>
    <Counter client:idle />

    <Button edges="rounded" label="FWT Components" to="/next" />

    <Footer>
      <Row content="right" gap={0.5}>
        <Image avif={PA1.src} webp={PA2.src} size={100} />
        <Copyright year="2025" name="Pat Alcala" />
      </Row>
    </Footer>

    <style lang="sass">
      h1
        color: #3377AC
    </style>
  </Page>
</Layout>