wait4xandGLM-5.3
945a9ee610
- 首页：名片+身份陈述空槽+按年分组分轨列表（情绪色/mono标签）+影像格+项目墙
- 文章 /archives/{slug}（与 Halo 旧 URL 1:1）：reading→衬线纸墨 / tech→
TOC 侧栏(≥1120 sticky)+2px 进度条+Artalk 容器占位
- 图库：grid masonry（构建期 aspect-ratio 零 JS）+原生 dialog lightbox
（←→/Esc+EXIF 底栏）+分组筛选
- 瞬间时间线 / 关于（三轨版图+构建说明）
- sharp ^0.35.5 入依赖（Astro 7 不内置，astro:assets 缩略图管线前提）
- 裸 blockquote 默认吃 A 墨线样式（markdown 原生输出无类名的缝隙）
- 车道 30min 超时，产物完整，主会话补 sharp+断言脚本递归修正后收编
验证: pnpm astro build exit 0（7 页）；五路由产物断言过；
scripts/check-responsive.sh 11/11 ok（1120/820/760/560 全档）
Spec: 2026-10-24_add-blog-skeleton
Co-authored-by: GLM-5.3
36 lines
1.9 KiB
Bash
36 lines
1.9 KiB
Bash
#!/bin/sh
|
||
# 响应式结构自查（§4e）：四档断点 + 触屏 44px + 安全区 + dvh 的静态断言
|
||
# 依据：docs/博客重设计调研报告.md §4e；断点 1120/820/760/560
|
||
# 扫描用 -r 递归（src/pages 有子目录，一层 glob 会漏检 archives/gallery/moments）
|
||
set -e
|
||
cd "$(dirname "$0")/.."
|
||
fail=0
|
||
check() { if eval "$2"; then echo " ok $1"; else echo " FAIL $1"; fail=1; fi }
|
||
|
||
DIRS="src/styles src/components src/layouts src/pages"
|
||
|
||
check "断点 1120px（宽屏 TOC 常驻档）" \
|
||
"grep -rEq '(max|min)-width: ?1120px|@container' $DIRS"
|
||
check "断点 820px（笔电 TOC 收起档）" \
|
||
"grep -rEq '(max|min)-width: ?820px' $DIRS"
|
||
check "断点 760px（平板竖屏档）" \
|
||
"grep -rEq '(max|min)-width: ?760px' $DIRS"
|
||
check "断点 560px（手机档 + 正文降 18px）" \
|
||
"grep -rq 'max-width: 560px' src/styles/global.css"
|
||
check "移动端降档：--prose-size 到 18px" \
|
||
"grep -q 'prose-size-reading: 18px' src/styles/global.css"
|
||
check "触屏 44px 目标类（.tap）存在且被使用" \
|
||
"grep -rq 'class=\"tap' src/components src/layouts"
|
||
check "安全区 env(safe-area-inset-*) 使用" \
|
||
"grep -rq 'safe-area-inset' src/styles src/components src/layouts"
|
||
check "视口 viewport-fit=cover（刘海屏）" \
|
||
"grep -q 'viewport-fit=cover' src/layouts/BaseLayout.astro"
|
||
check "无 100vh 视口陷阱（属性值上下文；注释提及不算）" \
|
||
"! grep -rEq ':\\s*100vh|100vh\\s*[;)]' src/ --include='*.astro' --include='*.css' && ! grep -rEq 'height:\\s*100vh|min-height:\\s*100vh' src/"
|
||
check "动效总闸 prefers-reduced-motion" \
|
||
"grep -q 'prefers-reduced-motion: reduce' src/styles/global.css"
|
||
check "构建产物含 viewport-fit 与主题色 meta" \
|
||
"grep -q 'viewport-fit=cover' dist/index.html && grep -q 'theme-color' dist/index.html"
|
||
|
||
[ "$fail" = "0" ] && echo "responsive check: all ok" || { echo "responsive check: FAILURES above"; exit 1; }
|