adilalloandCursor
5bd49eaed8
The space-between row was drawn for six logos; three marks looked abandoned at the edges. Co-authored-by: Cursor <cursoragent@cursor.com>
41 lines
1.4 KiB
TypeScript
41 lines
1.4 KiB
TypeScript
"use client";
|
|
|
|
import { memo } from "react";
|
|
import Image from "next/image";
|
|
import type { LogoWallViewProps } from "./LogoWall.types";
|
|
|
|
function LogoWallView({ displayLogos, className }: LogoWallViewProps) {
|
|
return (
|
|
<section
|
|
className={`bg-[var(--color-surface-default-primary)] p-[var(--space-800)] md:px-[var(--space-600)] md:py-[var(--space-800)] lg:px-[var(--space-1800)] lg:py-[var(--space-1200)] xl:px-[160px] xl:py-[var(--space-1800)] ${className}`}
|
|
data-figma-node="18483-18425"
|
|
>
|
|
<div className="w-full opacity-60">
|
|
<div className="flex w-full flex-col items-center justify-center gap-[38.4px] sm:flex-row sm:flex-wrap sm:justify-center md:flex-nowrap lg:gap-[var(--space-1200)]">
|
|
{displayLogos.map((logo, index) => (
|
|
<div
|
|
key={logo.alt || index}
|
|
className="flex shrink-0 items-center justify-center"
|
|
>
|
|
<Image
|
|
src={logo.src}
|
|
alt={logo.alt}
|
|
className={`${logo.size || "h-8"} w-auto object-contain`}
|
|
priority={index < 2}
|
|
unoptimized
|
|
width={0}
|
|
height={0}
|
|
sizes="100vw"
|
|
/>
|
|
</div>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</section>
|
|
);
|
|
}
|
|
|
|
LogoWallView.displayName = "LogoWallView";
|
|
|
|
export default memo(LogoWallView);
|