fix: header 控件区布局抖动清零(CLS 修复)
- ModeToggle:旧实现在 isClient 前完全不渲染(SSR 无按钮 → hydrate 后 凭空多出 40px)。改为恒渲染固定 40px 按钮:挂载前显示 Sun 占位图标, 挂载后切换当前主题图标(动画保留) - UserMenu:isPending 时渲染 24px 小圆(与终态 135px 差距大)。改为 与未登录终态同尺寸骨架:Sign in 透明文字(带 muted 底色块)+ Sign Up 半透明胶囊,右缘与终态精确对齐,占位色跟随各站主题 - SSR HTML 验证:首帧即含 Toggle theme 占位按钮 / Select language / UserMenu aria-hidden 骨架(curl 实证) - 逐帧截图验收:commit 时刻与 hydrate 后 header 右上角布局一致; Language/Toggle x 坐标全程稳定
This commit is contained in:
@@ -15,7 +15,7 @@
|
||||
"moduleResolution": "bundler",
|
||||
"resolveJsonModule": true,
|
||||
"isolatedModules": true,
|
||||
"jsx": "react-jsx",
|
||||
"jsx": "preserve",
|
||||
"incremental": true,
|
||||
"plugins": [
|
||||
{
|
||||
@@ -55,8 +55,7 @@
|
||||
"next-env.d.ts",
|
||||
"**/*.ts",
|
||||
"**/*.tsx",
|
||||
".next/types/**/*.ts",
|
||||
".next/dev/types/**/*.ts"
|
||||
".next/types/**/*.ts"
|
||||
],
|
||||
"exclude": [
|
||||
"node_modules"
|
||||
|
||||
Reference in New Issue
Block a user