feat(ui): 新增 PageContainer 统一页容器(P3-1)+ 作品库采用

This commit is contained in:
Yaojia Wang
2026-07-11 07:26:54 +02:00
parent 83ba47ab8f
commit d3e9ae972f
2 changed files with 33 additions and 2 deletions

View File

@@ -0,0 +1,30 @@
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>
);
}