first commit

2026-04-15 22:37:39 +03:00
parent 3c59557946
commit 1590bef227
156 changed files with 13823 additions and 84 deletions
--- a/app/accommodation/page.tsx
+++ b/app/accommodation/page.tsx
@@ -0,0 +1,90 @@
+"use client";
+
+import { motion } from "framer-motion";
+import { resortData } from "@/src/data/resort";
+import { useState } from "react";
+import AccommodationCard from "../components/AccommodationCard";
+
+export default function AccommodationPage() {
+  const lang = "tr";
+  const [filter, setFilter] = useState<"all" | "rooms" | "residence">("all");
+
+  const filteredRooms = resortData.rooms.filter(room => {
+    if (filter === "all") return true;
+    if (filter === "rooms") return !room.slug.includes("rezidans");
+    if (filter === "residence") return room.slug.includes("rezidans");
+    return true;
+  });
+
+  return (
+    <div className="bg-[#ECE7E1] min-h-screen pt-72 md:pt-96 pb-48  flex flex-col items-center">
+      <div className="max-w-[1600px] mx-auto px-6 ">
+
+        {/* Header Section */}
+        <div className="space-y-12 mb-32 mt-40">
+          <div className="space-y-6">
+            <motion.div
+              initial={{ opacity: 0, x: -20 }}
+              animate={{ opacity: 1, x: 0 }}
+              className="flex items-center gap-4"
+            >
+              <div className="w-12 h-px bg-gold" />
+              <span className="text-gold text-[10px] tracking-[0.5em] font-bold uppercase block">
+                KONAKLAMA DENEYİMİ
+              </span>
+            </motion.div>
+
+            <motion.h1
+              initial={{ y: 30, opacity: 0 }}
+              animate={{ y: 0, opacity: 1 }}
+              transition={{ delay: 0.1, duration: 0.8 }}
+              className="text-6xl md:text-8xl font-serif text-gray-900 leading-[0.85] tracking-tight"
+            >
+              Zarafet & <br /><span className="italic font-light">Ege Serüveni</span>
+            </motion.h1>
+
+            <motion.div
+              initial={{ opacity: 0 }}
+              animate={{ opacity: 1 }}
+              transition={{ delay: 0.3 }}
+              className="pt-10 border-t border-black/5"
+            >
+              <p className="text-gray-500 font-light text-2xl leading-relaxed italic border-l-4 border-gold/20 pl-8 max-w-2xl">
+                &ldquo;Bardakçı Koyu&apos;nun büyüleyici manzarasında, lüksün ve huzurun buluştuğu noktada sizi ağırlıyoruz.&rdquo;
+              </p>
+            </motion.div>
+          </div>
+
+          <div className="flex bg-white p-2 rounded-full shadow-sm border border-black/5 w-fit">
+            {["all", "rooms", "residence"].map((id) => (
+              <button
+                key={id}
+                onClick={() => setFilter(id as any)}
+                className={`px-10 py-3 rounded-full text-[10px] font-bold tracking-[0.2em] transition-all duration-500 ${filter === id ? "bg-[#5C6353] text-white shadow-lg" : "text-gray-400 hover:text-gray-900"
+                  }`}
+              >
+                {id === "all" ? "HEPSİ" : id === "rooms" ? "ODALAR" : "REZİDANS"}
+              </button>
+            ))}
+          </div>
+        </div>
+
+        {/* Accommodation Grid - Single Column for Wide Mode */}
+        <div className="flex flex-col gap-y-16">
+          {filteredRooms.map((room) => (
+            <motion.div
+              key={room.slug}
+              layout
+              initial={{ opacity: 0, y: 30 }}
+              whileInView={{ opacity: 1, y: 0 }}
+              viewport={{ once: true }}
+              transition={{ duration: 0.8 }}
+            >
+              <AccommodationCard room={room} lang={lang} />
+            </motion.div>
+          ))}
+        </div>
+      </div>
+    </div>
+  );
+}