import { Head } from "$fresh/runtime.ts";
import { useSignal } from "@preact/signals";
import Counter from "@islands/Counter.tsx";
import { MainLayout } from "@components/layouts/main.tsx";
import { Card } from "@components/Card.tsx";

export default function Home() {
  const count = useSignal(3);
  return (
    <>
      <Head>
        <title>app</title>
      </Head>
      <MainLayout>
        <div class="flex flex-wrap justify-center items-center gap-4 px-4">
          <Card
            title="Recipes"
            image="/api/images?image=Recipes/images/placeholder.jpg&width=200&height=200"
            link="/recipes"
          />
        </div>
      </MainLayout>
    </>
  );
}
