分享一个 Material design 风格的 V2EX 自定义 CSS

[zdhxiong]

代码

@import url("//dn-startplay.qbox.me/v2ex-material-theme/v2ex.min.css");

github: https://github.com/zdhxiong/v2ex-material-theme

使用方法

登录后进设置，在自定义CSS处填入代码保存即可。

预览图

新版本：

新版本：@import url("//dn-startplay.qbox.me/v2ex-material-theme2/v2ex.min.css");

其实老早就做好了，但是兼容性不好，本来想解决兼容性再发出来，可实在解决不了。所以不支持 Firefox。

换了 cdn 域名：

v2ex material theme

@import url("//plays.b0.upaiyun.com/v2ex-material-theme/v2ex.min.css");

v2ex material theme2

@import url("//plays.b0.upaiyun.com/v2ex-material-theme2/v2ex.min.css");

之前的测试域名被又拍云停用了，现在换了新域名：

* V2EX material theme *

```
@import url("//play.cdn.w3cbus.com/v2ex-material-theme/v2ex.min.css");
```

* V2EX material theme2 *
```
@import url("//play.cdn.w3cbus.com/v2ex-material-theme2/v2ex.min.css");
```

[vzch]

我看到了 Inbox 的影子

[kokdemo]

右下角那些icon是写死的吗？

[zdhxiong]

@kokdemo 那些是收藏的节点，取了前6个

[xingo]

能不能告诉我为什么我点不到那个新主题的笔？。。。。。。。。。。一移动过去就收回去了。。。。。

[zdhxiong]

@xingo 你用的什么浏览器？我只在Chrome和Firefox测试过。

[xi4oh4o]

是的，无法点到新主题的笔 ：）

[xingo]

chrome 40 1366*768

[Jays]

Firefox 34 测试 新主题笔有问题

[ZhaoMiing]

好棒，不过右下角的新建笔确实有问题

[Jetso]

nice

[lingoys]

（好厉害，如果让我写我都不知道怎么实现。

[ZhaoMiing]

突然想到一个问题，这样 Livid 会不会不开心，赞助链接都没了啊 : (

[liangdi]

使用中 很不错 简洁

[zdhxiong]

@xingo
@xi4oh4o
@Jays
@ZhaoMiing
发贴按钮已修复。

[laincat]

试用去

[pubby]

不错，用几天看看

[max1525]

挺不错，点个赞

[ligyxy]

好看，已经用上了

[Unknwon]

不错！看起来新主题的笔需要高分辨率才能点到~

[MajestySolor]

已收藏，感谢楼主~

[JonyOang]

感觉不错 哈 有inbox的影子

[JonyOang]

不过如果能像inbox一样在当前页就可以浏览详细内容就更好了，不用来回跳转页面了

[teddy1004]

样子不错，要是按钮能有那种点击的特效就好啦

[cutehalo]

排行榜呢=。=

[zzutmebwd]

右边一栏整个没有了 这真的好么 放页尾也行啊 有时候会用到 并且广告没有了livid会不会不高兴 毕竟人家也是要生活的嘛

[zzutmebwd]

同时 靛蓝+黑色图标 看起来不太好 不过这也是没办法的事

[DearTanker]

赞，这个屌。现在貌似还没有Material的WP主题，楼主可以试试~

[lucky4]

很漂亮
个人提一点小小的建议
顶部的搜索框是否可以变小，然后把上方的导航节点 技术，创意，好玩等放上去。

[loading]

Material design 没了动画，差很多啊。

[jkjoke]

赞，确实吊

[Tink]

略卡啊

[songweibiao]

要是有inbox的动态效果就更好了！可能我想多了，嘿嘿。谢啦！有才！

[Pete]

挺好看的

[Mihuwa]

试用了，感觉不错。

[pljhonglu]

感谢~很喜欢这个主题~
点击 『+』不管用。。。chrome 40.0.2214.111 (64-bit)

[7654]

稍微再窄一点点

[aliuwr]

Logo 图片可以用我反色过的版本:
https://dn-cz-misc.qbox.me/v2ex/[email protected]

[littlebena]

赞(≧▽≦)
求支持一下 mobile

[zdhxiong]

@Unknwon 笔已经修复了，不需要高分辨率

[vinthony]

@pljhonglu 估计是你没收藏过节点？

[zdhxiong]

@JonyOang 因为不能用js，在当前页浏览也就实现不了。

[zdhxiong]

@teddy1004
@loading
@songweibiao
那种按钮的动画效果貌似仅用CSS实现不了。

[vinthony]

试了一下 如果只有一个收藏结节 位置会出现在最上面 而不是+号之上

[zdhxiong]

@lucky4 banner上链接太多的话就不够简洁。

[zdhxiong]

@zzutmebwd
@ZhaoMiing
隐藏了广告确实会损害livid的利益，我会想想有没有合适的地方把广告显示出来。

[zdhxiong]

@zzutmebwd 图标是白色的呀，你怎么会是黑色的呢？

[zdhxiong]

@pljhonglu 那个+号确实没有作用的，鼠标移上去会浮现出发贴图标和收藏的节点。我之前试图把发贴图标放到 + 号上，可是做不到。

[laomutuo]

楼主好像很熟悉css啊:)

[laomutuo]

那个css是用less生成的么?

[zdhxiong]

@laomutuo 是用的less

[kokdemo]

@zdhxiong 感觉很给力啊！

我又有新灵感了……

[lisonfan]

i like it !
就是左上角的V2EX的LOGO颜色改成白色的会更好一些吧？

[lisonfan]

居中吧

[zdhxiong]

@aliuwr 感谢提供logo，已换上。

[zdhxiong]

@lisonfan logo已更换，之前的只是对原有黑色logo取了反色。

[XueSeason]

已经用上了，不过不知道如何更改背景图片。我这里显示的是蓝白色的马赛克。

[zdhxiong]

@XueSeason 这个背景应该是某些特殊节点的样式，不是我的主题加上去的。

[farseer2014]

好看，已用。

[Twinkle]

这个赞！

[jkjoke]

有个问题，我收藏的帖子去哪看？

[RichardQ]

顶栏求能自动隐藏

[xingo]

真不错，重度google患者感谢楼主！

[zdhxiong]

@jkjoke 现在没有收藏的帖子的链接，不过计划会把它放到banner里

[zdhxiong]

@RichardQ 因为顶栏的图标都是用fixed定位的，就不好自动隐藏了。

[Angdo]

用上了，大爱，就是高分屏总感觉两边空旷啊（PS.还不习惯）

[thinkdf]

右边栏咋被你阉割了

[zzutmebwd]

@zdhxiong Get 缓存没刷新

[donie]

不错哎～～～ 感谢

[herolee]

ID 和标题中间留白有点多，建议缩窄一点

[599316527]

看起來不錯

[fengxing]

上面的这一条太宽了，尤其是在低分辨率笔记本上看，要占据好大的屏幕位置

[zdhxiong]

@a540355686 感谢反馈，我会考虑用响应式来改变顶栏高度。

[kawaiiushio]

好看多了

[laoyang945]

请问如何找到收藏的主题

[tony1016]

这个真不赖

[zdhxiong]

@laoyang945 这个版本没有，下个版本会加上。

[laoyang945]

@zdhxiong 谢谢！那就只有等下个版本再用了，新年快乐！

[Heracles]

回复、发帖按钮的样式没改过来

[zdhxiong]

@Heracles 怎么没改，你看到的是怎么样的？

[Heracles]

@zdhxiong 哦 ，电脑上的chrome没问题，iPad的Safari就会有

[philobscur]

谢谢分享！
就是 Logo 在 retina 屏幕上有点糊糊的感觉

[lifesurge]

牛，点赞

[zdhxiong]

@philobscur 之前没考虑到retina屏，现在好了。

[foccy]

看起来很棒~

[smilingsun]

貌似不能responsive，求支持啊。
大爱楼主！

[zdhxiong]

@smilingsun 手机上自定义CSS不生效的，所以就不做响应式了。

[weicaizhi]

今天的搜索框莫名变短。。。

[zdhxiong]

@weicaizhi 屏幕宽度过小时，搜索框会变短

[bdnet]

已用上，待观察。

[yxzblue]

立马高大上了！！

[Stof]

用了这个 CSS 之后，右边的收藏节点也被隐藏了，内页也被隐藏了。。。

[zdhxiong]

@Stof 看附言里的新版本，可以显示节点。

[Stof]

@zdhxiong

Thanks

Firefox 路过。。。

[laincat]

不支持 Firefox 。。。。。好惨。。。。

[zdhxiong]

@laincat 就因为 firefox 不支持 -user-modify ，你可以用第一个版本，第一版是支持 firefox 的

[laincat]

@zdhxiong 第二版好用太多了。。。。 T-T

[xpsair]

赞。。。只是代码，撸主排版一下就好了。。。（逃）

[zdhxiong]

@xpsair 没压缩过的源码在 github 上有

[xpsair]

@zdhxiong
就是 https://github.com/zdhxiong/v2ex-material-theme/blob/master/v2ex.min.css 这个文件的格式。。。

[zdhxiong]

@xpsair 这是 less 源码： https://github.com/zdhxiong/v2ex-material-theme/blob/master/v2ex.less