Build the Salar Store storefront and connect products, blogs, and home specials to the Meshkee API.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-08-16 01:36:29 +03:30
parent 2783305f07
commit 7d26eaa838
113 changed files with 3269 additions and 96 deletions
@@ -0,0 +1,41 @@
+import Link from "next/link";
+import Image from "next/image";
+import { categories } from "@/lib/data";
+import { DrawFrame } from "./DrawFrame";
+
+export function Categories() {
+  return (
+    <section className="container-site mt-12">
+      <div className="flex items-end justify-between mb-6">
+        <h2 className="section-title">دسته‌بندی‌ها</h2>
+        <Link href="/products" className="text-sm text-brand">
+          همه محصولات
+        </Link>
+      </div>
+      <div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-3 md:gap-4">
+        {categories.map((cat) => (
+          <Link
+            key={cat.slug}
+            href={`/products/${cat.slug}`}
+            className="draw-frame-host relative flex items-center gap-3 rounded-2xl border border-black/5 bg-zinc-50 px-3 py-2 text-brand"
+          >
+            <Image
+              src={cat.image}
+              alt={cat.name}
+              width={88}
+              height={88}
+              className="size-[72px] sm:size-20 shrink-0 object-contain"
+            />
+            <span className="min-w-0">
+              <span className="block text-lg font-medium text-ink leading-none">{cat.name}</span>
+              <span dir="ltr" className="mt-1 block font-oswald text-[10px] font-normal tracking-[0.32em] text-zinc-400 uppercase">
+                {cat.english}
+              </span>
+            </span>
+            <DrawFrame />
+          </Link>
+        ))}
+      </div>
+    </section>
+  );
+}