hexo-theme-indigo 是 Material Design 风格的Hexo主题,基于 Hexo 3.0+ 制作。

hexo-theme-indigo

菜单icon运用

indigo 主题用的是 Awesome Icons

Awesome Icons
fontawesome 4.70 名称查看(新版本图标不可用)

改造

Hexo主题配置与优化(二)

修改标签显示的标题 \themes\indigo\layout\_partial\head.ejs

1
<title><% if (title){ %><%= title %> | <% } %><%= config.title %><% if (config.subtitle){ %> | <%= config.subtitle %><% } %></title>

我改这样
1
<title><% if (title){ %><%= title %> | <% } %><%= config.title %></title>

修改dark \themes\indigo\layout\_partial\head.ejs

修改配色 \source\css\_partial\variable.less

primaryColor: 主色调
darkPrimaryColor: dark主色调
lightPrimary: 副标题颜色
headerH: 头高度
accentColor:重点颜色(洋红色)

修改头像大小描边 \source\css\_partial\layout.less

border: 描边的粗细
border-radius: 描边半径(这里不是半径的意思0%-49%圆角 %50%-100%是圆)

.avatar

padding: 头像背景的高度
background: (头像后面的背景颜色,不透明度)

.brand

修改自定义页面 \themes\indigo\source\css\_partial\page.less

border-bottom: 最底下的分割线
img: 改了img的width和height为空就可以解决图片拉伸问题

padding: 10px; 最外边距
.card(3px); 卡片圆角

.page-article

figure {
padding: 20px!important;
} 图相框的边距

.page-content

content