Initial commit: Alma Beauti Next.js site.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-08-31 19:00:05 +03:30
commit 755eb424b2
102 changed files with 10854 additions and 0 deletions
@@ -0,0 +1,61 @@
+"use client";
+
+import { useState } from "react";
+
+import { testimonials } from "@/data/site";
+
+function QuoteIcon() {
+  return (
+    <svg className="quote-icon" width="29" height="29" viewBox="0 0 24 24" aria-hidden>
+      <path
+        fill="currentColor"
+        d="M7.2 19.2c-1.7 0-3.1-.6-4.1-1.7S1.5 14.8 1.5 13c0-2 .5-3.8 1.6-5.5S5.7 4.5 7.8 3.6l.9 1.6c-1.5.7-2.6 1.6-3.3 2.8-.7 1.1-1 2.3-1 3.5 0 .4.1.6.4.7.7.2 1.3.6 1.8 1.1.5.5.8 1.2.8 2 0 1-.3 1.8-1 2.5-.7.7-1.5 1-2.2 1.4zm11.2 0c-1.7 0-3.1-.6-4.1-1.7s-1.6-2.7-1.6-4.5c0-2 .5-3.8 1.6-5.5s2.6-3 4.7-3.9l.9 1.6c-1.5.7-2.6 1.6-3.3 2.8-.7 1.1-1 2.3-1 3.5 0 .4.1.6.4.7.7.2 1.3.6 1.8 1.1.5.5.8 1.2.8 2 0 1-.3 1.8-1 2.5-.6.7-1.4 1.4-2.2 1.4z"
+      />
+    </svg>
+  );
+}
+
+export default function Testimonials({ title }: { title?: string }) {
+  const [index, setIndex] = useState(0);
+  const visible = [0, 1, 2].map((offset) => {
+    const item = testimonials[(index + offset) % testimonials.length];
+    return { item, key: `${index}-${offset}` };
+  });
+
+  return (
+    <section className="testimonial-main-container" id="testimonial">
+      <div className="container-fluid">
+        <div className="section-title" style={{ textAlign: "center" }}>
+          <h2>{title || "نظر برخی مراجعه کنندگان عزیز"}</h2>
+          <p className="kicker latin">USER COMMENTS</p>
+        </div>
+
+        <div className="testimonial-slider">
+          <div className="testimonial-track">
+            {visible.map(({ item, key }) => (
+              <article className="testimonial-inner" key={key}>
+                <div className="testimonial-right-inner">
+                  <QuoteIcon />
+                  <p>{item.text}</p>
+                  <cite>{item.author}</cite>
+                </div>
+              </article>
+            ))}
+          </div>
+
+          <div className="testimonial-dots">
+            {testimonials.map((_, i) => (
+              <button
+                key={i}
+                type="button"
+                className={i === index ? "active" : undefined}
+                aria-label={`نظر ${i + 1}`}
+                onClick={() => setIndex(i)}
+              />
+            ))}
+          </div>
+        </div>
+      </div>
+    </section>
+  );
+}