first commit

frontend/src/components/ui/Container.jsx

@@ -0,0 +1,24 @@
+import { cn } from '../../utils/cn'
+
+const widths = {
+  default: 'max-w-content',
+  narrow: 'max-w-editorial',
+  prose: 'max-w-prose',
+  full: 'max-w-none',
+}
+
+export function Container({ as = 'div', width = 'default', className, children, ...props }) {
+  const Tag = as
+  return (
+    <Tag
+      className={cn(
+        'mx-auto w-full px-gutter sm:px-gutter-md lg:px-gutter-lg',
+        widths[width],
+        className,
+      )}
+      {...props}
+    >
+      {children}
+    </Tag>
+  )
+}