时隔很久很久...

MEGO是我第一款为Halo写的主题，那时刚刚学完HTML+CSS（甚至连JS都还没学完），最近着手对MEGO主题进行了全面的改版与升级，使用Tailwind框架，对多端的响应式有了更好的适配。

一、HERO展示板块

在查看原始预览时，发现布局杂乱不堪且缺少主次关系，过多的配色让人眼花缭乱，过多的圆角让整个主题丑陋无比，让人都不想用，请看下图！

原主题展示板块

针对以上的问题，我们需要大刀阔斧让一切变得简洁，菜单栏使用三栏布局，左侧站点信息与简介，中间菜单信息，右侧主题配色的切换。Hero的背景均可自定义（我尝试过用API更换背景，每一次刷新都是新的也很炫酷）。

• 在白天模式下，Hero板块下的全局背景会有阴影，以便提升视觉观感。

新主题展示板块-暗黑

• 在暗黑模式下，Hero的全局背景将变得更加轻薄，以适应夜晚模式下对配色的对比。

新主题展示板块-暗黑

二、移动端菜单布局

在原始版本中，是通过向下展开的方式展开菜单，动画惨绝人寰让人不忍直视。每一次点击展开的时候会使界面有卡顿，且依然无主题模式切换，我们需要对他进行改革。

原主题移动端菜单

在新版中，我们依然对Header使用双栏布局，右侧是站点信息，左侧是主题模式切换以及菜单按钮，在右侧菜单的下部分空白区域，我正在构思是否新的方案。

• 移动端添加滑入滑出的动画，并对展开的菜单时的页面背景设置了蒙版，从而让菜单更加醒目。

三、站点信息

在原始版本中，菜单导航是以三个部分（头像、站点数据以及联系方式）集成在卡片的中显示的，在使用时你会发现当访问量过于强大时会导致样式产生分裂，我们需要对它进行调整。

• 在新版本中，站点信息以单独的形式展现，除了网站浏览量，文章发布数，剩下两项均可自定义。

• 站点信息上方集成了简单摘要，用于网站的介绍或者作者说....

• 

四、博客展示

在原始版本中，卡片式的博客布局很实用但太丑了，配上了奇丑无比的背景（实话讲当时觉得很酷）、过多的圆角会使得有很大的割裂感。

• 在新版本中对博文显示进行了调整，依然采用了卡片是布局，将文章的图片置底作为背景，文字信息叠加在图片之上；使用渐变遮罩层提高文字的展示程度，将分类信息置于卡片左上角更醒目。

五、侧边聚合

在原始版本中，侧边栏承载站点信息、热门文章、分类归档和标签归档、上文中我们将站点信息移除，当然在新版本中我依然要改进。至于为什么标签归档没有显示，可能是当时版本太古早没有适配Halo 2.20，不显示了....

• 在新版本中将不在使用双栏布局，小卡片的以聚合形式展示展示在主界面，主题以集成Font Awesome 6 Free字体库，可以自定义风格。

• 在新版本中，我依然选择聚合标签的形式展示在主界面，当标签过多时则是以三行显示，如果标签过少则是一行显示。

• 网站的订阅功能很重要，鱼佬写了订阅插件终于派上用场，这里直接复用了TW的UI案例

未完待续....