Update gallery to bento grid, add real reviews, update phone numbers and locations

2026-07-15 13:51:22 +03:00
parent d4bcbb0cc3
commit 7a874ab11d
43 changed files with 1234 additions and 790 deletions
@@ -0,0 +1,59 @@
+import { Star } from "lucide-react";
+import ScrollReveal from "@/components/ScrollReveal";
+
+interface Testimonial {
+  text: string;
+  name: string;
+  from: string;
+}
+
+interface TestimonialsSectionProps {
+  testimonials: Testimonial[];
+  lang: string;
+}
+
+export default function TestimonialsSection({ testimonials, lang }: TestimonialsSectionProps) {
+  return (
+    <section className="py-28 bg-white">
+      <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <ScrollReveal className="text-center mb-16">
+          <span className="inline-block text-accent text-xs tracking-[0.25em] uppercase font-semibold mb-4">
+            {lang === "en" ? "Guest Reviews" : "Misafir Yorumları"}
+          </span>
+          <h2 className="font-serif text-5xl font-bold text-dark">
+            {lang === "en" ? "Experiences" : "Deneyimler"}
+          </h2>
+        </ScrollReveal>
+
+        <ScrollReveal stagger className="grid grid-cols-1 md:grid-cols-3 gap-6">
+          {testimonials.map((t, i) => (
+            <div key={i} className="relative bg-sand rounded-2xl p-8 border border-sand overflow-hidden">
+              {/* Large decorative quote */}
+              <span className="absolute top-3 right-5 font-serif text-[8rem] leading-none text-primary/8 select-none">
+                "
+              </span>
+              {/* Stars */}
+              <div className="flex gap-1 mb-5 relative z-10">
+                {Array.from({ length: 5 }).map((_, j) => (
+                  <Star key={j} className="w-3.5 h-3.5 text-accent" fill="#E87040" />
+                ))}
+              </div>
+              <p className="text-foreground/75 text-[13px] leading-relaxed mb-6 relative z-10 italic">
+                "{t.text}"
+              </p>
+              <div className="flex items-center gap-3 relative z-10">
+                <div className="w-9 h-9 bg-primary/10 rounded-full flex items-center justify-center flex-shrink-0">
+                  <span className="text-primary font-bold text-sm">{t.name[0]}</span>
+                </div>
+                <div>
+                  <span className="block font-semibold text-dark text-sm">{t.name}</span>
+                  <span className="text-muted text-xs">{t.from}</span>
+                </div>
+              </div>
+            </div>
+          ))}
+        </ScrollReveal>
+      </div>
+    </section>
+  );
+}