title: "Hugo 极简主题 Echo" date: 2021-04-06T12:33:00+08:00 tags: ["Hugo"] draft: false
去年年初的时候博客从 Octopress 迁移到 Hugo，那个时候找遍了很多 Hugo 主题都不满意，于是自己写了一个。
这就是 echo 主题的由来。最近又优化了一下这个主题，就顺便写篇文章给大家介绍一下这个主题，刚写出来的时候只在 V2EX 上分享过。
TailwindCSS 可以说是这两年比较火的 CSS 框架了，看腻了 Bootstrap 的样式，觉得 TailwindCSS 真漂亮，但是在使用上不同于 Bootstrap， TailwindCSS 给人的一种感觉是面向过程写代码，可以自己自由组装各种样式，缺点是学习门槛高一点。而且可能要写大量重复的代码。
这次采用 TailwindCSS 做为主题 CSS 框架，一是因为它样式好看，二是尝鲜，换思路写 CSS。
<!--more-->1.0 版本的 TailwindCSS 还不支持深色模式，现在最新版 2.0 了，所以我也就升级了，顺便支持了深色模式，为了支持深色模式，代码结构改动很多，不得不引入了一些其他工具（比如说 Nodejs、PostCSS 等），其实我很不愿意把一个主题项目搞得那么复杂，但是尝试了一番之后，最后发现不得不这样做。
这次加入深色模式，工作量比预期的要多，
我非常喜欢 Google 相册以及 Day One 的「那年今日」功能，所以这次我在「文章归档」中也实现了此功能，我认为此功能：
通过给文章添加「popular」标签，可以实现热门文章，在右侧和 404 页面都有展示热门文章列表。
在 SEO 上也做了很多优化，文章如果被分享到 Twitter/Facebook 上会有卡片效果。