写在前面
在 我的Handsome主题魔改记录 这篇文章里,我有提到过我的博客使用了一个仓库为Sanakey/KirinShiKi 的插件,是一个基于 handsome 主题的神代綺凜式魔改主题插件,最近折腾主题升级10.1版本时,看到此插件只适配到8.4.1版本,强行升级主题后,果然出现了样式异常,短期内等原作者适配大概不太现实,所以我就只能对比新旧主题版本的DOM结构,手动修改插件内的文件来适配最新的版本。
使用方式
若未安装此插件,前往Github下载KirinShiKi插件 按照仓库的介绍步骤安装并启用插件
打开KirinShiKi插件目录下的
/js/kirin.js文件,使用下面的代码完整的替换掉colorfulTags()函数// 彩色标签云
function colorfulTags() {
var tags = document.querySelectorAll("#tag_cloud a, #tag_cloud-post a");
var colorArr = ["#428BCA", "#AEDCAE", "#ECA9A7", "#DA99FF", "#FFB380", "#D9B999", "#3bca6e", "#f23232", "#834e75", "#23b7e5", "#f60"];
tags.forEach(tag => {
tagsColor = colorArr[Math.floor(Math.random() * colorArr.length)];
tag.style.backgroundColor = tagsColor;
tag.style.color = "white";
});
}顺手也在原项目留了一个issues,方便没看到这篇文章的插件用户使用。
主要修复的问题
1、首页文章标题不显示、不居中的问题
2、文章页的标签云文字被截断的问题。
3、文章卡片鼠标悬浮时文章信息无法显示
4、文章卡片内文章信息条背景白色的问题;
5、小头图文章卡片的布局和显示问题;
6、文章引用区域宽度不一致的问题;
7、鼠标经过侧栏时透明度变化的问题;
8、置顶导航模式下多出的 bottom 间距;
9、 去掉了原 CSS 内失效的随机动漫头图 API。