Add Container component and fix radius/maxWidth theming

- 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>
This commit is contained in:
Rami Bitar
2026-05-10 12:25:13 -04:00
parent 3a3d0a6ac8
commit 383a593c42
19 changed files with 92 additions and 65 deletions

View File

@@ -1,3 +1,5 @@
import { Container } from "@/components/layout/Container";
export type LogosProps = {
tagline: string;
items: Array<{ src: string; alt: string }>;
@@ -7,7 +9,7 @@ export type LogosProps = {
export function Logos({ tagline, items, layout }: LogosProps) {
return (
<section className="border-y border-border bg-muted/40 py-12">
<div className="container mx-auto max-w-7xl px-6">
<Container>
{tagline ? (
<p className="mb-8 text-center text-xs uppercase tracking-[0.2em] text-muted-foreground">
{tagline}
@@ -38,7 +40,7 @@ export function Logos({ tagline, items, layout }: LogosProps) {
))}
</div>
)}
</div>
</Container>
</section>
);
}