43 lines
1.6 KiB
TypeScript
43 lines
1.6 KiB
TypeScript
|
import ScrollReveal from "./ScrollReveal";
|
||
|
|
|
||
|
|
const partners = [
|
||
|
|
{ name: "THOR Broadcast", logo: "/images/clients/thor-logo.png", width: 140, height: 30 },
|
||
|
|
{ name: "Ross Video", logo: "/images/clients/ross-video.png", width: 140, height: 56 },
|
||
|
|
{ name: "Grass Valley", logo: "/images/clients/grass-valley.png", width: 150, height: 32 },
|
||
|
|
{ name: "vMix by Studio Coast", logo: "/images/clients/vmix.png", width: 130, height: 53 },
|
||
|
|
{ name: "RED Digital Cinema", logo: "/images/partners/red-digital.png", width: 60, height: 60 },
|
||
|
|
];
|
||
|
|
|
||
|
|
export default function Partners() {
|
||
|
|
return (
|
||
|
|
<section className="py-14 bg-surface-elevated border-t border-border">
|
||
|
|
<div className="max-w-6xl mx-auto px-6">
|
||
|
|
<ScrollReveal>
|
||
|
|
<p className="font-mono text-[10px] tracking-[0.3em] uppercase text-white/30 text-center mb-10">
|
||
|
|
Technology Partners
|
||
|
|
</p>
|
||
|
|
<div className="flex flex-wrap justify-center items-center gap-x-16 gap-y-8">
|
||
|
|
{partners.map((partner) => (
|
||
|
|
<div
|
||
|
|
key={partner.name}
|
||
|
|
className="opacity-35 hover:opacity-80 transition-all duration-500"
|
||
|
|
title={partner.name}
|
||
|
|
>
|
||
|
|
<img
|
||
|
|
src={partner.logo}
|
||
|
|
alt={partner.name}
|
||
|
|
width={partner.width}
|
||
|
|
height={partner.height}
|
||
|
|
loading="lazy"
|
||
|
|
className="logo-silhouette max-h-10 w-auto object-contain"
|
||
|
|
style={{ filter: "brightness(0) invert(1)" }}
|
||
|
|
/>
|
||
|
|
</div>
|
||
|
|
))}
|
||
|
|
</div>
|
||
|
|
</ScrollReveal>
|
||
|
|
</div>
|
||
|
|
</section>
|
||
|
|
);
|
||
|
|
}
|