Callout
- 接入 satteri-callouts(HAST 插件),用 Obsidian 语法:
> [!tip] 标题
> 内容
> [!warning]- 默认折叠
类型名大小写不敏感,支持嵌套、可折叠、标题内联 Markdown。
- 样式没有用它自带的主题 CSS(Obsidian 原版是高饱和蓝/青/紫,还靠
mix-blend-mode 叠底色,在暖纸底上会发脏),改为新建 src/styles/callouts.css,
复用主题已有的 --admonitions-color-* token,与 .admonition(免责声明块)
统一成「3px 左边框 + 彩色标题、无底色」。
- 类型映射:tip/hint→tip,note/info/todo/abstract/summary/tldr→note,
important/example→important,warning/attention/question/help/faq→warning,
caution→caution,success/check/done→(新增的)success,
danger/error/failure/fail/missing/bug→destructive,quote/cite→muted-foreground。
- global.css 补一个 --admonitions-color-success(浅色 oklch(0.62 0.16 150) /
深色 oklch(0.7 0.18 150)),与 tip(180)/note(250)/important(310) 同明度彩度。
脚注中文化
features.gfm.footnotes 设 label「脚注」、backLabel「返回第 {reference} 条」、
backContent「↑」,替换默认的 Footnotes / Back to reference。
正文
- 周末愉快.md:`::: tip 下周计划`(冒号后有空格,从来不是合法指令,
一直渲染成普通段落)改成 `> [!tip] 下周计划`,任务列表一并加 `>` 前缀。
- 关于价值感和归属感的思考.md 的 `> [!tip] Tip` 本来就合法,一行未改,
现在自动变成真 callout。
顺带修
autolink-headings 不再给脚注区那个 sr-only 的「脚注」标题加 # 锚点。
验证
- 两处 callout 均正确渲染;callout 内的图片仍带 data-lightbox-src
(说明 imageLightbox 与 satteriCallouts 的执行顺序没问题)。
- 临时加了一篇带脚注和折叠 callout 的文章验证:脚注文案、返回链接、
折叠态 <details>/<summary> 结构都正确,验证后已删除。
- 整页对比基线:37/41 一致,4 处差异中 2 处是本次有意的 callout 生效,
另 2 处是已知的智能标点引号方向(Sätteri 的结果更正确)。
- pnpm build 41 页 + pagefind 通过。
106 lines
3.4 KiB
JSON
106 lines
3.4 KiB
JSON
{
|
|
"name": "tianxuetao-blog",
|
|
"version": "0.1.0",
|
|
"private": true,
|
|
"type": "module",
|
|
"scripts": {
|
|
"dev": "astro dev",
|
|
"start": "astro dev",
|
|
"build": "node scripts/fetch-reading.mjs --soft && astro build && pagefind --site dist",
|
|
"preview": "astro preview",
|
|
"check": "astro check",
|
|
"new-post": "node scripts/new-post.mjs",
|
|
"new-thought": "node scripts/new-thought.mjs",
|
|
"reading": "node scripts/fetch-reading.mjs"
|
|
},
|
|
"dependencies": {
|
|
"@astrojs/markdown-satteri": "^0.4.1",
|
|
"@astrojs/mdx": "^8.0.1",
|
|
"@astrojs/react": "^6.0.6",
|
|
"@astrojs/rss": "^4.0.19",
|
|
"@astrojs/sitemap": "^3.7.4",
|
|
"@aws-sdk/client-s3": "^3.1037.0",
|
|
"@expressive-code/core": "^0.44.2",
|
|
"@expressive-code/plugin-collapsible-sections": "^0.44.2",
|
|
"@expressive-code/plugin-line-numbers": "^0.44.2",
|
|
"@hookform/resolvers": "^3.10.0",
|
|
"@radix-ui/react-accordion": "1.2.2",
|
|
"@radix-ui/react-alert-dialog": "1.1.4",
|
|
"@radix-ui/react-aspect-ratio": "1.1.1",
|
|
"@radix-ui/react-avatar": "1.1.2",
|
|
"@radix-ui/react-checkbox": "1.1.3",
|
|
"@radix-ui/react-collapsible": "1.1.2",
|
|
"@radix-ui/react-context-menu": "2.2.4",
|
|
"@radix-ui/react-dialog": "1.1.4",
|
|
"@radix-ui/react-dropdown-menu": "2.1.4",
|
|
"@radix-ui/react-hover-card": "1.1.4",
|
|
"@radix-ui/react-label": "2.1.1",
|
|
"@radix-ui/react-menubar": "1.1.4",
|
|
"@radix-ui/react-navigation-menu": "1.2.3",
|
|
"@radix-ui/react-popover": "1.1.4",
|
|
"@radix-ui/react-progress": "1.1.1",
|
|
"@radix-ui/react-radio-group": "1.2.2",
|
|
"@radix-ui/react-scroll-area": "1.2.2",
|
|
"@radix-ui/react-select": "2.1.4",
|
|
"@radix-ui/react-separator": "1.1.1",
|
|
"@radix-ui/react-slider": "1.2.2",
|
|
"@radix-ui/react-slot": "1.1.1",
|
|
"@radix-ui/react-switch": "1.1.2",
|
|
"@radix-ui/react-tabs": "1.1.2",
|
|
"@radix-ui/react-toast": "1.2.4",
|
|
"@radix-ui/react-toggle": "1.1.1",
|
|
"@radix-ui/react-toggle-group": "1.1.1",
|
|
"@radix-ui/react-tooltip": "1.1.6",
|
|
"@swup/astro": "^1.8.0",
|
|
"@tabler/icons-react": "^3.40.0",
|
|
"astro-expressive-code": "^0.44.2",
|
|
"autoprefixer": "^10.4.20",
|
|
"bcryptjs": "^3.0.2",
|
|
"class-variance-authority": "^0.7.1",
|
|
"clsx": "^2.1.1",
|
|
"cmdk": "1.0.4",
|
|
"crypto-js": "^4.2.0",
|
|
"date-fns": "4.1.0",
|
|
"embla-carousel-react": "8.5.1",
|
|
"gray-matter": "^4.0.3",
|
|
"input-otp": "1.4.1",
|
|
"katex": "^0.16.22",
|
|
"lucide-react": "^0.454.0",
|
|
"markdown-it": "^14.1.0",
|
|
"mdast-util-to-string": "^4.0.0",
|
|
"pagefind": "^1.4.0",
|
|
"react": "19.2.0",
|
|
"react-day-picker": "9.8.0",
|
|
"react-dom": "19.2.0",
|
|
"react-hook-form": "^7.60.0",
|
|
"react-resizable-panels": "^2.1.7",
|
|
"reading-time": "^1.5.0",
|
|
"recharts": "2.15.4",
|
|
"sanitize-html": "^2.17.0",
|
|
"satteri": "^0.10.5",
|
|
"satteri-callouts": "^1.0.1",
|
|
"satteri-katex": "^0.1.1",
|
|
"sonner": "^1.7.4",
|
|
"tailwind-merge": "^2.5.5",
|
|
"tailwindcss-animate": "^1.0.7",
|
|
"vaul": "^1.1.2",
|
|
"zod": "3.25.76"
|
|
},
|
|
"devDependencies": {
|
|
"@astrojs/check": "^0.9.6",
|
|
"@tailwindcss/postcss": "^4.1.9",
|
|
"@tailwindcss/typography": "^0.5.19",
|
|
"@types/crypto-js": "^4.2.2",
|
|
"@types/markdown-it": "^14.1.2",
|
|
"@types/node": "^22",
|
|
"@types/react": "^19",
|
|
"@types/react-dom": "^19",
|
|
"@types/sanitize-html": "^2.16.0",
|
|
"astro": "^7.3.3",
|
|
"postcss": "^8.5",
|
|
"tailwindcss": "^4.1.9",
|
|
"tw-animate-css": "1.3.3",
|
|
"typescript": "^5"
|
|
}
|
|
}
|