132 lines
3.5 KiB
TypeScript
132 lines
3.5 KiB
TypeScript
"use client";
|
|
|
|
import { cn } from "@/lib/utils";
|
|
const ITEMS = [
|
|
{
|
|
name: "Zarinpal",
|
|
src: "/block-media/shadcnblocks/block/mainline/logos/mercury.svg",
|
|
width: 143,
|
|
height: 26,
|
|
href: "https://www.zarinpal.com/",
|
|
},
|
|
{
|
|
name: "Watershed",
|
|
src: "/block-media/shadcnblocks/block/mainline/logos/watershed.svg",
|
|
width: 154,
|
|
height: 31,
|
|
href: "https://watershed.com",
|
|
},
|
|
{
|
|
name: "Retool",
|
|
src: "/block-media/shadcnblocks/block/mainline/logos/retool.svg",
|
|
width: 113,
|
|
height: 22,
|
|
href: "https://retool.com",
|
|
},
|
|
{
|
|
name: "Descript",
|
|
src: "/block-media/shadcnblocks/block/mainline/logos/descript.svg",
|
|
width: 112,
|
|
height: 27,
|
|
href: "https://descript.com",
|
|
},
|
|
{
|
|
name: "Perplexity",
|
|
src: "/block-media/shadcnblocks/block/mainline/logos/perplexity.svg",
|
|
width: 141,
|
|
height: 32,
|
|
href: "https://perplexity.ai",
|
|
},
|
|
{
|
|
name: "Monzo",
|
|
src: "/block-media/shadcnblocks/block/mainline/logos/monzo.svg",
|
|
width: 104,
|
|
height: 18,
|
|
href: "https://monzo.com",
|
|
},
|
|
{
|
|
name: "Ramp",
|
|
src: "/block-media/shadcnblocks/block/mainline/logos/ramp.svg",
|
|
width: 105,
|
|
height: 28,
|
|
href: "https://ramp.com",
|
|
},
|
|
{
|
|
name: "Raycast",
|
|
src: "/block-media/shadcnblocks/block/mainline/logos/raycast.svg",
|
|
width: 128,
|
|
height: 33,
|
|
href: "https://raycast.com",
|
|
},
|
|
{
|
|
name: "Arc",
|
|
src: "/block-media/shadcnblocks/block/mainline/logos/arc.svg",
|
|
width: 90,
|
|
height: 28,
|
|
href: "https://arc.com",
|
|
},
|
|
];
|
|
|
|
interface Logos7Props {
|
|
className?: string;
|
|
}
|
|
|
|
const Logos7 = ({ className }: Logos7Props) => {
|
|
return (
|
|
<section
|
|
dir="rtl"
|
|
lang="fa"
|
|
className={cn("overflow-hidden bg-muted py-32 dark:bg-muted", className)}
|
|
>
|
|
<div className="container text-center">
|
|
<h2 className="text-xl font-semibold tracking-tight text-balance lg:text-3xl">
|
|
پشتوانه بهترین تیمهای محصول جهان.
|
|
<br />
|
|
<span className="text-muted-foreground">
|
|
از استارتاپهای نسل جدید تا شرکتهای تثبیتشده.
|
|
</span>
|
|
</h2>
|
|
</div>
|
|
|
|
<div className="relative mt-10">
|
|
<div className="flex w-full">
|
|
{/* First marquee group */}
|
|
<div
|
|
className="flex shrink-0 animate-marquee items-center gap-12 rtl:[animation-direction:reverse]"
|
|
>
|
|
{ITEMS.map((logo, index) => (
|
|
<a href={logo.href} target="_blank" key={index} className="p-6">
|
|
<img
|
|
src={logo.src}
|
|
alt={`لوگوی ${logo.name}`}
|
|
width={logo.width}
|
|
height={logo.height}
|
|
className="object-contain transition-opacity hover:opacity-70"
|
|
/>
|
|
</a>
|
|
))}
|
|
</div>
|
|
{/* Second marquee group */}
|
|
<div
|
|
className="flex shrink-0 animate-marquee items-center gap-12 rtl:[animation-direction:reverse]"
|
|
>
|
|
{ITEMS.map((logo, index) => (
|
|
<a href={logo.href} target="_blank" key={index} className="p-6">
|
|
<img
|
|
src={logo.src}
|
|
alt={`لوگوی ${logo.name}`}
|
|
width={logo.width}
|
|
height={logo.height}
|
|
className="object-contain transition-opacity hover:opacity-70"
|
|
/>
|
|
</a>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
);
|
|
};
|
|
|
|
export { Logos7 };
|