Files
Rami Bitar 383a593c42 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>
2026-05-10 12:25:13 -04:00

22 lines
447 B
TypeScript

import * as React from "react";
import { cn } from "@/lib/utils";
export type ContainerProps = React.HTMLAttributes<HTMLElement> & {
as?: React.ElementType;
};
export function Container({
as: Comp = "div",
className,
style,
...props
}: ContainerProps) {
return (
<Comp
className={cn("mx-auto w-full px-6", className)}
style={{ maxWidth: "var(--container-max-width, 80rem)", ...style }}
{...props}
/>
);
}