kuizuo / blog

A Blog on Customizing Docusaurus
https://kuizuo.cn
MIT License
283 stars 157 forks source link

发现了一个bug 英文模式下的首页导航栏不会透明背景色 #321

Open lianlianlianlianlianlian opened 1 week ago

lianlianlianlianlianlian commented 1 week ago

我很喜欢默认首页的导航栏背景色透明 有个背景色感觉怪怪的 但是其他页面有背景色又很舒服 往下移动后再往上不会影响其他内容 但我发现开启英文模式后 首页的导航栏并不会透明 不知道是哪里的问题 只知道决定首页透明背景的是这个参数 blog/src/theme/Navbar/Layout/index.tsx isHomePage && 'bg-transparent', 删掉 默认中文也有了背景色

已经尝试过了删掉全局css的导航栏背景色 但依旧不生效。。。见鬼了都 但在全局css里修改背景色又是立马生效的 英文模式下 要么全部页面的导航栏都透明 要么就都只能白色黑色背景 就是不能像默认语言一样 只有首页透明 不知道大佬是否能够解决这个bug 我折腾了很久 解决不了

kuizuo commented 1 week ago

默认首页导航栏的 CSS 是经过魔改的,在首页的时候背景设置透明,而其他页面为了阅读性则保持原样,你可以将以下代码注释掉,这样主页也将恢复成默认的导航栏 https://github.com/kuizuo/blog/blob/248b2a86a16c61a7a9f65cfb786e31974170b32b/src/theme/Navbar/Layout/index.tsx#L37

而由于英文模式下,由于页面的导航(pathname)此时为/en/ 而非 / ,因此语句 const isHomePage = location.pathname === '/' 中的变量isHomePage 为 false就导致英文模式下样式丢失。

如果你需要在英文模式下也保持和中文模式原样的话,可以更改为以下代码,最新 commit 中已修复https://github.com/kuizuo/blog/commit/529dce6247a79707bfbf918eb41decb1575b6207

const isHomePage = location.pathname === '/' || location.pathname === '/en/'

如果你需要所有页面的导航栏都保持透明背景,则可以将代码更改为

const isHomePage = location.pathname === '/' || location.pathname === '/en/'

最近心思不在代码上,回复有些慢,还请见谅

lianlianlianlianlianlian commented 1 week ago

感谢回复!已经修复 听了解释也明白了问题点 魔改就是会遇到这样的未知问题 但我觉得改得很棒!想法也是跟我如出一辙 只是我不是专业的 全凭个人爱好自学 遇到了问题只能问gpt 没想到这个问题他也解决不了 而我只排查到问题点在这里 就是不知道怎么解决 所以只能来麻烦改动轮子的原作者 哈哈 麻烦你啦