给hexo Fuid主题博客添加Mac风格代码块
目前博客用的是Fuid主题,自带的代码块很丑,想着美化一下。
- 首先到
hexo-theme-fluid
主题根目录下source/css/
创建名为macpanel.styl
的文件并加入以下内容。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16.highlight
background: #21252b
border-radius: 5px
box-shadow: 0 10px 30px 0 rgba(0, 0, 0, .4)
padding-top: 30px
&::before
background: #fc625d
border-radius: 50%
box-shadow: 20px 0 #fdbc40, 40px 0 #35cd4b
content: ' '
height: 12px
left: 12px
margin-top: -20px
position: absolute
width: 12px- 首先到
到管理主题的
_config.yml
文件还是说_config.fluid.yml
文件(取决于你怎么调用主题)的配置文件中修改:1
2custom_css:
- /css/macpanel
重启博客即可看到效果啦~~如果代码块风格默认没有修改过的话可能会导致:代码块背景是白色的,而mac栏是黑色的,这时候就要去主题配置文件的_config.yml
文件(和第2步一样的文件)中修改代码块风格了。
以下是我的博客现在的风格,具体想主题风格可以上See里的连接去看看。
1 |
|
给hexo Fuid主题博客添加Mac风格代码块
http://example.com/2022/08/06/给hexo-Fuid主题添加Mac风格代码块/