爱意满满的作品展示区。
viosey

或许是 Hexo 最酷的 Material Design 主题

  viosey · Nov 12, 2016 · 14844 views
This topic created in 3648 days ago, the information mentioned may be changed or developed.

Why?

这个主题最初是为 typecho 而开发的 typecho-theme-material。 后来觉得 hexo 用起来更 geek ,便移植到 hexo 。 因为 hexo 开发有极大的自由度,这个主题也变得更加完善。

内置三种主题样式,三种 Markdown 样式(仍在逐渐增加); 无论是背景,各种组件颜色还是图标都可以轻松自定义; 集成多种独立页面和第三方服务。

从 极简风 到 多图流,都能完美驾驭。

More:

介绍及文档:

Material Theme

Github:

hexo-theme-material

Demo:

Paradox 样式

因未能提供全部样式的实时预览, Demo 使用的是 Paradox 样式。

快速体验

开始定制独一无二的主题:

git clone https://github.com/viosey/hexo-theme-material.git

或

npm install hexo-material

渲染:

Supplement 1  ·  Nov 12, 2016

关于 FAB 的争议较多,于是更新了 1.0.1 版本,更改如下:

  • 可对 FAB 进行开关
  • 可自定义 FAB 按钮图案,参考 Material icons
  • 关闭 FAB 点击旋转效果
Supplement 2  ·  Nov 12, 2016

新增 Isolation 样式实时预览

同时求个友情链接,这是 我的博客

Supplement 3  ·  Nov 13, 2016

加一张 Paradox 样式的黄金比例图

Paradox Golden Ratio

95 replies  •  2017-01-07 21:14:48 +08:00
huangjxh
huangjxh
Nov 12, 2016
1
手机状态下,文章预览图缩放有点问题。
phoenixlzx
phoenixlzx
Nov 12, 2016
2
挺好的,加油
xinpure
xinpure
Nov 12, 2016 via iPhone
3
赞一个
Famio
Famio
Nov 12, 2016
4
赞,支持一下
k9982874
k9982874
Nov 12, 2016 via iPad
5
已收 感谢楼主
muziki
muziki
Nov 12, 2016 via iPhone
6
好漂亮⊙▽⊙
wellsc
wellsc
Nov 12, 2016 via Android
7
貌似用了 material lie
itfanr
itfanr
Nov 12, 2016 via Android
8
很漂亮
iCyMind
iCyMind
Nov 12, 2016 via Android
9
很漂亮,赞一个。但是那个浮着急的加号让人有点困惑
Return2legacy
Return2legacy
Nov 12, 2016 via Android
10
加号换成其它图标会好点,最简单的就是三个点,或者三横线。绘个定制的也不错。
ivmm
ivmm
Nov 12, 2016
11
HEXO 终于有新的好看皮了, 终于不用再看 NEXT 了
kmahyyg
kmahyyg
Nov 12, 2016 via Android
12
字体换下……略难看……
可以试试 ustc 的 googlefonts 反带
mianju
mianju
Nov 12, 2016
13
代码高亮再弄好看点就好了> <
viosey
viosey
OP
Nov 12, 2016 via Android
14
@iCyMind
@Return2legacy
那个是参考的 material design 的 fab 设计,用于页面的滚动和翻页。
比如知乎的安卓客户端也使用了这个设计 : )
viosey
viosey
OP
Nov 12, 2016 via Android
15
@kmahyyg
字体默认使用的是 Google 标准的 Roboto 字体,不过主题的字体也是可以自定义的哦。

可以手动添加字体源或是 font-face 调用喜欢的字体
viosey
viosey
OP
Nov 12, 2016 via Android
16
@mianju 嗯嗯,这个功能在 to do 之中
83f420984
83f420984
Nov 12, 2016
17
Safari 下,这个主题用双指前进后退无效是什么情况?
cxyfreedom
cxyfreedom
Nov 12, 2016
18
上次回复希望 LZ 在 hexo 加上这个主题,现在终于完成了,辛苦了
viosey
viosey
OP
Nov 12, 2016 via Android
19
@cxyfreedom
:D 抱歉跳票了这么久~
iCyMind
iCyMind
Nov 12, 2016
20
@viosey 加号第一感觉是"新建文章"或者"新建评论"的功能, 因为大部分 app 中都是这样, 包括知乎.
当然, 纯粹个人观点
viosey
viosey
OP
Nov 12, 2016 via Android
21
@iCyMind 噢噢,那有什么比较好的建议吗?
lany
lany
Nov 12, 2016
22
@viosey 收下了
korvin
korvin
Nov 12, 2016
23
start 一个,又一个好看的主题
will0404
will0404
Nov 12, 2016 via iPhone
24
漂亮 虽然还是喜欢更简洁一点的
1OF7G
1OF7G
Nov 12, 2016
25
触控板双指滑动页面难受的不行,因为自带的平滑滚动导致的
akring
akring
Nov 12, 2016
26
好顶赞,资瓷一个
Cabana
Cabana
Nov 12, 2016 via Android
27
哈哈,帮顶一个,在 typecho 上用过,还记得提过一个 sqlite 的 issue
viosey
viosey
OP
Nov 12, 2016
28
@1OF7G 该功能是可选的,也可以关闭。
viosey
viosey
OP
Nov 12, 2016
29
@will0404 主题内置有一个分支样式更加的简洁
journey
journey
Nov 12, 2016
30
很漂亮,赞一个
kmahyyg
kmahyyg
Nov 12, 2016 via Android
31
那个+号的悬浮好反人类,建议弄成新建或者把+换成滚动之类的图标……

本来说今天试试的,但是强迫症,不换图标不试了……
iFlicker
iFlicker
Nov 12, 2016
32
已经 star
启用以后 包括在保存设置的时候
提示 500 Database Query Error
怎么回事 0.0
designer
designer
Nov 12, 2016 via iPhone
33
很棒的主题!
taozle
taozle
Nov 12, 2016
34
哇,终于等到了!
kaedea
kaedea
Nov 12, 2016
35
很不错的主题,如果能加上 TOC 就完美了。
cielpy
cielpy
Nov 12, 2016
36
已经用上,无脑抛链接: https://imciel.com/

提了两个 issue : https://github.com/viosey/hexo-theme-material/issues
ansheng
ansheng
Nov 12, 2016
37
果断用了,这么好的主题。
inoris
inoris
Nov 12, 2016
38
@viosey FAB 用于最主要的操作,如果是一个创作内容的环境(比如博客后台),放一个带加号的 FAB 很合适;然而博客前台的主要操作是点进一篇文章查看,因此不需要 FAB 。
viosey
viosey
OP
Nov 12, 2016
39
@inoris 那么对于页面的滚动和翻译是否有比较好的建议,因为「至顶」「至底」还是比较有必要的吧?
viosey
viosey
OP
Nov 12, 2016
40
@kaedea 已加入 To Do
bidu
bidu
Nov 12, 2016
41
很棒啊 支持一下
scnace
scnace
Nov 12, 2016 via Android
42
hexo 党强势 mark
viosey
viosey
OP
Nov 12, 2016
43
@kmahyyg
@inoris

针对 FAB 的问题,马上更新了 1.0.1 版本,更改如下:
- 可对 FAB 进行开关
- 可自定义 FAB 按钮图案,参考 Material icons
- 关闭 FAB 点击旋转效果
inoris
inoris
Nov 12, 2016
44
@viosey 我个人是用键盘快捷键, Material Design Guidelines 里也没有类似的场景,所以只能由你发挥了。

MDL 的模板里的做法是在 footer 里放一个 back to top ,你可以参考一下: https://getmdl.io/templates/android-dot-com/index.html
AlwaysBee
AlwaysBee
Nov 12, 2016
45
不错呀
auhah
auhah
Nov 12, 2016
46
赞!真的很棒

已 star
40huo
40huo
Nov 12, 2016
47
赞,超级棒!
Dvel
Dvel
Nov 12, 2016
48
厉害了我的哥! 激起了我弄博客的欲望
timothyye
timothyye
Nov 12, 2016
49
不错,支持一个
zhangneww
zhangneww
Nov 12, 2016
50
支持一下,很好看
bytewalk
bytewalk
Nov 12, 2016 via Android
51
很漂亮,有木有 wp 同款主题啊😃
viosey
viosey
OP
Nov 12, 2016
52
@poorcai Sorry~ 目前只有 hexo 和 typecho 呢
yangpai
yangpai
Nov 12, 2016
53
air 下感觉下拉反应有点缓慢, 跟随不是很及时的赶脚^o^ 那个 demo
viosey
viosey
OP
Nov 12, 2016 via Android❤️1
54
@yangpai 因为用了平滑滚动的 js 效果,这个效果是可以开关的,用鼠标体验会不错
yangpai
yangpai
Nov 12, 2016
55
@viosey air 下还是没有这个效果,体验更好,跟手^o^
yangpai
yangpai
Nov 12, 2016
56
@viosey 而且这个特效感觉有点颤抖^ _ ^
MinonHeart
MinonHeart
Nov 12, 2016 via iPhone
57
这个图是怎么做的?
rootliang
rootliang
Nov 12, 2016 via iPhone
58
厦门大触
HiJony
HiJony
Nov 12, 2016
59
标题违反广告法了。。
viosey
viosey
OP
Nov 12, 2016
60
@MinonHeart 用 ps 搞的
viosey
viosey
OP
Nov 12, 2016
61
@HiJony 😂 不要在意这些细节
CloudnuY
CloudnuY
Nov 12, 2016
62
自带的平滑滚动把触控板双指返回给捕捉了,无法使用系统级的双指返回……
viosey
viosey
OP
Nov 12, 2016
63
@83f420984

62 楼解释:
>自带的平滑滚动把触控板双指返回给捕捉了,无法使用系统级的双指返回……

@CloudnuY
开启平滑滚动效果确实是一个较难平衡的东西
meunicorn
meunicorn
Nov 12, 2016
64
cool !!!
suntoryliqu
suntoryliqu
Nov 12, 2016
65
好人一生平安!
kaedea
kaedea
Nov 13, 2016
66
https://blog.viosey.com/gallery/
可否随着分享相册模板~
viosey
viosey
OP
Nov 13, 2016
67
@kaedea 都是开源的
ifoolish
ifoolish
Nov 13, 2016 via iPhone
68
好看。好想 Python 的 Pelican 也有一个😂
basefas
basefas
Nov 13, 2016 via iPhone❤️1
69
首先要肯定,楼主做的蛮不错的,但是你这根本不是 MD ,如果想做 MD 风格的建议去把文档再好好看看
viosey
viosey
OP
Nov 13, 2016
70
@basefas 还有一个纯粹的 MD 的分支样式正在开发中
viosey
viosey
OP
Nov 13, 2016
71
@basefas
你可以看一下分支主题样式的命名就懂了:
- Nexus (联系,关系)
- Paradox (矛盾)
- Isolation (隔离,孤立)

完全 MD 化不就是那个样子嘛(滑稽
在 Android 开发上才要求更高的标准,至于 Web ,自由发挥一下不好吗

BTW , Paradox 的样式也是由官方 MD 模板改进而来的。
basefas
basefas
Nov 13, 2016 via iPhone
72
@viosey 我理解的 MD 首先强调的是一切操作的过渡自然,是为用户考虑的,而不是强行加一些动画和特效。同时也对你的行动表示肯定,期待做的越来越好。
viosey
viosey
OP
Nov 13, 2016
73
@basefas
十分谢谢你的指点~
主题所有的特效已加开关功能。
harvest
harvest
Nov 13, 2016
74
进入这里的第一个收藏送你了。
viosey
viosey
OP
Nov 13, 2016
75
@harvest thx~
mauve
mauve
Nov 13, 2016
76
主页顶部的头像图片与右边的 Viosey's Blog 有点不对劲,没有达到信息瞬间接收率最大化,我觉得可以稍微往山移一下,或者是做成扁一点的,第一次进博客看到这个有点不知所云
viosey
viosey
OP
Nov 13, 2016
77
@mauve 谢谢你的建议,顶部的两个模块我会进行调整,包括移动端。
Showfom
Showfom
PRO
Nov 13, 2016
78
这主题不错,支持下
run2
run2
Nov 13, 2016
79
确实 cool 但 gpl 的 纯支持了-。-
run2
run2
Nov 13, 2016
80
lz, 你协议里写的 AGPL
README 里写的 GPL
viosey
viosey
OP
Nov 13, 2016
81
@sobigfish 啊哦_(:з」∠)_,谢谢提醒。
Github 初始化的时候协议没弄好,现在已更改。
ilotuo
ilotuo
Nov 13, 2016
82
个人网站那个背景太帅了!
但是完没两下温度飙到 90 度..
loser
loser
Nov 14, 2016
83
可以可以,准备用上,谢谢分享!
kaedea
kaedea
Nov 15, 2016
84
viosey
viosey
OP
Nov 16, 2016
85
@kaedea 请问网站名、头像和一句话介绍是什么呢?
kaedea
kaedea
Nov 16, 2016
86
@viosey
http://kaedea.com/ 中二病也要开发 Android
2333333
wubotao
wubotao
Nov 16, 2016
87
不错不错~
viosey
viosey
OP
Nov 16, 2016
88
@kaedea 有点长诶,感觉
kaedea
kaedea
Nov 16, 2016
89
@viosey 去掉 233333
2333333
viosey
viosey
OP
Nov 16, 2016
90
"中二病也要开发 Android" 长度还是溢出了 _(:з」∠)_
cdell
cdell
Nov 18, 2016
91
很棒~
thomas070
thomas070
Nov 21, 2016
92
很棒的主题,支持楼主一发
cenxun
cenxun
Nov 23, 2016
93
cool
alihanniba
alihanniba
Nov 23, 2016
94
赞,请问有 sketch 原型吗?
zhaoy875
zhaoy875
Jan 7, 2017
95
hexo 群友路过留爪
About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Privacy   ·   Solana   ·   536 Online   Highest 6679   ·     Select Language
创意工作者们的社区
World is powered by solitude
VERSION: 3.9.8.5 · 138ms · UTC 20:12 · PVG 04:12 · LAX 12:12 · JFK 15:12
♥ Do have faith in what you're doing.