帮酷LOGO
0 0 评论
  • 显示原文与译文双语对照的内容
文章标签:Material  Jekyll  MATE  Polymer  MAT  material-theme  theme  
A material theme for Jekyll built with Polymer

  • 源代码名称:jekyll-polymer
  • 源代码网址:http://www.github.com/jtebert/jekyll-polymer
  • jekyll-polymer源代码文档
  • jekyll-polymer源代码下载
  • Git URL:
    git://www.github.com/jtebert/jekyll-polymer.git
  • Git Clone代码到本地:
    git clone http://www.github.com/jtebert/jekyll-polymer
  • Subversion代码到本地:
    $ svn co --depth empty http://www.github.com/jtebert/jekyll-polymer
    Checked out revision 1.
    $ cd repo
    $ svn up trunk
    
  • 演示程序

    使用google的Polymer 构建了一个Jekyll主题,并遵循了该材料设计规范。 ( 目前使用 Polymer 1. x,,但我计划更新到 2. x. )

    有几个定制的网页组件设计用于 MATCH 材质设计。

    我创建了这个主题,因为我无法弄清楚如何使用 Polymer,并且没有找到使用 Polymer 设计规范的of。

    特性

    • 使用 simple-jekyll-search 全文搜索。
    • 分页主页
    • 支持特写图片( 在预览中出现在卡片上)
    • 带 Disqus的线程注释
    • Google Analytics 集成
    • 一个命令部署到Github页面
    • 带标签的带标签的帖子
    • 带有maxima图标的作者

    安装说明

    ( 说明是基于 Polymer 初学者工具包的。)

    • 克隆这个库或者将它的下载为. zip 文件并解压。
    • bundle install 安装 jekyll ( 还有其他 ruby 宝石)。 ( 先决条件:必须安装 ruby ;在 ubuntu/debian中,使用 sudo apt-get install ruby-dev 你还可能需要使用 gem install bundler 安装 bundler。)
    • 从项目 根目录 中运行 npm install -g gulp bower && npm install && bower install ( 请参阅旧的Polymer 初学者工具包安装指导了解更多详细信息或者疑难解答。)

    结构

    • app/: 所有的osm内容都在这里。 ( 这是所有编辑发生的地方)
      • bower_components: 通过 Bower 安装的内容在这里结束
      • elements/: 使用聚合物的自定义网络组件
      • images/: 用户图像
      • media/: final 产品的其他用户内容(。pdf,视频,等等 )
      • scripts/: Javascript文件
      • styles/: 自定义 CSS
      • _data/authors.yml: 帖子和页面的作者列表
    • dist/: 从Gulp生成的输出。 ( 用于发布 static 内容)
    • node_modules: 通过npm安装的内容在这里

    扩展部署

    服务器/监视

    gulp serve: 在缺省端口( 4000或者 _config.yml 中指定的内容) 上启动一个osm服务器进程。

    gulp serve --port 6666 :开始在端口 6666 上服务

    gulp serve:dist: 构建为 below,并提供 dist/ 目录的结果。 ( 用于测试对gulpfile的更改。 当前不能使用配置的Jekyll baseurl )

    构建和 vulcanize

    gulp: 使用 osm,vulcanizes,最小化生成文件,并将结果放在 dist/ 目录中。 ( 这可能会很慢。)

    部署

    gulp deploy-gh-pages: 将当前构建部署到存储库的gh页面分支。

    gulp build-deploy-gh-pages: 重新生成然后部署。 ( 等同于 gulp && gulp deploy-gh-pages )

    的未来改进:

    • 提高 gulp
      • 最小化 JS,CSS,HTML
    • 搜索
      • 退出切换搜索显示
      • 箭头键/tab将焦点移动到搜索结果
      • 更好的搜索栏动画离开/进入
    • 导航抽屉
      • 更改抽屉项的悬停效果( 请参见Google音乐)
      • 将选中/活动项目放在抽屉颜色中
    • 页面过渡动画
    • 提供设置卡colorbar颜色选项
    • 将 Ripple效果 添加到导航抽屉菜单项
    • 分页:
      • 可能用实际按钮替换
      • 悬停效果如按钮?
      • 如果屏幕太宽,则处理? ( 限制页面链接数量)
    • 标签
      • 允许按标签过滤( 有所有标签的列表)
    • 为图像添加材质框或者收藏夹
    • 为 YAML frontmatter添加'源'选项
    • 增加列表项之间的间距
    • 修复header面板对 Polymer 纸张元素的更新

    已知问题

    • JS和HTML没有最小化
    • 摘录结束与阅读按钮之间的空格太多

    许可证

    MIT许可证



    文章标签:theme  MAT  Material  MATE  Jekyll  Polymer  material-theme  

    Copyright © 2011 HelpLib All rights reserved.    知识分享协议 京ICP备05059198号-3  |  如果智培  |  酷兔英语