Files
writer-work-flow/apps/web/components/ui/PageContainer.tsx

31 lines
709 B
TypeScript
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

import type { ReactNode } from "react";
import { cn } from "@/lib/ui/variants";
export type PageWidth = "prose" | "default" | "wide";
const widths: Record<PageWidth, string> = {
prose: "max-w-3xl",
default: "max-w-5xl",
wide: "max-w-6xl",
};
interface PageContainerProps {
children: ReactNode;
width?: PageWidth;
className?: string;
}
// 统一页容器:居中 + 一致的最大宽度与内边距节奏(替换各页手写的 mx-auto max-w-* px-6 py-10
export function PageContainer({
children,
width = "default",
className,
}: PageContainerProps) {
return (
<div className={cn("mx-auto px-6 py-10 sm:px-8", widths[width], className)}>
{children}
</div>
);
}