Fix ultrawide layout: Tailwind was not generating max-width classes.

Move width utilities into scanned components as literal class names, add lib to Tailwind content and safelist. Verified max-w-4xl in build CSS and /learn HTML.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
dekun
2026-06-11 00:38:00 +08:00
parent 9fc7336095
commit 26ccecb361
5 changed files with 29 additions and 37 deletions
+2 -22
View File
@@ -1,22 +1,2 @@
const pad = "px-4 sm:px-6 lg:px-8";
/** 内容区宽度档位(带鱼屏居中,两侧留空) */
export const CONTENT_SHELL = {
/** 常规页:约 896px */
default: `w-full max-w-4xl ${pad}`,
/** 首页、文章:约 768px */
narrow: `w-full max-w-3xl ${pad}`,
/** 双栏测算:约 960px */
wide: `w-full max-w-[960px] ${pad}`,
} as const;
export type ContentShellWidth = keyof typeof CONTENT_SHELL;
/** 页眉 / 页脚 — 与最宽内容区对齐 */
export const APP_CONTAINER = `mx-auto ${CONTENT_SHELL.wide}`;
/** @deprecated 使用 PageShell width="narrow" */
export const HOME_CONTAINER = `mx-auto ${CONTENT_SHELL.narrow}`;
/** 双栏测算工作区 */
export const MODE_CONTAINER = `mx-auto ${CONTENT_SHELL.wide}`;
/** @deprecated 宽度类已移至各组件内完整书写,避免 Tailwind 漏扫 */
export type ContentShellWidth = "default" | "narrow" | "wide";