aaronly
V2EX  ›  PHP

分享寒假无聊撸出来的 Material Design 风格的博客系统

  •  1
     
  •   aaronly · Feb 18, 2016 · 7866 views
    This topic created in 3918 days ago, the information mentioned may be changed or developed.

    Materialize Blog

    github 地址

    demo 在这。

    首页是 collapsible 做的,类似 google 的 inbox , 另一个位置/posts 是普通的文章列表页面。

    用的前端框架是 materialize, 蛮好用的。

    更多说明请移步 github , 欢迎各位使用,刚刚撸完难免有一些 bug ,各位可以在回复中告诉我。

    另外,欢迎互加友链。

    35 replies  •  2016-02-23 18:52:09 +08:00
    phoenixlzx
    phoenixlzx
    Feb 18, 2016
    1
    Materialize 已 star
    aaronly
    aaronly
    OP
    Feb 18, 2016
    2
    @phoenixlzx materialize 确实不错

    实在用不下去 google 的 material design lite , mdl 前缀看着就难受(╯-_-)╯╧╧
    shallyy
    shallyy
    Feb 18, 2016
    3
    很棒啊
    hantsy
    hantsy
    Feb 18, 2016
    4
    效果不错。

    可惜我不懂前端,不然也可以把我 Sample 搞漂亮 一点。 https://github.com/hantsy/angularjs-springmvc-sample
    int64ago
    int64ago
    Feb 18, 2016
    5
    我的 https://get-link.xyz/ 也用了 Materialize

    不过我发现我开始不喜欢 MD 风格了,移动端还不错, PC 端感觉挺恶心的
    a4e9y47
    a4e9y47
    Feb 18, 2016
    6
    哈哈哈很棒!!! 能做个 hexo 的模板就好了博客已经折腾不动了> <
    aaronly
    aaronly
    OP
    Feb 18, 2016
    7
    @int64ago 毕竟最开始是做给 android 的,拿来给 web 用肯定没当初设计的好
    aaronly
    aaronly
    OP
    Feb 18, 2016
    8
    @a4e9y47 没做过 hexo 的模板,之前用的是 jekyll ,都是用别人写好的,这次难得动手自己写
    zhjits
    zhjits
    Feb 18, 2016
    9
    好好去研究一下 Material Design Spec 的 **原文**。你这卡片的边距怎么看怎么不对。

    PS :建议把标签移到标题下面,不然动画路径也很不自然。
    Kilerd
    Kilerd
    Feb 18, 2016
    10


    这样不好看点?

    一不小心发送到隔壁帖子去了。
    hexasnake
    hexasnake
    Feb 18, 2016
    11
    背景图很棒!
    kyze8439690
    kyze8439690
    Feb 18, 2016
    12
    很多 padding 需要加大,这个布局太紧凑了,怎么看都 material 。
    当然楼主可能精力都在系统上了。
    9hills
    9hills
    Feb 18, 2016
    13
    感觉怪怪的
    zhjits
    zhjits
    Feb 18, 2016
    14
    @Kilerd 这个用途下面,首选 List ,在 List 无法承载这个信息量的时候考虑 Tile ,用 Card 不适合。

    See: https://www.google.com/design/spec/components/cards.html#cards-usage
    tony1016
    tony1016
    Feb 19, 2016
    15
    @zhjits 同意这位仁兄。紧凑一点,否则觉得别扭
    demo
    demo
    Feb 19, 2016
    16
    没对齐。。。。

    xiaxue
    xiaxue
    Feb 19, 2016
    17
    我有强迫症,我觉得点开文章的时候,宽度不一致的地方别扭... 老是过一会儿,盯着那看两眼
    aaronly
    aaronly
    OP
    Feb 19, 2016
    18
    @zhjits 谢谢建议, spec 阅读的不是很仔细,前端还有很多需要改进的地方,我会继续优化
    aaronly
    aaronly
    OP
    Feb 19, 2016
    19
    @Kilerd 蛤蛤蛤,这个我问过妹子,妹子觉得没有间距比较好看 =。=
    aaronly
    aaronly
    OP
    Feb 19, 2016
    20
    @demo 你是指哪里没对齐?
    laosb
    laosb
    Feb 19, 2016
    21
    保持 tag 作为一种元素的样式一致性,把 Tag Cloud 的样式也改为 chip
    Ruiming
    Ruiming
    Feb 19, 2016
    22
    padding 是不是要再调整下?总感觉有点奇怪。
    tajpure
    tajpure
    Feb 20, 2016 via Android
    23
    @a4e9y47 我用 mdl 简单地弄了一个 hexo theme , https://github.com/tajpure/material ,效果: https://tajpure.com 。
    a4e9y47
    a4e9y47
    Feb 20, 2016
    24
    @tajpure 感觉色彩不太分明...colorPrimary 、 colorPrimaryDark 、 colorAccent 、 colorAccent 能体现出来就好了~
    tajpure
    tajpure
    Feb 20, 2016
    25
    @a4e9y47 哈哈,我比较喜欢轻一点的色彩,感觉太浓重很容易疲劳。
    arens
    arens
    Feb 20, 2016
    26
    文章的加载体验不错, AJAX 吗?不过据说这样的加载不利于 SEO


    @tajpure 是 Wordpress 的吗,那个评论是什么插件?
    tajpure
    tajpure
    Feb 20, 2016 via Android
    27
    @arens 全部是通过 hexo 生成的静态文件,用 nignx 托管的,评论用的 Disqus 。
    aaronly
    aaronly
    OP
    Feb 20, 2016
    28
    @arens 首页是 ajax ,还有另一个页面 /posts 是普通的了表,这个就是为了优化 seo 做的
    Remember
    Remember
    Feb 20, 2016
    29
    然而已经访问不能
    hiroya
    hiroya
    Feb 20, 2016 via iPad
    30
    最喜欢的框架~但 demo 挂掉了
    aaronly
    aaronly
    OP
    Feb 20, 2016 via iPhone
    31
    @Remember 😂给的链接确实挂了,因为今天加了 ssl ,没做重定向,用 https 访问就可以了
    aaronly
    aaronly
    OP
    Feb 20, 2016 via iPhone
    32
    @hiroya 见楼上,非常抱歉
    fantasy467047
    fantasy467047
    Feb 21, 2016
    33
    @int64ago 你这个做的有点丑
    leitwolf
    leitwolf
    Feb 23, 2016
    34
    @aaronly 我可以用一下你这个设计吗?会注明来源。
    aaronly
    aaronly
    OP
    Feb 23, 2016 via iPhone
    35
    @leitwolf 可以的。
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Privacy   ·   Solana   ·   1133 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 64ms · UTC 23:11 · PVG 07:11 · LAX 15:11 · JFK 18:11
    ♥ Do have faith in what you're doing.