383a593c42
- Drop buttonRadius prop; button now uses --radius via rounded-md - Inject @theme radius mappings into ThemeProvider so rounded-* utilities pick up --radius inside the Tailwind CDN iframe - Add shared Container that consumes --container-max-width set from the global maxWidth prop, replacing ad-hoc "container mx-auto max-w-7xl px-6" wrappers across commerce, landing, footer, navigation, and others - Simplify maxWidth options to Small/Medium/Large/X-Large/Full bleed and shift the scale up so Large (1280px) matches the previous default Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
47 lines
1.4 KiB
TypeScript
47 lines
1.4 KiB
TypeScript
import { Container } from "@/components/layout/Container";
|
|
|
|
export type LogosProps = {
|
|
tagline: string;
|
|
items: Array<{ src: string; alt: string }>;
|
|
layout: "row" | "marquee";
|
|
};
|
|
|
|
export function Logos({ tagline, items, layout }: LogosProps) {
|
|
return (
|
|
<section className="border-y border-border bg-muted/40 py-12">
|
|
<Container>
|
|
{tagline ? (
|
|
<p className="mb-8 text-center text-xs uppercase tracking-[0.2em] text-muted-foreground">
|
|
{tagline}
|
|
</p>
|
|
) : null}
|
|
{layout === "marquee" ? (
|
|
<div className="overflow-hidden">
|
|
<div className="flex animate-[marquee_30s_linear_infinite] gap-16 [--gap:4rem]">
|
|
{[...items, ...items].map((it, i) => (
|
|
<img
|
|
key={i}
|
|
src={it.src}
|
|
alt={it.alt}
|
|
className="h-7 w-auto opacity-60 grayscale"
|
|
/>
|
|
))}
|
|
</div>
|
|
</div>
|
|
) : (
|
|
<div className="flex flex-wrap items-center justify-center gap-x-12 gap-y-6">
|
|
{items.map((it, i) => (
|
|
<img
|
|
key={i}
|
|
src={it.src}
|
|
alt={it.alt}
|
|
className="h-7 w-auto opacity-60 grayscale"
|
|
/>
|
|
))}
|
|
</div>
|
|
)}
|
|
</Container>
|
|
</section>
|
|
);
|
|
}
|