人生如戏 何必认真

家庭

周五晚跟老婆商量好，这个周末要有松弛感，睡要睡到自然醒，不外出游玩，就留在家里陪孩子看看电视，玩一下棋牌。弟弟前阵子买了个《幸福人生》的代代棋，正好这两天可以陪孩子们玩一下。不过孩子们说我玩时玩得很别扭，都没有认真陪他们玩。这……，主要是我觉得这个代代棋玩起来有点幼稚。

弟弟以前玩五子棋挺厉害的，但最近不见他玩了，反倒是经常拿着 iPad 跟他姐姐一起看一些象棋教学。俩姐弟一边学一边下，据观察，他们象棋的基本规则是搞懂了，就是棋下得有点臭，但这一点也不妨碍他们快乐的下棋。

不过不知道是不是所有的兄弟姐妹都一样，上一秒还一起玩得很开心，下一秒就立马能打起来。为了一点鸡毛蒜皮的小事就又吼又打的，我也是服了。不过回想自己小时候好像跟妹妹也是差不多，经常打闹。

运动

从六月初开始，坚持锻炼已经 75 天啦。从开始跑 1 公里都喘得要死要活到顺利完成第一个 10 公里，那时我感觉自己强得可怕。为了控制好心率，我基本上都是控制在 7 - 8 分配的速度来跑。我也曾用过 5′30″ 的配速去跑五公里，但心率太高了，狗命要紧，以后还是乖乖慢跑安全点。通过这段时间的锻炼，我已经瘦了 10 斤有多。当然，要是再瘦个 10 斤就更好了。坚持！

代码

这两天心血来潮，想修改一下博客的样式。其实平时我都有将想修改的点做成一个 todo 列表，不过前段时间一直不想折腾，因此现在这个列表已经堆积了很多项。

太久没有折腾，所以这次我选择简单一点的修改，比如字体大小。

在 B 站上学习 CSS 时看到过一个设置字体大小的语法 —— clamp()，用法如下：

clamp(最小值, 首选值, 最大值)

• 最小值：字体不能小于这个值。
• 首选值：理想情况下使用这个值（通常是相对单位）。
• 最大值：字体不能大于这个值。

这次我的方案是将字体大小修改成：

html {
  font-size: clamp(13px, 2vw, 21px);
}

• 最小值设置成 13px，不管屏幕再小，字体不会比 13px 更小。
• 首选值设置成 2vw，使用视口宽度（viewport width）的 2% 作为字体大小。例如：视口宽度为 1200px 时，字体的大小为 24px；视口宽度为 500px 时，字体的大小为 10px。
• 最大值设置成 21px，不管屏幕再大，字体不会超过 21px。

这样子配置的好处，字体大小会根据屏幕宽度自适应，但不会小于 13px，也不会大于 21px。在这个范围内，它会随着屏幕宽度等比例缩放。这样就能保证字体在小屏设备上不会太小看不清，大屏设备上不会太大显得突兀。

本以为修改一下字体大小会很简单，不料为了做好适配，我却足足修改了 10 个文件，看来我以往对博客的代码处理得还是太过随意了。

然后就是 Artalk 评论中的字体大小，因为 Artalk/ui/artalk 中很多样式都是使用 px 这个单位来定义字体的大小，为了保持字体大小一致性，我选择直接从源头下手，拉取 Artalk 源码后直接修改，将 px 换算成 rem，然后重新打包并引用。

最后就是相册的瀑布流效果，原来是使用 CSS 样式中 columns 来简单实现瀑布流效果，在 Chrome 中测试没有任何问题，但后来主力浏览器换成 Safari 后发现相册中的瀑布流会出现闪烁现象，据说是跟它的分栏布局 + GPU 合成层方式有关。

太复杂，不去深究。既然简单的不行，那就使用别人做好的方案。在 Github 上找到一个项目，完美解决我的需求。

项目地址：https://github.com/OlivierEstevez/astro-masonry

最后

原本这次更新是打算记录一下生活近况，结果记着记着就跑偏了。罢了罢了，或者我们可以用 0 和 1 代表「状态的本质变化」—— 从「未发生 / 未突破」到「已发生 / 有突破」。况且跑偏就跑偏吧，生活本就没有绝对的 「正题」与 「偏题」，就像我们折腾时偶尔蹦出的意外思路，说不定也是另一种收获。

毕竟，天下事，无非是戏；世上人，何必认真。