CHANGELOG
关于博客的设计见 我的博客设计。
- 降低部分图片在暗色主题下的亮度，避免过于刺眼。
- 调整搜索页面，匹配关键字的样式，参考了 Vanilla CSS is all you need。
- 添加 code-highlighted.js，用于高亮特定的代码行。
<details>本身是一些次要信息，在不展开的时候降低透明度，让正文更突出，避免喧宾夺主。
- ヾ(´∀ ˋ)ﾉ 代码块的颜色也会基于亮色/暗色主题变化（见 让博客的代码高亮适配主题）。
- 添加 toc.js，在屏幕足够大的时候，将 TOC (Table Of Content) 固定在文章左侧，方便导航。
- 重复的脚注 littlefoot 展示得不对，例如重复的
[fn:1]，第二个会变成序号 2。考虑到使用 littlefoot 后，序号对于读者来说不太重要，将序号变成了*。这会导致 littlefoot 的脚注会更不明显，一方面减少脚注对读者的干扰（见 关于 "Give footnotes the boot" 的思考），一方面也是提醒自己注意脚注的使用。
- 增加一个春节彩蛋，见 博客春节彩蛋：贴春联。
- 首页添加一些页面的快捷入口。我觉得我给 Emoji 做的动画很有趣 (｡•̀ᴗ-)✧
使用 Bridgy Fed 将博客桥接到 Bluesky 和 Fediverse ，或许能接受来自它们的相关回复。尝试了一下，感觉不太好用，数据同步太慢了，我其实就是羡慕别人可以通过 Fediverse 收到回复，可是我真的需要吗？这要求读者有 Fediverse 账号，也是一种门槛。而且评论这个事情，也和 移除博客的留言 的初衷相悖，所以还是算了吧 ┐(￣ヘ￣)┌
- 更新博客字体，「I.Ming」用于正文，「LXGW WenKai」作为次要字体用于 quote、verse。主要原因还是因为「LXGW WenKai」的粗细区分太不明显了。
<code>的样式更新，使用类似 Emacs Modus Themes 的关键字颜色，移除背景色，感觉好看一些。- 增加
<dd>和<dt>的间距，使得彼此之间更容易区分。
- 移除链接的过渡效果。存在过渡时，背景色会先变成链接的颜色，再变成
:visited的颜色，看起来有点怪，暂时没找到原因，先移除。 - 添加一些冬天/圣诞节的装饰主题。
- 更新了 Album Wall 的样式。（参考 how did I make the music page）
- 修复一个 webmention 的拉取问题。（见 给博客添加 Webmention::webmention.io 的 target 需要完全匹配）
- 优化外部链接的图标（参考了 MDN 的实现）
- 新增两个主题，看起来有点像素风的感觉。（参考了 seated.ro）
- 优化代码块复制按钮的样式。
- 优化 a11y-nav 的样式。（参考了 Stefan Judis 的博客）
- 又收集了一些 88x31 buttons。
- 优化链接样式，外部链接添加
↗标记，内外部链接下划线样式统一用实线。 - 更新 订阅 页面。（见：XSLT 将要被废弃、更新订阅页面）
- 移除 Snippet 订阅流，感觉这个分类没啥必要，范围不太清晰。
- 使 littlefoot 样式和默认脚注样式相近，降低它对正文阅读的干扰。
- 基于 关于 "Give footnotes the boot" 的思考，调整博客中脚注的使用。
- 新增注释块 (note section) 样式。
- sidenote 使用 <aside> 和 ARIA: note role 实现，提供更好的语义。
新增 Snippet 订阅流。- 优化 example 的样式。
- 新增了 好きなアニメ 页面。
- 扩大 sidenote 的悬浮区域，设置更明显的悬浮样式，让读者更容易识别 sidenote 和正文中数字的关联位置。
- 搜索页面增加 Kagi 和 Google 的搜索链接，当读者不开启 JS 的时候，也给他提供搜索的办法。（借鉴了 Sacha Chua 的搜索页面）
- 一些 hover 效果在手机上并不好，显得干扰阅读，通过
@media (pointer: fine) and (hover: hover)控制只在有鼠标等精细指针时才启用 hover 效果。 - 新增 Album Wall 页面。
- 给一些特定域名的链接增加了图标，悬浮在链接上的时候会看到。
- 悬浮在链接时设置背景色，使其更明显地表达悬浮状态。
- 降低 sidenote 透明度，避免喧宾夺主，悬浮上去时再还原透明度。
- 调整 heading 的间距，使得 heading 之间的内容容易区分开，一个 heading 的内容更像一个整体。
- 新增 heading-enhanced.js，使得点击 heading 前面的伪类可以定位到此 heading，方便引用。
- 更新 summary 的 icons，使用手指 ☞ 和 ☟，不过 Safari 目前还不支持。
- 移除 org export 的默认样式，优化 footnotes 的样式使其支持段落的换行，统一都使用 CSS logical properties and values。
- 新增了一些字体，Schoolbell 用于可爱的歌词；I.Ming 用于中文歌词。
- 优化了 Webmentions 的排版，将用户网站地址整合到用户昵称里，将引用的链接原样呈现，便于读者区分。
- 作者边上增加了一个发邮件的提示，明显的提示或许能引导读者发邮件。
- 搜索页面 增加了 pagefind 的 credit，感谢 pagefind 提供的简单好用的服务。
- 搜索页面增加了搜索帮助，顺便了解了一下 popover 的使用。
- 导航的「黑洞里」移动到最后，设置了非常低的透明度。毕竟是黑洞嘛，看不见才正常 (≖ᴗ≖๑)
- 设置链接 :visited 颜色，方便读者区分博客中访问过的链接。颜色用了 favicon 里的颜色，稍微调整了一些对比度使其能看清。
- 延长 view-transition 的动画速度，让主题切换、页面切换之间的过渡给人感觉柔和一些。
- 优化打印时的样式。
- heading 前增加元素，区分 heading 和内容，但是为了不影响阅读，颜色很浅。
- 使用 subtitle 显示副标题。
- 把首页的样式做成了目录的样式，目录的实现见：Zine#14::Responsive TOC leader lines with CSS，感觉还蛮有趣的。
- 移除 image-enhanced.js，使用
<a>标签包裹图片，从而实现放大图片，减少一个 JS 的维护，读者禁用 JS 时也依然能放大图片。 - 增加引用 (blockquote) 之间的间距，避免贴的太近，看起来像是同一个引用。
- 移除
::target的样式，原来使用的波浪线，感觉不够明显，还是使用浏览器默认的样式吧。 - 下划线样式改为不是那么明显的波浪线，下划线主要用于标记一些文字，太明显了，可能会导致读者只关注这部分文字。
- 添加了 404 页面
- 通过下划线的样式，简单区分内部链接和外部链接
- 将博客文件迁移到用 denote 管理，见 结合 denote 和 org-publish 写博客。
- 搜索页面：修复自动 dark mode 下的样式、增加 backtop、避免横向滚动条。
- 移除了页脚「查看 org 文件的链接」，因为用 denote 管理后，实际文件名和 URL 对不上了，暂时不想维护。
- 图片样式还原成默认样式，不居中，因为有的图片比较小，居中不好看，就需要额外写样式，嫌麻烦。
- 补充了所有文章的 description，这样分享的时候能看到一些描述。
- 新增了基于 tag 生成 Atom feed 的功能，格式是
{tag}.xml，目前生成了 Zine 和 Emacs 的。
- 移除了 Atkinson 英文字体，都使用落霞孤鹜字体，使得整体更和谐。但缺点是，可能部分英文字母不容易区分。
调整了部分手机上的样式，例如 list，details 等，让它们尽可能利用屏幕空间，不要留太多的间距，不然每行内容太少，换行太多。
如果在手机上你还是觉得字体太大，你可以通过浏览器调整页面的字体大小，这样就能看到更多啦。
- 调整页脚，增加了用于分割页脚的文字，增加了查看 org 文件的链接。
如果你看到有错误，也可以 fork 帮我修改，嘿嘿。
- 调整了一下 littlefoot 的样式，使它看起来像是一个 footnote。
- 移除 giscus 评论，see also：移除博客的留言。
- 手机上的字体再增大了一点，最小字号是 22px。
- 增加了「返回顶部」的功能。见 backtop.js。
- 解决 giscus 的主题异常问题，通过动态加载 giscus，确保在 light / dark mode 下都能渲染正确的主题。
- 顺手更新了 给博客添加 dark mode。
- 让 sidenote 分布在文章的两边，充分利用两边的空间，而不是都放在一边，显得不均匀。
- 增大 pagefind 的 Excerpt length，便于看到关键字附近更多的内容，更好的找到想要找的内容。
- 调整 pagefind 的 border 颜色，使其更明显一些。
- 调整 search 和 rss 页面的字体，保持统一。
- 文章中尝试用是
<hr>去分割段落，同时给<hr>添加了一些样式。
- 重新添加 霞鹜文楷 字体，粗体现在似乎看起来对比度还可以；字体放到网站的静态资源中托管；一定程度上提高文字的耐看度。
- 添加背景图，内容过多的时候，纯色背景有些单调，使得页面看起来有些枯燥，设置背景使得页面相对耐看一些。
- 现在是一张叶子的背景图，倒是挺像落羽杉的
- figcaption 只有一行的时候居中，好看一些，但对于一些小图片不太合适，需要手动修改样式，有点麻烦。
- 页脚添加了 support me，support me 页面添加了支付宝收款码。
- 调整 list 的样式，避免部分 list item 出现额外的 margin-block。
- 在宽度大于 768px 的设备上，点击图片，在新 tab 展示，可以进一步放大查看。见 image-enhanced.js。
- 调整 dark-mode 下的颜色，让对比相对柔和一点。
- 将 giscus 切换成中文。
- 将 giscus 的字体变大，保持和正文相近的大小，看起来轻松一点。
- 主题为 auto 的时候，使用 high-constact 的主题，也是为了提高可读性。
- 集成 littlefoot，最开始是在 極客死亡計劃 看到的，感觉交互不错，现在我也集成了，当屏幕比较小的时候会用 littlefoot，屏幕大的时候会现实 sitenote。
- 稍微扩大导航的点击范围。
- 调整 TODO 关键字的颜色，原来的红色比较刺眼，换成一个相对柔和的红色。
- 修复暗黑模式下，pre 元素的背景色异常。
- 使得 Atom feed 符合规范，see: 验证你的 RSS/Atom feed 是否有效。
调整内容宽度 (1024px -> 900px)，使得每一行不会太长。
当文本行足够短 使眼睛无需移动头部即可扫视，同时又足够长确保眼睛不会过于频繁地换行时，文本块的可读性最佳。
The Realities And Myths Of Contrast And Color by Andrew Somers
调整文字的颜色，符合 APCA 定义的 Lc90。
代码块添加了复制按钮，便于复制代码。
推荐阅读 How to build a copy code snippet button and why it matters
- 代码块支持自动滚动，当鼠标移动到左右边缘时会自动滚动，忘了在哪个博客看到的，感觉对读者比较友好。
移除 霞鹜文楷 字体，使用默认中文字体，因为霞鹜文楷的粗体太不明显了。
虽然霞鹜文楷是有粗体的，但正如 The Easy Intro to the APCA Contrast Method 里面说的，对比是靠周围的内容衬托出来的。霞鹜文楷的粗体和普通字体之间的差别太小了，很难看出来加粗。
- preload Atkinson Hyperlegible 字体，并设置字体缓存。
- 添加了 SideNote，借鉴了 Sacha Chua 的实现，相关 JS 见：sidenote.js。
- 美化了 Atom feed，see: 让你的 RSS/Atom feed 更好看。
- RSS feed 切换到 Atom feed，see: 博客的一些更新。
- 迁移到 org-publish，see: 使用 org-publish 发布博客。
- 迁移到 Hugo，使用的主题是 hugo-theme-even。
- 创建了博客，最开始是 VuePress 搭建的。
