Remove unused imports and update home page layout

src/components/layout/Footer.jsx

@@ -1,6 +1,3 @@
-import Link from "next/link";
-import { Button } from "../ui/button";
-
 export default function FooterComponent() {
   return (
     <footer className="inset-x-0 top-0 z-50 border-t bg-gray-900">

src/components/layout/Header.jsx

@@ -1,15 +1,10 @@
 import Link from "next/link";
 import { Button } from "@/src/components/ui/button";
-import { MenuIcon, XIcon } from "lucide-react";
+import { MenuIcon } from "lucide-react";
 import { useState } from "react";
 import {
   Drawer,
-  DrawerClose,
   DrawerContent,
-  DrawerDescription,
-  DrawerFooter,
-  DrawerHeader,
-  DrawerTitle,
   DrawerTrigger,
 } from "@/src/components/ui/drawer";
 

src/components/layout/HomeLayout.jsx

@@ -5,7 +5,7 @@ export default function HomeLayout({ children }) {
   return (
     <>
       <HeaderComponent />
-      {children}
+      <main className="container p-4 md:p-6">{children}</main>
       <FooterComponent />
     </>
   );

src/pages/index.js

@@ -1,11 +1,41 @@
+import Link from "next/link";
 import HomeLayout from "../components/layout/HomeLayout";
+import { Button } from "../components/ui/button";
 export default function Home() {
   return (
     <HomeLayout>
-      <main>
-        <h1>Home</h1>
-        <p>Welcome to the home page</p>
-      </main>
+      <section className="flex items-center justify-between">
+        <div className="max-w-lg space-y-4 flex flex-col">
+          <h1 className="text-5xl font-bold leading-tight text-gray-900">
+            Topluluğunuzu Oluşturun ve Yönetin
+          </h1>
+          <p>
+            DÜSosyal, topluluklarınızı oluşturmanıza ve yönetmenize yardımcı
+            olur. Ücretsizdir ve her zaman öyle kalacaktır.
+          </p>
+          <div className="flex flex-row space-x-4">
+            <Button asChild>
+              <Link href="/communities/create">Topluluk Oluştur</Link>
+            </Button>
+            <Button asChild variant="outline">
+              <Link href="/contact">İletişime Geçin</Link>
+            </Button>
+          </div>
+        </div>
+        <div className="flex-shrink-0">
+          <img
+            alt="Hero illustration"
+            className="h-auto w-full max-w-lg rounded-lg"
+            height="300"
+            src="/assets/images/auth-layout-image.jpg"
+            style={{
+              aspectRatio: "400/300",
+              objectFit: "cover",
+            }}
+            width="400"
+          />
+        </div>
+      </section>
     </HomeLayout>
   );
 }