Initial import of 1407 block sources under blocks/
Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
@@ -0,0 +1,129 @@
|
||||
"use client";
|
||||
|
||||
import { ArrowRight } from "lucide-react";
|
||||
|
||||
import { Button } from "@/components/ui/button";
|
||||
import { cn } from "@/lib/utils";
|
||||
|
||||
interface Project2bProps {
|
||||
title: string;
|
||||
title2?: string;
|
||||
year: string;
|
||||
category: string;
|
||||
client: string;
|
||||
imageSrc: string;
|
||||
imageAlt: string;
|
||||
imageCaption?: string;
|
||||
overviewHeading: string;
|
||||
mainDescription: string;
|
||||
detailDescription: string;
|
||||
buttonText: string;
|
||||
className?: string;
|
||||
}
|
||||
|
||||
const Project2b = ({
|
||||
title = "دیجیتال",
|
||||
title2 = "تیم",
|
||||
year = "«۲۲۴»",
|
||||
category = "«دیزاین سیستم»",
|
||||
client = "«استودیو محصول»",
|
||||
imageSrc = "/block-media/shadcnblocks/block/photos/artistic-portrait-glitch-yqp6z.png",
|
||||
imageAlt = "میز کار طراح با ابزارها و عناصر دیزاین سیستم",
|
||||
imageCaption = "نمای داشبورد فروش با نمودارهای KPI و خط لوله معاملات",
|
||||
overviewHeading = "مرور پروژه",
|
||||
mainDescription = "یک رابط پویا که KPIهای فروش، نرخ تبدیل و عملکرد تیم را در یک داشبورد یکپارچه نمایش میدهد.",
|
||||
detailDescription = "این پروژه بر یک صفحه فرود محصول متمرکز است که برای بازتاب روح نوآورانه و پویای برند طراحی شده است. رابط با گرادیانهای نرم و میکروانیمیشنهای ظریف ساخته شده تا حس حرکت و مدرنبودن را منتقل کند. ترکیب تایپوگرافی درشت و تم تیره، هویت آیندهنگر برند را تجسم میکند و چیدمان واکنشگرا تجربهای یکدست و بهیادماندنی میسازد. این رابط با بلاکهای آماده shadcn پیاده شده تا ترکیبی از خلاقیت، سرعت و کیفیت را به نمایش بگذارد.",
|
||||
buttonText = "تماس با ما",
|
||||
className,
|
||||
}: Project2bProps) => {
|
||||
return (
|
||||
<section dir="rtl" lang="fa" className={cn("py-32", className)}>
|
||||
<div className="container mx-auto px-8 py-24">
|
||||
<div className="mx-auto max-w-7xl">
|
||||
<div className="mb-24 grid grid-cols-12 gap-8">
|
||||
<div className="col-span-12 text-start md:col-span-8">
|
||||
<h1 className="text-4xl leading-tight font-normal tracking-wider text-foreground md:text-6xl lg:text-7xl">
|
||||
{title}
|
||||
{title2 && (
|
||||
<>
|
||||
<br />
|
||||
{title2}
|
||||
</>
|
||||
)}
|
||||
</h1>
|
||||
</div>
|
||||
<div className="col-span-12 md:col-span-4">
|
||||
<div className="space-y-6 border-s border-border ps-8 text-start">
|
||||
<div className="space-y-2">
|
||||
<div className="text-xs font-medium tracking-wider text-muted-foreground">
|
||||
سال
|
||||
</div>
|
||||
<div className="text-sm font-medium text-foreground">
|
||||
{year}
|
||||
</div>
|
||||
</div>
|
||||
<div className="space-y-2">
|
||||
<div className="text-xs font-medium tracking-wider text-muted-foreground">
|
||||
دستهبندی
|
||||
</div>
|
||||
<div className="text-sm font-medium text-foreground">
|
||||
{category}
|
||||
</div>
|
||||
</div>
|
||||
<div className="space-y-2">
|
||||
<div className="text-xs font-medium tracking-wider text-muted-foreground">
|
||||
مشتری
|
||||
</div>
|
||||
<div className="text-sm font-medium text-foreground">
|
||||
{client}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="mb-24">
|
||||
<div className="aspect-[3/2] overflow-hidden bg-muted">
|
||||
<img
|
||||
src={imageSrc}
|
||||
alt={imageAlt}
|
||||
className="h-full w-full object-cover"
|
||||
/>
|
||||
</div>
|
||||
{imageCaption && (
|
||||
<div className="mt-4 text-start text-xs font-medium tracking-wider text-muted-foreground">
|
||||
{imageCaption}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<div className="grid grid-cols-12 gap-8">
|
||||
<div className="col-span-12 text-start md:col-span-3">
|
||||
<h2 className="text-xs font-medium tracking-wider text-foreground">
|
||||
{overviewHeading}
|
||||
</h2>
|
||||
</div>
|
||||
<div className="col-span-12 text-start md:col-span-9">
|
||||
<div className="space-y-8">
|
||||
<h3 className="text-xl leading-relaxed font-light text-foreground md:text-2xl">
|
||||
{mainDescription}
|
||||
</h3>
|
||||
<p className="text-base leading-relaxed text-muted-foreground">
|
||||
{detailDescription}
|
||||
</p>
|
||||
<div className="pt-4">
|
||||
<Button variant="outline" className="group gap-2">
|
||||
{buttonText}
|
||||
<ArrowRight className="size-4 transition-transform rtl:rotate-180" />
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
};
|
||||
|
||||
export { Project2b };
|
||||
Reference in New Issue
Block a user