Site için geliştirmeler yapıldı.

2026-01-06 23:45:38 +03:00
parent 96f195ffa6
commit 18023550e0
26 changed files with 971 additions and 56 deletions
--- a/app/(public)/products/page.tsx
+++ b/app/(public)/products/page.tsx
@@ -0,0 +1,80 @@
+
+import { Card, CardContent, CardFooter, CardHeader, CardTitle } from "@/components/ui/card"
+import { Button } from "@/components/ui/button"
+import Image from "next/image"
+
+const products = [
+    {
+        id: 1,
+        name: "Ev Tipi Çelik Kasa",
+        image: "/images/safe-1.jpg",
+        category: "Ev",
+    },
+    {
+        id: 2,
+        name: "Ofis Tipi Yanmaz Kasa",
+        image: "/images/safe-2.jpg",
+        category: "Ofis",
+    },
+    {
+        id: 3,
+        name: "Otel Odası Kasası",
+        image: "/images/safe-3.jpg",
+        category: "Otel",
+    },
+    {
+        id: 4,
+        name: "Silah Kasası (Tüfek)",
+        image: "/images/safe-4.jpg",
+        category: "Özel",
+    },
+    {
+        id: 5,
+        name: "Kuyumcu Kasası",
+        image: "/images/safe-5.jpg",
+        category: "Ticari",
+    },
+    {
+        id: 6,
+        name: "Duvar İçi Gizli Kasa",
+        image: "/images/safe-6.jpg",
+        category: "Ev",
+    },
+]
+
+export default function ProductsPage() {
+    return (
+        <div className="container py-12 md:py-24">
+            <div className="flex flex-col items-center mb-12 text-center">
+                <h1 className="text-4xl font-bold tracking-tight mb-4 font-outfit">Ürün Koleksiyonumuz</h1>
+                <p className="text-muted-foreground max-w-2xl">
+                    Güvenliğiniz için en son teknoloji ile üretilmiş, sertifikalı çelik kasa çözümlerimizi inceleyin.
+                </p>
+            </div>
+
+            <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-6">
+                {products.map((product) => (
+                    <Card key={product.id} className="overflow-hidden border-0 shadow-md hover:shadow-xl transition-all duration-300">
+                        <div className="aspect-[4/5] relative bg-slate-100 dark:bg-slate-800">
+                            {/* Placeholder for real images */}
+                            <div className="absolute inset-0 flex items-center justify-center text-slate-400">
+                                <span className="text-sm">Görsel: {product.name}</span>
+                            </div>
+                        </div>
+                        <CardHeader className="p-4">
+                            <div className="flex justify-between items-start">
+                                <div>
+                                    <span className="text-xs font-medium text-slate-500 uppercase tracking-wider">{product.category}</span>
+                                    <CardTitle className="text-lg mt-1">{product.name}</CardTitle>
+                                </div>
+                            </div>
+                        </CardHeader>
+                        <CardFooter className="p-4 pt-0">
+                            <Button className="w-full">Detayları İncele</Button>
+                        </CardFooter>
+                    </Card>
+                ))}
+            </div>
+        </div>
+    )
+}