Initial import of 1407 block sources under blocks/

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-07-11 21:21:29 +03:30
commit 85836ef183
1412 changed files with 303567 additions and 0 deletions
@@ -0,0 +1,148 @@
+"use client";
+
+import type { Variants } from "framer-motion";
+import { motion } from "framer-motion";
+import { ArrowUpRight } from "lucide-react";
+
+import { cn } from "@/lib/utils";
+
+const projects6Props = [
+  {
+    id: 1,
+    category: "محصول",
+    title: "پوما",
+    image: "/block-media/shadcnblocks/block/lummi/bw1.jpeg",
+    description: "رابط‌های جسورانه و الگوهای ماندگار.",
+  },
+  {
+    id: 2,
+    category: "فرهنگ",
+    title: "پس از انتشار",
+    image: "/block-media/shadcnblocks/block/lummi/bw5.jpeg",
+    description: "چه انتشاری!",
+  },
+  {
+    id: 3,
+    category: "فرهنگ",
+    title: "نمایش پروژه",
+    image: "/block-media/shadcnblocks/block/lummi/bw2.jpeg",
+    description: "ثبت تعامل‌های واقعی کاربر در محیط محصول.",
+  },
+  {
+    id: 4,
+    category: "وب",
+    title: "ظرافت",
+    image: "/block-media/shadcnblocks/block/lummi/bw3.jpeg",
+    description: "الگوهای رابطی که محصولات نسل ما را تعریف می‌کنند.",
+  },
+];
+
+const containerVariants: Variants = {
+  hidden: { opacity: 0 },
+  visible: {
+    opacity: 1,
+    transition: {
+      staggerChildren: 0.2,
+    },
+  },
+};
+
+const itemVariants: Variants = {
+  hidden: { opacity: 0, y: 20 },
+  visible: {
+    opacity: 1,
+    y: 0,
+    transition: {
+      duration: 0.6,
+      ease: "easeOut",
+    },
+  },
+};
+
+const ProjectCard = ({
+  project,
+}: {
+  project: (typeof projects6Props)[0];
+  index: number;
+}) => {
+  return (
+    <motion.div
+      variants={itemVariants}
+      whileHover={{ scale: 1.02 }}
+      whileTap={{ scale: 0.98 }}
+      className="group relative cursor-pointer overflow-hidden rounded-3xl bg-black shadow-2xl"
+    >
+      <div className="relative aspect-[5/5] overflow-hidden">
+        <img
+          src={project.image}
+          alt={project.title}
+          className="h-full w-full object-cover transition-transform duration-700 group-hover:scale-110"
+        />
+
+        <div className="absolute inset-0 bg-gradient-to-t from-black/80 via-black/20 to-transparent" />
+
+        <div className="absolute top-4 start-4">
+          <span className="inline-block rounded-full border border-white/20 bg-black/50 px-3 py-1.5 text-xs font-semibold text-white backdrop-blur-sm">
+            {project.category}
+          </span>
+        </div>
+
+        <div className="absolute top-4 end-4 -translate-x-2 transform opacity-0 transition-all duration-300 group-hover:translate-x-0 group-hover:opacity-100">
+          <div className="flex h-8 w-8 items-center justify-center rounded-full border border-white/30 bg-white/20 backdrop-blur-sm">
+            <ArrowUpRight className="h-4 w-4 text-white rtl:rotate-180" />
+          </div>
+        </div>
+
+        <div className="absolute inset-x-4 bottom-4 text-start">
+          <h3 className="mb-1 text-2xl font-bold tracking-tight text-white md:text-3xl">
+            {project.title}
+          </h3>
+          <p className="text-sm text-white/70 opacity-0 transition-opacity duration-300 group-hover:opacity-100">
+            {project.description}
+          </p>
+        </div>
+      </div>
+    </motion.div>
+  );
+};
+
+interface Projects6Props {
+  className?: string;
+}
+
+const Projects6 = ({ className }: Projects6Props) => {
+  return (
+    <section dir="rtl" lang="fa" className={cn("py-32", className)}>
+      <div className="container">
+        <motion.div
+          initial={{ opacity: 0, y: -20 }}
+          animate={{ opacity: 1, y: 0 }}
+          transition={{ duration: 0.8, ease: "easeOut" }}
+          className="mb-20 text-center"
+        >
+          <div className="mb-6">
+            <span className="inline-flex items-center gap-2 text-sm font-medium tracking-wide text-muted-foreground">
+              <div className="h-2 w-2 rounded-full bg-foreground"></div>کاربر در حال تعامل</span>
+          </div>
+          <h1 className="text-6xl leading-none font-black tracking-tight md:text-8xl lg:text-9xl">
+            <span className="block">ثبت</span>
+            <span className="block">لحظات</span>
+          </h1>
+        </motion.div>
+
+        <motion.div
+          variants={containerVariants}
+          initial="hidden"
+          animate="visible"
+          className="mx-auto grid max-w-7xl grid-cols-1 gap-4 md:grid-cols-2"
+        >
+          {projects6Props.map((project, index) => (
+            <ProjectCard key={project.id} project={project} index={index} />
+          ))}
+        </motion.div>
+      </div>
+    </section>
+  );
+};
+
+export { Projects6 };