├── .gitignore ├── CHANGELOG.md ├── LICENSE ├── README.md ├── _config.yml ├── docs ├── FAQ.md ├── theme-settings.md └── third-party-service.md ├── languages ├── default.yml ├── en.yml ├── ja.yml ├── ko.yml ├── zh-CN.yml └── zh-TW.yml ├── layout ├── _partial │ ├── footer.ejs │ ├── header.ejs │ ├── page-archive.ejs │ ├── page-category.ejs │ ├── page-custom.ejs │ ├── page-tag.ejs │ └── pagination.ejs ├── archive.ejs ├── category.ejs ├── index.ejs ├── layout.ejs ├── page.ejs ├── post.ejs └── tag.ejs ├── scripts ├── getPostBgColor.js ├── getPostIcon.js ├── getPostThumb.js ├── monthArchivePosts.js ├── randPostThumb.js ├── relatedPosts.js ├── replaceImg.js └── yearArchivePosts.js └── source ├── 404.html ├── images ├── alipay.JPG ├── apple-touch-icon.png ├── bg-ico.png ├── favicon.png ├── logo-hsuping.png ├── logo.png ├── thumbs │ ├── 1.jpg │ ├── 10.jpg │ ├── 11.jpg │ ├── 12.jpg │ ├── 13.jpg │ ├── 14.jpg │ ├── 15.jpg │ ├── 16.jpg │ ├── 17.jpg │ ├── 18.jpg │ ├── 2.jpg │ ├── 3.jpg │ ├── 4.jpg │ ├── 5.jpg │ ├── 6.jpg │ ├── 7.jpg │ ├── 8.jpg │ └── 9.jpg └── wechat.JPG ├── js ├── instantclick.js ├── instantclick.min.js └── love.js └── style.min.css /.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules -------------------------------------------------------------------------------- /CHANGELOG.md: -------------------------------------------------------------------------------- 1 | # v1.4.2 2 | 2019-09-20 3 | 4 | Fix: [issue4](https://github.com/cccyb/hexo-theme-pinghsu/issues/4) 5 | 6 | - 修复文章目录点击跳转无效的问题 7 | - 优化滚到到顶部的滚动平滑效果 8 | - 修复归档页分页失效的问题 9 | 10 | # v1.4.1 11 | 2019-03-26 12 | 13 | Feature: 14 | - 新增文章图片点击放大功能，由`Fancybox`支持 15 | 16 | Fix: 17 | - 修复首页底部最近评论展示失效的问题 18 | 19 | # v1.4.0 20 | 2019-02-21 21 | 22 | Feature: 23 | - 新增打赏功能 24 | - 文章页面新增音乐播放器功能 25 | - 新增文章字数统计 & 文章阅读时间 & 全站字数统计功能 26 | 27 | # v1.3.0 28 | 2019-02-20 29 | 30 | Feature: 31 | - 使用Valine代替Gitalk作为评论系统 32 | - 首页以及文章详情页新增文章阅读次数（使用LeanCloud配合Valine实现） 33 | - 文章详情页头部添加评论数 34 | - 新增底部最近评论 35 | 36 | # v1.2.0 37 | 2019-02-19 38 | 39 | Feature: 40 | - 新增404页面 41 | - 新增百度统计配置 42 | - 底部社交按钮配置改为动态自定义 43 | - 新增备案信息配置 44 | 45 | Fix: 46 | - 隐藏`pjax`配置，先默认关闭 47 | - 去除谷歌分析配置代码 48 | - 修复https mix content bug 49 | - 修复底部最近文章显示错误问题 50 | 51 | # v1.1.0 52 | 2019-02-03 53 | 54 | Feature: 55 | - 新增不蒜子配置，支持网站统计数据显示 56 | - 新增gitalk评论系统配置 57 | - 新增网页鼠标点击红心效果配置 58 | - 社交按钮配置准确化，若留空则不显示 59 | 60 | Fix: 61 | - 修复`footer`网站地址跳转错误的问题 62 | - 修复`enablePjax`字段设为`false`时影响文章代码高亮的Bug 63 | 64 | # v1.0.0 - Happy New Year! 65 | 2019-02-02 66 | 67 | 第一版上线，欢迎试用，新年快乐! Happy New Year！ -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2019 陈钰博 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | ## Pinghsu 2 | 3 | ![](https://user-images.githubusercontent.com/20245829/52165436-baad8b00-273b-11e9-8ae1-2b2eeaa7163d.png) 4 | 5 | 本主题移植于[chakhsu](https://github.com/chakhsu)的Typecho主题[pinghsu](https://github.com/chakhsu/pinghsu)，将其基于Hexo进行重写。 6 | 7 | 引用原作者对主题的一句话介绍： 8 | 9 | > Pinghsu 是一款以前端性能优化为出发点而制作的 Hexo 主题，同时又兼顾设计美学和视觉传达。 10 | 11 | 非常感谢原作者写出这么精美的主题供我们使用。 12 | 13 | ## 更多预览 14 | 15 | | 首页 - 三栏 | 首页 - 单栏 | 16 | | ------------------------------------------------------------ | ------------------------------------------------------------ | 17 | | ![](https://ws1.sinaimg.cn/large/c542ee77ly1fzs472hub0j212o0u0x4b.jpg) | ![](https://ws1.sinaimg.cn/large/c542ee77ly1fzs47jccpdj212o0u0asm.jpg) | 18 | 19 | | 文章内容页 - 题图 | 文章页 - 目录 | 20 | | ------------------------------------------------------------ | ------------------------------------------------------------ | 21 | | ![](https://ws1.sinaimg.cn/large/c542ee77ly1fzs4ebe3g8j212o0u04c1.jpg) | ![](https://ws1.sinaimg.cn/large/c542ee77ly1fzs4ekgj9zj212o0u0gtj.jpg) | 22 | 23 | | 页面内容页 | 归档页 | 24 | | ------------------------------------------------------------ | ------------------------------------------------------------ | 25 | | ![](https://ws1.sinaimg.cn/large/c542ee77ly1fzs4et3z9jj212o0u0afa.jpg) | ![](https://ws1.sinaimg.cn/large/c542ee77ly1fzs4eyxefjj212o0u0tdo.jpg) | 26 | 27 | | 分类页 | 分类详情页 | 28 | | ------------------------------------------------------------ | ------------------------------------------------------------ | 29 | | ![](https://ws1.sinaimg.cn/large/c542ee77ly1fzs4fstfgvj212o0u0af9.jpg) | ![](https://ws1.sinaimg.cn/large/c542ee77ly1fzs4fzojorj212o0u0wkl.jpg) | 30 | 31 | | 标签页 | 标签详情页 | 32 | | ------------------------------------------------------------ | ------------------------------------------------------------ | 33 | | ![](https://ws1.sinaimg.cn/large/c542ee77ly1fzs4g6fv2xj212o0u0wkg.jpg) | ![](https://ws1.sinaimg.cn/large/c542ee77ly1fzs4gbxbb3j212o0u0wjy.jpg) | 34 | 35 | | 移动端 - 首页 | 移动端 - 文章页 | 移动端 - 归档页 | 36 | | ------------------------------------------------------------ | ------------------------------------------------------------ | ------------------------------------------------------------ | 37 | | ![](https://ws1.sinaimg.cn/large/c542ee77ly1fzs4nqaebfj20yi22ohdz.jpg) | ![](https://ws1.sinaimg.cn/large/c542ee77ly1fzs4nvydnvj20yi22o7g3.jpg) | ![](https://ws1.sinaimg.cn/large/c542ee77ly1fzs4q06qtnj20yi22ok05.jpg) | 38 | 39 | | 移动端 - 分类页 | 移动端 - 标签页 | 移动端 - 详情归档页 | 40 | | ------------------------------------------------------------ | ------------------------------------------------------------ | ------------------------------------------------------------ | 41 | | ![](https://ws1.sinaimg.cn/large/c542ee77ly1fzs4oif8u9j20yi22ownz.jpg) | ![](https://ws1.sinaimg.cn/large/c542ee77ly1fzs4on2tsrj20yi22ogx7.jpg) | ![](https://ws1.sinaimg.cn/large/c542ee77ly1fzs4ot9p54j20yi22ok43.jpg) | 42 | 43 | 下载地址：[https://github.com/cccyb/hexo-theme-pinghsu](https://github.com/cccyb/hexo-theme-pinghsu) 44 | 45 | 在线预览：[https://chenyubo.me](https://chenyubo.me) 46 | 47 | ## 主题亮点 48 | 49 | - 页面预加载与DNS预解析保证极快访问速度 50 | - 无JQuery，无前端框架，无webfont 51 | - HighlightJS代码高亮，支持22种编程代码 52 | - 响应式设计，支持平板与手机，访问体验甚至优于桌面 53 | - 支持图片CDN镜像，支持多种文章缩略图设置 54 | - 支持首页三栏和单栏选择，文章题图和色块 55 | - 支持文章目录、相关文章与数学公式渲染 56 | - 支持文章个性化标徽设置，10种标徽选择 57 | - 支持个人社交按钮，社交分享 58 | - 还有更多亮点等你去发现~ 59 | 60 | ## 安装 61 | 62 | ### 前期准备 63 | 64 | > 安装主题前请确保已根据Hexo官方文档已搭建好本地站点，并能正常启动。 65 | 66 | 参考链接： 67 | 68 | - [概述](https://hexo.io/zh-cn/docs) 69 | - [建站](https://hexo.io/zh-cn/docs/setup) 70 | 71 | ### 下载主题 72 | 73 | 进入`Hexo`博客目录下，下载主题至主题`themes`目录下： 74 | 75 | ```bash 76 | $ cd your-hexo-site 77 | $ git clone https://github.com/cccyb/hexo-theme-pinghsu.git themes/pinghsu 78 | ``` 79 | 80 | ### 启用主题 81 | 82 | 修改根目录下的**站点配置文件**`_config.yml`中的 `theme` 字段为 `pinghsu`: 83 | 84 | ```yml 85 | # Extensions 86 | ## Plugins: https://hexo.io/plugins/ 87 | ## Themes: https://hexo.io/themes/ 88 | theme: pinghsu 89 | ``` 90 | 91 | ### 更新主题 92 | 93 | 进入`Hexo`博客目录下的主题`themes`目录下的`pinghsu`目录： 94 | 95 | ```bash 96 | $ cd your-hexo-site/themes/pinghsu 97 | $ git pull 98 | ``` 99 | 100 | ## 主题设定 101 | 102 | ### 选择主题外观 103 | 104 | 主题提供两套外观进行选择，他们是： 105 | 106 | - 三栏（three）- 默认三栏 107 | - 单栏（one） 108 | 109 | 你可以通过修改`主题配置文件`下的`postListSwitch`字段进行修改： 110 | 111 | ```yaml 112 | # 首页文章列表设置 113 | # 默认三列 114 | # three: 三列，one：一列 115 | postListSwitch: three 116 | ``` 117 | 118 | ### 设置网站通用配置 119 | 120 | 编辑**站点配置文件**`_config.yml`，修改相关配置： 121 | 122 | ```yml 123 | # Site 124 | title: 输入你的博客标题 125 | ... 126 | description: 输入你的博客描述 127 | keywords: 输入你的博客关键词 128 | author: 输入你的名字 129 | 130 | # URL 131 | url: 你的域名 132 | ``` 133 | 134 | ### 设置语言和时区 135 | 136 | 编辑**站点配置文件**`_config.yml`，将 `language` 设置成你所需要的语言。建议明确设置你所需要的语言，例如选用简体中文。将`timezone`设置成你所在的时区，配置如下： 137 | 138 | ```yml 139 | language: zh-CN 140 | timezone: Asia/Shanghai 141 | ``` 142 | 143 | 目前本主题支持以下语言： 144 | 145 | | 语言 | 代码 | 设定示例 | 146 | | -------- | ----- | ----------------- | 147 | | 简体中文 | zh-CN | `language: zh-CN` | 148 | | 繁體中文 | zh-TW | `language: zh-TW` | 149 | | English | en | `language: en` | 150 | | 日本語 | ja | `language: ja` | 151 | | Korean | ko | `language: ko` | 152 | 153 | 默认使用简体中文（zh-CN）语言，如有需要，可以按需进行更改。 154 | 155 | #### 禁用Hexo默认自带代码高亮 156 | 由于hexo默认自带的代码高亮配置与主题代码高亮样式有所冲突，所以需要将默认的禁用，后续在主题配置文件中进行代码高亮配置。 157 | 158 | 编辑**站点配置文件**`_config.yml`： 159 | 160 | ```yml 161 | # Writing 162 | ... 163 | highlight: 164 | enable: false 165 | line_number: false 166 | auto_detect: false 167 | tab_replace: 168 | ``` 169 | 170 | ## 文档 171 | 详细文档见：[文档 | Doc](https://github.com/cccyb/hexo-theme-pinghsu/wiki) 172 | 173 | ## 感谢 174 | 175 | 再次感谢原作者[chakhsu](https://github.com/chakhsu)创作出这么精美的主题 [pinghsu](https://github.com/chakhsu/pinghsu) 。 176 | 177 | ## 贡献 178 | 179 | 欢迎各种形式的贡献，包括但不限于优化，添加功能，文档 & 代码的改进，问题和 bugs 的报告。 180 | 181 | ## 许可证 182 | 183 | [MIT](https://opensource.org/licenses/MIT) -------------------------------------------------------------------------------- /_config.yml: -------------------------------------------------------------------------------- 1 | # =========================================== 2 | # Site Settings 网站相关设置 3 | # =========================================== 4 | 5 | # 网站基础设置 6 | # 图片需要放置在 themes/pinghsu/source/imagse 下 7 | headerLogoUrl: # 头部右上角logo图片地址，留空则取网站标题 8 | footerLogoUrl: # 底部左下角logo图片地址，留空则取网站标题 9 | favicon: /images/favicon.png # favicon地址，留空则不设favicon 10 | iosicon: /images/apple-touch-icon.png # apple touch icon 地址，留空则不设 apple touch icon 11 | since: 2016 # 站点起始时间 12 | 13 | # Menu Setting 菜单设置 14 | menu: 15 | categories: /categories 16 | tags: /tags 17 | archives: /archives 18 | links: /links 19 | about: /about 20 | 21 | # Archive Setting 归档页设置 22 | # month: 按月份归档，year: 按年份归档，默认按月份归档 23 | archive: year 24 | 25 | # Social Setting 社交设置 26 | social: 27 | 知乎: 28 | Github: 29 | 30 | # =========================================== 31 | # Function Setting 功能设置 32 | # =========================================== 33 | 34 | # 是否启用DNS预解析加速 35 | # 启用则会对CDN资源和Gravatar进行加速 36 | dnsPrefetch: true 37 | 38 | # 自定义CDN加速地址 39 | # 若设置，且启用DNS预解析，则会被加速，可以填写图床地址进行图片加载加速，或者加速其他cdn 40 | cdnAdd: 41 | 42 | # 是否启用移动端点击延迟消除设置 43 | enableFastClick: true 44 | 45 | # 是否启用文章Mathjax设置 46 | # 启用则会对内容页进行数学公式渲染，仅支持 $公式$ 和 $$公式$$ 47 | enableMathjax: true 48 | 49 | # 文章页底部相关文章设置 50 | # 仅在文章页中生效，文章是根据标签进行相关的 51 | # enable：是否启用 52 | # limit：显示文章数量，建议设置不超过6条 53 | relatedPosts: 54 | enable: true 55 | limit: 6 56 | 57 | # 底部最近文章设置 58 | # enable：是否启用 59 | # limit：显示数量，建议设置不超过8条 60 | recentlyPosts: 61 | enable: true 62 | limit: 8 63 | 64 | # 底部最近评论设置 65 | # 只有开启了valine评论系统才能生效 66 | # enable：是否启用 67 | # limit：显示数量，建议设置不超过8条 68 | recentlyComments: 69 | enable: true 70 | limit: 8 71 | 72 | # =========================================== 73 | # Appearance Setting 外观设置 74 | # =========================================== 75 | 76 | # 首页文章列表设置 77 | # 默认三列 78 | # three: 三列，one：一列 79 | postListSwitch: three 80 | 81 | # 文章色块设置 82 | # 启用则可以通过文章字段color控制色块颜色，仅支持blue、purple、green、yellow、red 83 | colorBgPosts: true 84 | 85 | # 文章题图设置 86 | # 启用则在文章页顶部显示缩略图 87 | showPostThumb: true 88 | 89 | # 默认缩略图 90 | defaultThumb: 91 | 92 | # 随机缩略图设置 93 | # 设为 0 则不使用主题自带的缩略图 94 | # 不为 0 时表示默认随机缩略图的数量 95 | randomThumb: 18 96 | 97 | # 文章目录设置 98 | # 文章页右边目录生成，仅在网页宽度大于1000px时显示 99 | enableDirectory: true 100 | 101 | # 代码高亮设置 102 | # enable：是否启用 103 | # theme：主题样式css名称，默认使用atom-one-dark主题 104 | highlight: 105 | enable: true 106 | theme: atom-one-dark 107 | 108 | # 底部彩色动态词语配置 109 | # 一个词语一行 110 | animateWords: 111 | - Hexo 112 | - Theme 113 | - Pinghsu 114 | 115 | # 不蒜子网站统计 116 | busuanzi: true 117 | 118 | # 网站点击红心效果 119 | clickLove: true 120 | 121 | # 百度统计id，填写复 hm.js? 后面那串统计脚本 id 122 | baiduAnalytics: 123 | 124 | # 网站备案信息 125 | beian: 126 | 127 | # valine评论系统 128 | # 配置详情参考：https://valine.js.org/configuration.html 129 | valine: 130 | enable: false # 是否启用 131 | appId: # 应用AppID 132 | appKey: # 应用AppKey 133 | placeholder: Your commnet here. Be cool. # 输入框默认显示文本 134 | pageSize: 10 # 每页评论数量 135 | avatar: mp # 头像类型 136 | visitor: true # 文章阅读量统计 137 | 138 | # 打赏配置 139 | # 二维码图片放置在主题目录下的/source/imagse/ 140 | # example：/images/wechat.jpg 141 | reward: 142 | enable: false # 是否启用 143 | text: 如果我的文章对你有很大帮助，那么不妨 # 打赏文案 144 | wechat: /images/wechat.jpg # 微信支付二维码地址 145 | alipay: /images/alipay.jpg # 支付宝二维码地址 146 | 147 | # 文章页音乐播放器设置 148 | # 配置详情参考：https://github.com/metowolf/MetingJS 149 | music: 150 | enable: false # 是否启用 151 | id: # song id / playlist id / album id / search keyword 152 | server: # music platform: netease, tencent, kugou, xiami, baidu 153 | type: # song, playlist, album, search, artist 154 | auto: # music link, support: netease, tencent, xiami 155 | autoplay: false # 是否自动播放 -------------------------------------------------------------------------------- /docs/FAQ.md: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cccyb/hexo-theme-pinghsu/2701903d081a98c84789fffbff2d093cf39b577b/docs/FAQ.md -------------------------------------------------------------------------------- /docs/theme-settings.md: -------------------------------------------------------------------------------- 1 | ## 主题配置 2 | 3 | 对主题文件夹内`themes/pinghsu`下的`_config.yml`配置文件进行修改，具体配置文件可以参考主题内的默认配置：[_config.yml](https://github.com/cccyb/hexo-theme-pinghsu/blob/master/_config.yml)。部分简单配置参考配置文件中的注释即可，配置过程中需要注意的事项主要有将在下面进行介绍。 4 | 5 | ### 菜单设置 6 | 7 | Menu菜单设置主要包括两部分，第一是菜单项（名称和链接），第二是菜单项的显示文本。 8 | 9 | **菜单项设置** 10 | 11 | 修改**主题配置文件**中的`menu`字段，设置格式为`name：link`，注意，`name`并不是显示页面上的文本，而是一个`key`用以匹配链接和文本。 12 | 13 | `menu`选项的设置顺序将决定了页面中的菜单项顺序，设置中的顺序从上至下将依次在页面中从左到右展示。 14 | 15 | ```yml 16 | menu: 17 | categories: /categories 18 | tags: /tags 19 | archives: /archives 20 | links: /links 21 | about: /about 22 | ``` 23 | 24 | pinghsu主题默认的菜单项包括：分类，标签，归档，友情链接，关于我。**但是需要注意：**只有归档页（archives）的页面是默认可以显示的，分类页（categories）、标签页（tags）分别参考下面的分类页设置和标签页设置，友情链接（links）、关于我（about）参考下面的自定义页面设置。 25 | 26 | **菜单项文本设置** 27 | 28 | 我们第一步设置的菜单项的`name`并不是直接用于页面展示，Hexo在生成页面的时候会使用`name`去对应的语言配置文件中寻找对应的翻译文本展示到页面上。这些翻译文本放置在主题目录下的`languages/{language}.yml`中。 29 | 30 | 我们以简体中文为例，如果你在第一步中添加了一个额外的菜单项`example: /example`，那么就需要在对应的简体中文语言文件`languages/zh-CN.yml`中，在`menu`字段下添加一项： 31 | 32 | ```yml 33 | menu: 34 | categories: 分类 35 | tags: 标签 36 | archives: 归档 37 | links: 友情链接 38 | about: 关于我 39 | example: 示例菜单 40 | ``` 41 | 42 | ### 分类页设置 43 | 44 | 分类页默认不存在，需要进行手动配置才能在页面上正确展示。 45 | 46 | **新建分类页面** 47 | 48 | 在终端中进入Hexo站点目录，使用`hexo new page`新建一个页面，命名为`categoies`： 49 | 50 | ```bash 51 | $ cd your-hexo-site 52 | $ hexo new page categories 53 | ``` 54 | 55 | **设置页面类型** 56 | 57 | 打开刚刚新建的`source/categories/index.md`，将页面的`type`设置成`categories`，主题将自动为这个页面显示成分类页。 58 | 59 | ```markdown 60 | title: 分类 61 | date: 2019-02-01 12:39:04 62 | type: "categories" 63 | --- 64 | ``` 65 | 66 | **修改菜单** 67 | 68 | 主题已默认添加分类菜单。 69 | 70 | ### 标签页设置 71 | 72 | 标签页与分类页设置相似，只是需要将对于的categories改为tags即可。 73 | 74 | **新建标签页面** 75 | 76 | 在终端中进入Hexo站点目录，使用`hexo new page`新建一个页面，命名为`tags`： 77 | 78 | ```bash 79 | $ cd your-hexo-site 80 | $ hexo new page tags 81 | ``` 82 | 83 | **设置页面类型** 84 | 85 | 打开刚刚新建的`source/tags/index.md`，将页面的`type`设置成`tags`，主题将自动为这个页面显示成标签页。 86 | 87 | ```markdown 88 | title: 标签 89 | date: 2019-02-01 12:39:04 90 | type: "tags" 91 | --- 92 | ``` 93 | 94 | **修改菜单** 95 | 96 | 主题已默认添加标签菜单。 97 | 98 | ### 自定义页面设置 99 | 100 | 自定义页面和分类和标签页面一样，本质上是一个独立页面，但与上述分类页和标签页不同，分类页和标签页的内容有主题中的内置模板决定，而普通自定义页面的内容将由`index.md`中的内容决定，最终渲染的效果与文章页相识，本质上就是一篇md文章。主题默认菜单中的`links`和`about`就是一个普通的自定义页面。 101 | 102 | 下面我们以关于我页面`about`为例，介绍自定义页面的设置过程： 103 | 104 | **新建页面** 105 | 106 | 在终端中进入Hexo站点目录，使用`hexo new page`新建一个页面，名称自定义，我们这里使用`about`， 107 | 108 | ```bash 109 | $ cd your-hexo-site 110 | $ hexo new page about 111 | ``` 112 | 113 | **编辑页面内容** 114 | 115 | 打开刚刚新建的`source/about/index.md`，跟正常书写文章一样，进行页面内容的编辑，但是需要注意：自定义页面不支持文章的某些字段，比如：分类`categories`，标签`tags`，色块`color`，徽标`icon`，缩略图`thumb`。 116 | 117 | **修改菜单** 118 | 119 | 友情链接`links`和关于我`about`页面的菜单项主题已默认添加，如果你添加了其他自定义页面，可以参照菜单设置进行对应的配置。 120 | 121 | ### 社交设置 122 | 123 | 可以通过修改`主题配置文件`进行页面底部的社交按钮配置，你可以在`social`字段下自定义添加社交选项，格式为`name: link`形式，`name`为显示在页面上的文案，`link`为对应的跳转链接： 124 | 125 | ```yaml 126 | # Social Setting 社交设置 127 | social: 128 | 知乎: 129 | Github: 130 | ``` 131 | 132 | ### 个性化色块设置 133 | 134 | 本主题支持对文章进行个性化色块设置，需要在主题配置文件将`colorBgPosts`设置为`true`开启，色块出现的地方有首页，分类详情页，标签页，标签详情页。 135 | 136 | ```yml 137 | colorBgPosts: true 138 | ``` 139 | 140 | 设置方法为在文章md文件顶部添加自定义字段`color`，支持的字段值有：`blue`、`purple`、`green`、`yellow`、`red`。 141 | 142 | ```markdown 143 | title: 文章标题 144 | date: 2019-02-01 12:39:04 145 | ... 146 | color：blue 147 | --- 148 | ``` 149 | 150 | 如果文章中没有设置`color`或者`color`字段设置的值不在上述字段中，则会随机选择一个颜色。如果`colorBgPosts`为`false`，则默认为`deepgrey`灰色。 151 | 152 | ### 个性化徽标设置 153 | 154 | 本主题支持对文章添加个性化徽标，个性化徽标默认显示，不可关闭，个性化徽标出现的地方有首页，分类详情页，标签详情页，相关文章。 155 | 156 | 设置方法类似个性话色块，在文章md文件顶部添加自定义字段`icon` ，支持的字段值有：`book` 、 `game` 、 `note` 、 `chat` 、 `code` 、 `image` 、 `web` 、 `link` 、 `design`、 `lock`。 157 | 158 | ```markdown 159 | title: 文章标题 160 | date: 2019-02-01 12:39:04 161 | ... 162 | icon：book 163 | --- 164 | ``` 165 | 166 | 如果文章中没有设置`icon`或者`icon`字段设置的值不在上述字段中，则会随机选择一个徽标。 167 | 168 | ### 文章缩略图设置 169 | 170 | 本主题支持对文章进行缩略图配置： 171 | 172 | ```yml 173 | # 默认缩略图 174 | defaultThumb: 175 | 176 | # 随机缩略图设置 177 | # 设为 0 则不使用主题自带的缩略图 178 | # 不为 0 时表示默认随机缩略图的数量 179 | randomThumb: 18 180 | 181 | # 文章题图设置 182 | # 启用则在文章页顶部显示缩略图 183 | showPostThumb: true 184 | ``` 185 | 186 | 文章缩略图出现的地方有首页，文章页顶部。 187 | 188 | 文章设置缩略图方法有三种，自定义字段`thumb`，文章第一张图片，默认缩略图。 189 | 190 | 优先级顺序为：自定义字段`thumb` → 文章第一张图片 → 默认缩略图 → 随机缩略图 → 无。 191 | 192 | 缩略图尺寸大小，高度至少250px，宽度大于高度，推荐高度为400px。 193 | 194 | **自定义字段`thumb`** 195 | 196 | 在文章顶部添加`thumb`字段，可以填外链地址，要符合标准的url，以http(s)开头，也可以填写本地文件路径，比如`/images/xxx.jpg`,图片文件放置在主题的`/source/images`目录或其子目录下，图片后缀仅支持`png`，`jpg`，`jpeg`，`webp`。 197 | 198 | 若未添加`thumb`字段，或者添加的`thumb`字段不符合上述规则，则字段不生效，会使用下一优先级的缩略图配置。 199 | 200 | **文章第一张图片** 201 | 202 | 主题会从文章正文中找出第一张图片的`src` 作为缩略图。若文章中没有插入图片，则会使用下一优先级缩略图配置。 203 | 204 | **默认缩略图** 205 | 206 | 默认缩略图需要在配置文件中填写`defaultThumb` 字段，填写地址要求同自定义字段`thumb`，若留空或者地址不合法，则会使用下一优先级的缩略图配置。 207 | 208 | **随机缩略图** 209 | 210 | 随机缩略图需要在配置文件中配置`randomThumb`字段。 211 | 212 | ```yml 213 | randomThumb: 18 214 | ``` 215 | 216 | 字段值为随机缩略图的数量，主题默认提供18张缩略图进行随机选择，如果需要新增图片或者删除图片，可以在`source/images/thumbs`目录下进行操作，注意，图片命名要为纯数字，从1开始，且后缀必须为`jpg`，比如`1.jpg`，自定义缩略图后，将`randomThumb`的值修改成文件夹内图片的数量。 217 | 218 | **无缩略图** 219 | 220 | 若将`randomThumb`字段设为0，则表示禁用随机缩略图，则在首页缩略图部分显示个性化色块的颜色，在文章页顶部题图显示为灰色，所以建议至少开始随机缩略图选项。 221 | 222 | **文章题图** 223 | 224 | 文章页顶部支持题图设置，若缩略图设置不为空，且`showPostThumb`设为`true`，则在文章页顶部会展示题图，图片内容为缩略图的内容。 225 | 226 | ### 代码高亮设置 227 | 228 | 主题支持代码高亮设置，支持对常见的编程语言进行代码高亮。 229 | 230 | 将主题配置文件中的`highlight` 选项的`enable`设置为`true`即可实现代码高亮，默认高亮主题样式为`atom-one-dark`。 231 | 232 | ```yml 233 | highlight: 234 | enable: true 235 | theme: atom-one-dark 236 | ``` 237 | 238 | 若需修改其他高亮主题，可以在[https://highlightjs.org/static/demo/](https://highlightjs.org/static/demo/)网站中右下角自行选择你满意的主题`styles`，将其名称所有字母小写，按`-`分隔开，填入`theme`即可。 239 | 240 | 比如，如果你选中的主题`styles`为`Atom One Dark`，则将其改写成`atom-one-dark`即可。 241 | 242 | ### 设置RSS 243 | 244 | 社交链接中可以添加`rss`链接，但是需要先进行配置。 245 | 246 | **安装rss插件** 247 | 248 | 在命令行中执行： 249 | 250 | ```bash 251 | $ cd your-hexo-site 252 | $ npm install hexo-generator-feed --save 253 | ``` 254 | 255 | **添加rss配置** 256 | 257 | 打开根目录下的**站点配置文件**`_config.yml`，添加以下配置项： 258 | 259 | ```yml 260 | feed: 261 | type: atom 262 | path: atom.xml 263 | limit: 20 264 | hub: 265 | content: 266 | content_limit: 140 267 | content_limit_delim: ' ' 268 | order_by: -date 269 | icon: icon.png 270 | ``` 271 | 272 | 具体配置详情见：[https://github.com/hexojs/hexo-generator-feed](https://github.com/hexojs/hexo-generator-feed) ，请自己根据文档按需配置。 273 | 274 | **添加菜单** 275 | 276 | rss配置添加完成后，在主题配置文件`_config.yml`中的`social`字段中填写`rss`地址，值为`/atom.xml`。 277 | 278 | ```yml 279 | social: 280 | ... 281 | rss: /atom.xml 282 | ... 283 | ``` 284 | 285 | ### 打赏功能设置 286 | 287 | 主题支持在文章页对文章进行打赏，编辑**主题配置文件**： 288 | 289 | ```yaml 290 | reward: 291 | enable: true # 是否启用 292 | text: 如果我的文章对你有很大帮助，那么不妨 # 打赏文案 293 | wechat: /images/wechat.jpg # 微信支付二维码地址 294 | alipay: /images/alipay.jpg # 支付宝二维码地址 295 | ``` 296 | 297 | 其中二维码图片需要放置在主题目录下的`/source/images/`。 298 | 299 | ### 字数统计功能设置 300 | 301 | 主题支持显示文章字数统计 & 文章阅读时间 & 全站字数统计功能，需要手动安装`hexo-wordcount`插件进行启用，在博客目录下执行以下命令： 302 | 303 | ```bash 304 | npm i hexo-wordcount --save 305 | ``` 306 | 307 | ### 音乐播放器设置 308 | 309 | 主题支持在文章页底部添加音乐播放器，编辑**主题配置文件**，添加以下配置以启用这一功能： 310 | 311 | ```yaml 312 | music: 313 | enable: true # 是否启用 314 | id: # song id / playlist id / album id / search keyword 315 | server: # music platform: netease, tencent, kugou, xiami, baidu 316 | type: # song, playlist, album, search, artist 317 | auto: # music link, support: netease, tencent, xiami 318 | autoplay: false # 是否自动播放 319 | ``` 320 | 321 | - `id`：歌曲id，歌单id，专辑id，搜索关键词 322 | 323 | - `server`：音乐平台，支持 324 | 325 | - `netease`：网易云音乐 326 | - `tencent`：QQ音乐 327 | - `kugou`：酷狗音乐 328 | - `xiami`：虾米音乐 329 | - `baidu`：百度音乐 330 | 331 | - `type`：音乐播放类型，对应`id` 332 | 333 | - `song`：单曲 334 | - `playlist`：歌单 335 | - `album`：专辑 336 | - `search`：搜索 337 | - `artist`：未知 338 | 339 | - `auto` ：音乐链接，支持网易云音乐，QQ音乐，虾米音乐 340 | - `autoplay`：自动播放 341 | 342 | 更详细配置项介绍可参考：[https://github.com/metowolf/MetingJS](https://github.com/metowolf/MetingJS) 343 | 344 | ### 首页分页设置 345 | 346 | ```yml 347 | index_generator: 348 | path: '' 349 | per_page: 12 350 | order_by: -date 351 | ``` 352 | 353 | - per_page：首页文章每页多少条 354 | - order_by：首页文章分页排序规则，默认按时间降序 355 | 356 | 主题首页三列布局下建议设置`per_page`为`3`的倍数最佳，建议`12条`。 357 | 358 | ### 归档页设置 359 | 360 | ```yml 361 | archive_generator: 362 | enabled: true 363 | per_page: 0 364 | yearly: true 365 | monthly: true 366 | daily: false 367 | order_by: -date 368 | ``` 369 | 370 | - per_page - 归档页每页展示文章数量，`0`表示不分页 371 | - order_by - 文章排序规则，默认按照创建时间降序 372 | 373 | ### 分类详情页和标签详情页设置 374 | 375 | ```yml 376 | category_generator: 377 | per_page: 12 378 | 379 | tag_generator: 380 | per_page: 12 381 | ``` 382 | 383 | 主题中分类详情页和标签详情页双列展示，建议设置为`2`的倍数最佳。 -------------------------------------------------------------------------------- /docs/third-party-service.md: -------------------------------------------------------------------------------- 1 | ## 第三方服务 2 | 3 | 静态站点拥有一定的局限性，因此我们需要借助于第三方服务来扩展站点的功能。 以下是 pinghsu 目前支持的第三方服务，你可以根据你的需求集成一些功能进来。 4 | 5 | ### 百度统计 6 | 7 | 1. 登录 [百度统计](http://tongji.baidu.com/)，定位到站点的代码获取页面 8 | 2. 复制 `hm.js?` 后面那串统计脚本 id，如下图所示： 9 | 10 | ![](https://ws1.sinaimg.cn/large/c542ee77ly1g0d71hj37aj20ih06ot8v.jpg) 11 | 12 | 3. 编辑**主题配置文件**，修改字段 `baiduAnalytics`，值设置成你的百度统计脚本 id。 13 | 14 | ### 不蒜子统计 15 | 16 | 编辑 **主题配置文件** 中的`busuanz`的配置项，设置为`true`即可开启不蒜子统计，开启后默认在页面底部展示站点UV和站点PV 17 | 18 | ### 评论系统 19 | 20 | 本主题评论系统使用[Valine](https://valine.js.org/)进行底层支持，由于[Valine](https://valine.js.org/)是由第三方服务`LeanCloud`进行支持，因此需要先获取`LeanCloud`的相关配置。以下我将进行简要介绍，具体可以参考[Valine](https://valine.js.org/)使用文档。 21 | 22 | **创建应用** 23 | 24 | 请先[登录](https://leancloud.cn/dashboard/login.html#/signin)或[注册](https://leancloud.cn/dashboard/login.html#/signup) `LeanCloud`, 进入[控制台](https://leancloud.cn/dashboard/applist.html#/apps)后点击左下角[创建应用](https://leancloud.cn/dashboard/applist.html#/newapp)： 25 | 26 | ![](https://ws1.sinaimg.cn/large/c542ee77ly1g0d79y5ej9j20h40coaak.jpg) 27 | 28 | 应用名称无具体要求，建议使用有明确含义的名称。 29 | 30 | **新建Comment的Class** 31 | 32 | 新建相应的`Class`，`Class`名称为`Comment`： 33 | 34 | ![](https://ws1.sinaimg.cn/large/c542ee77ly1g0d7f6k0qxj21z010mjz4.jpg) 35 | 36 | **获取APP ID 和 APP Key** 37 | 38 | 应用创建好以后，进入刚刚创建的应用，选择左下角的`设置`>`应用Key`，然后就能看到你的`APP ID`和`APP Key`了： 39 | 40 | ![](https://ws1.sinaimg.cn/large/c542ee77ly1g0d7bbuhwmj20xe0etjt4.jpg) 41 | 42 | **配置安全域名** 43 | 44 | 为了你的数据安全，请设置自己的`安全域名`： 45 | 46 | ![](https://ws1.sinaimg.cn/large/c542ee77ly1g0d7hz3bmdj20qd0go40h.jpg) 47 | 48 | **修改配置文件** 49 | 50 | 编辑**主题配置文件**，将`enable`字段设为`true`以启用评论系统，将前面获取的`AppID`和`AppKey`填写进配置文件： 51 | 52 | ```yaml 53 | # valine评论系统 54 | valine: 55 | enable: true 56 | appId: 你的应用AppID 57 | appKey: 你的应用AppKey 58 | placeholder: Your commnet here. Be cool. 59 | pageSize: 10 60 | avatar: mp 61 | ... 62 | ``` 63 | 64 | 目前本主题仅支持配置以上选项，具体详情可参考：[Valine配置项](https://valine.js.org/configuration.html)，其他配置项均使用默认配置。 65 | 66 | ### 文章阅读量统计 67 | 68 | 主题使用`Valine`自带的文章阅读量统计功能，按如下配置即可开启： 69 | 70 | ```yaml 71 | # valine评论系统 72 | valine: 73 | ... 74 | visitor: true 75 | ``` -------------------------------------------------------------------------------- /languages/default.yml: -------------------------------------------------------------------------------- 1 | menu: 2 | categories: 分类 3 | tags: 标签 4 | archives: 归档 5 | links: 友情链接 6 | about: 关于我 7 | 8 | recentlyPosts: 最近文章 9 | 10 | recentlyComments: 最近评论 11 | 12 | index: 13 | readMore: 继续阅读 14 | 15 | tags: 16 | title: 所有标签 17 | count: 目前共计%d标签 18 | 19 | archives: 20 | title: 嗯..! 目前共计 %d 篇日志。 继续努力~ 21 | empty: 你还没有书写文章哦，赶紧去写一篇吧~ 22 | 23 | categories: 24 | empty: 你还没有分类哦，赶紧去给你的文章加上分类吧~ 25 | 26 | archive: 27 | empty: 没有找到内容，请换别的关键字进行检索~ 28 | 29 | views: 30 | text: 本站总访问量 31 | unit: 次 32 | vistors: 33 | text: 本站访客数 34 | unit: 人次 -------------------------------------------------------------------------------- /languages/en.yml: -------------------------------------------------------------------------------- 1 | menu: 2 | categories: Categories 3 | tags: Tags 4 | archives: Archives 5 | links: Links 6 | about: About 7 | 8 | recentlyPosts: RECENT POSTS 9 | 10 | recentlyComments: RECENT COMMENTS 11 | 12 | index: 13 | readMore: Continue Reading 14 | 15 | tags: 16 | title: All Tags 17 | count: Currently total %d tags 18 | 19 | archives: 20 | title: Hmm..! There are currently %d posts in total. keep it up~ 21 | empty: You haven't written an article yet, just go and write an article~ 22 | 23 | categories: 24 | empty: You haven't classified yet, just go and add a classification to your article~ 25 | 26 | archive: 27 | empty: No content found, please search for another keyword~ 28 | 29 | views: 30 | text: Total views 31 | unit: times 32 | vistors: 33 | text: Total vistors 34 | unit: m -------------------------------------------------------------------------------- /languages/ja.yml: -------------------------------------------------------------------------------- 1 | menu: 2 | categories: 分類 3 | tags: ラベル 4 | archives: アーカイブ 5 | links: フレンドリーリンク 6 | about: 私について 7 | 8 | recentlyPosts: 最近の記事 9 | 10 | recentlyComments: 最近のコメント 11 | 12 | index: 13 | readMore: 続きを読む 14 | 15 | tags: 16 | title: すべてのラベル 17 | count: 現在合計％dタグ 18 | 19 | archives: 20 | title: うーん..！現在％d個のログがあります。 頑張ってください〜 21 | empty: あなたはまだ記事を書いていません、ただ記事を書きに行ってください〜 22 | 23 | categories: 24 | empty: まだ分類していません。記事に分類を追加してください〜 25 | 26 | archive: 27 | empty: コンテンツが見つかりません。別のキーワードで検索してください〜 28 | 29 | views: 30 | text: サイトへの合計訪問回数 31 | unit: 回 32 | vistors: 33 | text: このサイトへの訪問者 34 | unit: 人 -------------------------------------------------------------------------------- /languages/ko.yml: -------------------------------------------------------------------------------- 1 | menu: 2 | categories: 분류 3 | tags: 레이블 4 | archives: 아카이브 5 | links: 우호적 인 링크 6 | about: 나에 대해서 7 | 8 | recentlyPosts: 최근 기사 9 | 10 | recentlyComments: 최근 댓글 11 | 12 | index: 13 | readMore: 계속 읽기 14 | 15 | tags: 16 | title: 모든 라벨 17 | count: 현재 총 %d 개의 태그 18 | 19 | archives: 20 | title: 흠 ..! 현재 총 %d 개의 로그가 있습니다. 계속 열심히 ~ 21 | empty: 아직 기사를 작성하지 않았습니다. 가서 기사를 작성하십시오 ~ 22 | 23 | categories: 24 | empty: 당신은 아직 분류하지 않았습니다, 그냥 가서 기사에 분류를 추가하십시오 ~ 25 | 26 | archive: 27 | empty: 내용이 없으므로 다른 키워드를 검색하십시오 ~ 28 | 29 | views: 30 | text: 총 사이트 방문 횟수 31 | unit: 회 32 | vistors: 33 | text: 이 사이트 방문자 34 | unit: 명 -------------------------------------------------------------------------------- /languages/zh-CN.yml: -------------------------------------------------------------------------------- 1 | menu: 2 | categories: 分类 3 | tags: 标签 4 | archives: 归档 5 | links: 友情链接 6 | about: 关于我 7 | 8 | recentlyPosts: 最近文章 9 | 10 | recentlyComments: 最近评论 11 | 12 | index: 13 | readMore: 继续阅读 14 | 15 | tags: 16 | title: 所有标签 17 | count: 目前共计%d标签 18 | 19 | archives: 20 | title: 嗯..! 目前共计 %d 篇日志。 继续努力~ 21 | empty: 你还没有书写文章哦，赶紧去写一篇吧~ 22 | 23 | categories: 24 | empty: 你还没有分类哦，赶紧去给你的文章加上分类吧~ 25 | 26 | archive: 27 | empty: 没有找到内容，请换别的关键字进行检索~ 28 | 29 | views: 30 | text: 本站总访问量 31 | unit: 次 32 | vistors: 33 | text: 本站访客数 34 | unit: 人次 -------------------------------------------------------------------------------- /languages/zh-TW.yml: -------------------------------------------------------------------------------- 1 | menu: 2 | categories: 分類 3 | tags: 標籤 4 | archives: 歸檔 5 | links: 友情鏈接 6 | about: 關於我 7 | 8 | recentlyPosts: 最近文章 9 | 10 | recentlyComments: 最近評論 11 | 12 | index: 13 | readMore: 繼續閱讀 14 | 15 | tags: 16 | title: 所有標籤 17 | count: 目前共計%d標籤 18 | 19 | archives: 20 | title: 嗯..! 目前共計 %d 篇日誌。 繼續努力~ 21 | empty: 你還沒有書寫文章哦，趕緊去寫一篇吧~ 22 | 23 | categories: 24 | empty: 你還沒有分類哦，趕緊去給你的文章加上分類吧~ 25 | 26 | archive: 27 | empty: 沒有找到內容，請換別的關鍵詞進行檢索~ 28 | 29 | views: 30 | text: 本站總訪問量 31 | unit: 次 32 | vistors: 33 | text: 本站總訪客數 34 | unit: 人次 -------------------------------------------------------------------------------- /layout/_partial/footer.ejs: -------------------------------------------------------------------------------- 1 | 53 | 54 | <% if (theme.enableDirectory && is_post()) { %> 55 |
56 |
57 |
58 | 147 | <% } %> 148 | 149 | <% if (theme.highlight.enable) { %> 150 | 151 | <% } %> 152 | <% if (theme.enablePjax) { %> 153 | 154 | <% } %> 155 | <% if (theme.enableFastClick) { %> 156 | 157 | <% } %> 158 | 208 | 212 | <% if (theme.enableMathjax) { %> 213 | 232 | 233 | <% } %> 234 | <% if (theme.busuanzi) { %> 235 | 236 | <% } %> 237 | <% if (!theme.enablePjax && theme.clickLove) { %> 238 | <%- js('/js/love.js') %> 239 | <% } %> 240 | <% if (theme.valine.enable && !theme.enablePjax) { %> 241 | 252 | <% } %> 253 | <% if (theme.enablePjax) { %> 254 | 273 | <% } %> 274 | 310 | <% if (theme.music.enable && is_post()) { %> 311 | 312 | 313 | 314 | <% } %> 315 | 316 | -------------------------------------------------------------------------------- /layout/_partial/header.ejs: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | <% if (theme.dnsPrefetch) { %> 6 | 7 | <% if (theme.cdnAdd) { %> 8 | 9 | <% } %> 10 | 11 | 12 | 13 | <% } %> 14 | 15 | 16 | 17 | 18 | 19 | 20 | <% if (theme.favicon) { %> 21 | 22 | <% } %> 23 | <% if (theme.iosicon) { %> 24 | 25 | <% } %> 26 | 27 | <% if (title) { %> 28 | <%= title %> - <%= config.title %> 29 | <% } else { %> 30 | <%= config.title %> 31 | <% } %> 32 | 33 | 34 | 35 | <% var highlightTheme = theme.highlight.theme || 'atom-one-dark' %> 36 | 37 | <%- css('style.min.css') %> 38 | 42 | <% if (theme.baiduAnalytics) { %> 43 | 52 | <% } %> 53 | <% if (theme.valine.enable) { %> 54 | 55 | 56 | <% } %> 57 | 58 | 59 | 60 | 61 | 62 | 63 | 68 | -------------------------------------------------------------------------------- /layout/_partial/page-archive.ejs: -------------------------------------------------------------------------------- 1 |
2 |
3 |
4 | <% var commonTitle 5 | if (is_category()) { 6 | commonTitle = 'Category : ' + page.category; 7 | } else if (is_tag()) { 8 | commonTitle = 'Tag : ' + page.tag; 9 | } 10 | %> 11 | <%= commonTitle %> 12 |
13 |
14 |
15 | <% if (page.posts) {%> 16 | <% page.posts.forEach(function(post) { %> 17 |
18 |
19 |
20 |
<%= post.title %>
21 |
22 |
23 |
<%= post.date.format('MMM DD, YYYY') %>
24 |
25 |
26 |
27 |
28 | <% }); %> 29 | <% } else { %> 30 |
<%= __('archive.empty') %>
31 | <% } %> 32 |
33 |
34 |
35 | <% if (page.total > 1) { %> 36 |
37 | <%- partial('_partial/pagination') %> 38 |
39 | <% } %> 40 |
-------------------------------------------------------------------------------- /layout/_partial/page-category.ejs: -------------------------------------------------------------------------------- 1 | <%- partial('_partial/header', { 2 | title: '分类', 3 | bgColor: 'bg-grey' 4 | }) %> 5 | 6 |
7 | <% if (site.categories.length > 0) { %> 8 | <% site.categories.forEach(function(category) { %> 9 |
10 |
11 | <%= category.name %> ：<%= category.posts.count() %> 12 |
13 |
14 |
15 | <% category.posts.forEach(function(post) { %> 16 |
17 |
18 |
19 |
<%= post.title %>
20 |
21 |
<%= post.date.format('MMM DD, YYYY') %>
22 |
23 |
24 |
25 |
26 | <%});%> 27 |
28 |
29 |
30 | <%});%> 31 | <% } else { %> 32 |

<%= __('categories.empty') %>

33 | <% } %> 34 |
35 | 36 | <%- partial('_partial/footer') %> -------------------------------------------------------------------------------- /layout/_partial/page-custom.ejs: -------------------------------------------------------------------------------- 1 | <%- partial('_partial/header', { 2 | title: page.title, 3 | bgColor: 'bg-white' 4 | }) %> 5 | 6 |
7 |
8 |

9 | <%= page.title %> 10 |

11 |
12 | 13 |
14 |
15 |
16 | <%- page.content %> 17 |
18 |
19 | 20 | <%- partial('_partial/footer') %> -------------------------------------------------------------------------------- /layout/_partial/page-tag.ejs: -------------------------------------------------------------------------------- 1 | <%- partial('_partial/header', { 2 | title: '标签', 3 | bgColor: 'bg-grey' 4 | }) %> 5 | 6 |
7 |
8 |
9 |

<%= __('tags.title') %>

10 |

<%= __('tags.count', site.tags.count()) %>

11 |
12 |
13 | <% if (site.tags.length !== 0) { %> 14 | <% site.tags.sort('-posts.length').forEach(function(tag) { %> 15 | # <%= tag.name %>(<%= tag.posts.count() %>) 16 | <% }); %> 17 | <% } else { %> 18 |

Nothing here !

19 | <% } %> 20 |
21 |
22 |
23 |
24 | 25 | <%- partial('_partial/footer') %> -------------------------------------------------------------------------------- /layout/_partial/pagination.ejs: -------------------------------------------------------------------------------- 1 |
    2 | <%- paginator({ 3 | prev_text: '←', 4 | next_text: '→' 5 | }) %> 6 |
-------------------------------------------------------------------------------- /layout/archive.ejs: -------------------------------------------------------------------------------- 1 | <%- partial('_partial/header', { 2 | title: '归档', 3 | bgColor: 'bg-grey' 4 | }) %> 5 | 6 |
7 |

<%= __('archives.title', site.posts.length) %>

8 |
9 | <% if (page.posts.length !== 0) { %> 10 | <% var archivePosts = []; 11 | if (theme.archive === 'year') { 12 | archivePosts = yearArchivePosts(page.posts); 13 | } else { 14 | archivePosts = monthArchivePosts(page.posts); 15 | } 16 | %> 17 | <% archivePosts.forEach(function(item) { %> 18 |
<%= item.title %>
19 |
20 |
21 | <% item.list.forEach(function(post) { %> 22 |
23 |
24 |
25 |
26 | <%= post.title %> 27 |
28 |
29 |
<%= post.date.format('MMM DD, YYYY') %>
30 |
31 |
32 |
33 |
34 | <% }); %> 35 |
36 |
37 | <% }); %> 38 | <% } else { %> 39 |

<%= __('archives.empty') %>

40 | <% } %> 41 |
42 | <% if (page.total > 1) { %> 43 |
44 | <%- partial('_partial/pagination') %> 45 |
46 | <% } %> 47 |
48 | 49 | <%- partial('_partial/footer') %> -------------------------------------------------------------------------------- /layout/category.ejs: -------------------------------------------------------------------------------- 1 | <%- partial('_partial/header', { 2 | title: page.category, 3 | bgColor: theme.colorBgPosts ? 'bg-white' : 'bg-grey' 4 | }) %> 5 | 6 | <%- partial('_partial/page-archive') %> 7 | 8 | <%- partial('_partial/footer') %> -------------------------------------------------------------------------------- /layout/index.ejs: -------------------------------------------------------------------------------- 1 | <%- partial('_partial/header', { 2 | title: '', 3 | bgColor: 'bg-grey' 4 | }) %> 5 | 6 |
7 |
8 |
9 | <% page.posts.forEach(function(post) { %> 10 | <% if (theme.postListSwitch === 'three' || theme.postListSwitch !== 'one') { %> 11 |
12 |
13 |
14 | 15 |
16 | <% if (post.excerpt) { %> 17 |

<%- truncate(strip_html(post.excerpt), { length: 75 }) %>

18 | <% } else { %> 19 |

<%- truncate(strip_html(post.content), { length: 75 }) %>

20 | <% } %> 21 |
22 | 23 |
24 |
25 |
26 |
<%= post.title %>
27 |
28 | <% if (theme.valine.enable && theme.valine.visitor) { %> 29 |
30 | 31 | 0 Views 32 | 33 |
34 | <% } else { %> 35 |
36 | <%= post.date.format('MMM DD, YYYY') %> 37 |
38 | <% } %> 39 |
40 |
41 | <% post.categories.reverse().forEach(function(category) { %> 42 | <%= category.name %> 43 | <% }); %> 44 |
45 |
46 |
47 |
48 |
49 | <% } %> 50 | <% if (theme.postListSwitch == 'one') { %> 51 |
52 |
53 | 54 |
55 | 56 |
57 |
58 | <%= post.title %> 59 |
60 |
61 | <% if (theme.valine.enable && theme.valine.visitor) { %> 62 | 63 | 0 Views 64 | 65 | <% } %> 66 | <% post.categories.forEach(function(category, index) { %><%= category.name %><% if (index !== post.categories.length - 1) { %> / <% } %><% }); %> 67 |
68 |
69 |
70 | <% if (post.excerpt) { %> 71 |

<%- truncate(strip_html(post.excerpt), { length: 150 }) %>

72 | <% } else { %> 73 |

<%- truncate(strip_html(post.content), { length: 150 }) %>

74 | <% } %> 75 |
76 |
77 | <%= __('index.readMore') %> → 78 |
79 |
80 |
81 |
82 | <% } %> 83 | <% }); %> 84 |
85 |
86 | <% if (page.total > 1) { %> 87 |
88 | <%- partial('_partial/pagination') %> 89 |
90 | <% } %> 91 |
92 | 93 | <%- partial('_partial/footer') %> -------------------------------------------------------------------------------- /layout/layout.ejs: -------------------------------------------------------------------------------- 1 | <%- body %> -------------------------------------------------------------------------------- /layout/page.ejs: -------------------------------------------------------------------------------- 1 | <% if (is_current(theme.menu.categories)) { %> 2 | <%- partial('_partial/page-category') %> 3 | <% } else if (is_current(theme.menu.tags)) { %> 4 | <%- partial('_partial/page-tag') %> 5 | <% } else { %> 6 | <%- partial('_partial/page-custom') %> 7 | <% } %> -------------------------------------------------------------------------------- /layout/post.ejs: -------------------------------------------------------------------------------- 1 | <%- partial('_partial/header', { 2 | title: page.title, 3 | bgColor: 'bg-white' 4 | }) %> 5 | 6 | <% if (theme.showPostThumb) { %> 7 | <% if (page.thumb) { %> 8 |
9 |
10 |
11 |
12 |
13 | <%= page.title %> 14 |
15 |
16 | <% if (theme.valine.enable && theme.valine.visitor) { %> 17 | 18 | Views 19 | 20 | <% } %> 21 | 22 | <% page.categories.forEach(function(category, index) { %><%= category.name %><% if (index !== page.categories.length - 1) { %> / <% } %><% }); %> 23 | <% if (theme.valine.enable) { %> 24 | with 25 | <% } %> 26 |
27 |
28 | 本文字数：<%= wordcount(page.content) %> 字 29 | | 30 | 阅读时长 ≈ <%= min2read(page.content) %> min 31 |
32 |
33 | <% if (page.tags.length != 0) { %> 34 | <% page.tags.forEach(function(tag){ %> 35 | <%= tag.name %> 36 | <% }); %> 37 | <% } %> 38 |
39 |
40 |
41 |
42 | <% } else { %> 43 |
44 |
45 |
46 |
47 |
48 | <%= page.title %> 49 |
50 |
51 | <% if (theme.valine.enable && theme.valine.visitor) { %> 52 | 53 | 0 Views 54 | 55 | <% } %> 56 | 57 | <% page.categories.forEach(function(category, index) { %><%= category.name %><% if (index !== page.categories.length - 1) { %> / <% } %><% }); %> 58 | <% if (theme.valine.enable) { %> 59 | with 60 | <% } %> 61 |
62 | 本文字数：<%= wordcount(page.content) %> 字 63 | | 64 | 阅读时长 ≈ <%= min2read(page.content) %> min 65 |
66 |
67 |
68 | <% if (page.tags.length != 0) { %> 69 | <% page.tags.forEach(function(tag){ %> 70 | <%= tag.name %> 71 | <% }); %> 72 | <% } %> 73 |
74 |
75 |
76 |
77 | <% } %> 78 | <% } %> 79 |
80 |
81 |

82 | <%= page.title %> 83 |

84 |
85 | <% if (theme.valine.enable && theme.valine.visitor) { %> 86 | 87 | 0 Views 88 | 89 | <% } %> 90 | <% page.categories.forEach(function(category, index) { %><%= category.name %><% if (index !== page.categories.length - 1) { %> / <% } %><% }); %> 91 | <% if (theme.valine.enable) { %> 92 | with 93 | <% } %> 94 |
95 | 本文字数：<%= wordcount(page.content) %> 字 96 | | 97 | 阅读时长 ≈ <%= min2read(page.content) %> min 98 |
99 |
100 |
101 |
102 |

103 | <% if (page.tags.length != 0) { %> 104 | <% page.tags.forEach(function(tag){ %> 105 | <%= tag.name %> 106 | <% }); %> 107 | <% } %> 108 |

109 | <%- replaceImg(page.content) %> 110 | <% if (theme.reward.enable) { %> 111 |
112 |

<%= theme.reward.text %>

113 | 114 | 124 |
125 | <% } %> 126 | <% if (theme.music.enable) { %> 127 | 134 | 135 | <% } %> 136 |

137 | 本文由 <%= config.author %> 创作，采用 知识共享署名4.0 国际许可协议进行许可
本站文章除注明转载/出处外，均为本站原创或翻译，转载前请务必署名
最后编辑时间为: <%= page.updated.format('MMM DD, YYYY hh:mm a') %> 138 |

139 |
140 |
141 |
142 |
143 | 150 |
151 | <% if (page.prev) { %> 152 | ← 153 | <% } %> 154 | <% if (page.next) { %> 155 | → 156 | <% } %> 157 | ↓ 158 | ↑ 159 |
160 |
161 |
162 | 163 | <% if (theme.relatedPosts.enable && relatedPosts(page, theme.relatedPosts.limit).length != 0) { %> 164 |
165 |
166 |
167 | <% relatedPosts(page, theme.relatedPosts.limit).forEach(function(relatedPost){ %> 168 |
169 |
170 |
171 |
<%= relatedPost.title %>
172 |
173 |
<%= relatedPost.date.format('MMM DD, YYYY') %>
174 |
175 |
176 | <% relatedPost.categories.forEach(function(category) { %> 177 | <%= category.name %> 178 | <% }); %> 179 |
180 |
181 |
182 |
183 |
184 | <% }); %> 185 |
186 |
187 |
188 | <% } %> 189 | 190 | <% if (theme.valine.enable) { %> 191 |
192 |
193 |
194 | <% } %> 195 | 196 | <%- partial('_partial/footer') %> -------------------------------------------------------------------------------- /layout/tag.ejs: -------------------------------------------------------------------------------- 1 | <%- partial('_partial/header', { 2 | title: page.tag, 3 | bgColor: theme.colorBgPosts ? 'bg-white' : 'bg-grey' 4 | }) %> 5 | 6 | <%- partial('_partial/page-archive') %> 7 | 8 | <%- partial('_partial/footer') %> -------------------------------------------------------------------------------- /scripts/getPostBgColor.js: -------------------------------------------------------------------------------- 1 | const arr = [ 'blue', 'purple', 'green', 'yellow', 'red', 'orange' ]; 2 | 3 | var getPostBgColor = function(colorBgPosts, color, defaultColor = 'deepgrey') { 4 | if (colorBgPosts) { 5 | if (arr.indexOf(color) >= 0) { 6 | return `bg-${color}`; 7 | } 8 | return 'bg-' + randBgColor(); 9 | } 10 | return 'bg-' + defaultColor; 11 | }; 12 | 13 | function randBgColor() { 14 | return arr[randomInt(0, 5)]; 15 | } 16 | 17 | function randomInt(min, max) { 18 | return Math.round(Math.random() * (max - min)) + min; 19 | } 20 | 21 | hexo.extend.helper.register('getPostBgColor', getPostBgColor); -------------------------------------------------------------------------------- /scripts/getPostIcon.js: -------------------------------------------------------------------------------- 1 | const arr = ['book', 'game', 'note', 'chat', 'code', 'image', 'web', 'link', 'design', 'lock']; 2 | 3 | var getPostIcon = function (icon) { 4 | if (arr.indexOf(icon) >= 0) { 5 | return 'bg-ico-' + icon; 6 | } 7 | return 'bg-ico-' + randBgIco(); 8 | }; 9 | 10 | function randBgIco() { 11 | return arr[randomInt(0, 9)]; 12 | } 13 | 14 | function randomInt(min, max) { 15 | return Math.round(Math.random() * (max - min)) + min; 16 | } 17 | 18 | hexo.extend.helper.register('getPostIcon', getPostIcon); -------------------------------------------------------------------------------- /scripts/getPostThumb.js: -------------------------------------------------------------------------------- 1 | const getPostThumb = function(post, theme) { 2 | // 1. 填写了thumb字段 3 | if (post.thumb && validUrl(post.thumb)) { // 填写了thumb字段且字段地址合法 4 | return post.thumb; 5 | } 6 | 7 | // url不合法 => 2 8 | 9 | // 2. 如果没有填写thumb字段，或者thumb字段不合法，则取文章内容中寻找是否有图片，如果有，且图片地址合法，则使用第一张 10 | if (getFirstImgSrc(post.content)) { 11 | return getFirstImgSrc(post.content); 12 | } 13 | 14 | // 如果文章内没有图片，或者有图片，但是地址不合法 => 3 15 | 16 | // 3. 如果文章内也没有图片，且启用了默认缩略图，且默认缩略图合法，则使用默认缩略图 17 | if (theme.defaultThumb && validUrl(theme.defaultThumb)) { 18 | return theme.defaultThumb; 19 | } 20 | 21 | // 4. 如果没有开启默认缩略图或者默认缩略图地址不合法，且开启了随机缩略图选项，则使用/images/thumbs/下的初始默认随机图片，否则为空 22 | return randPostThumb(theme); 23 | } 24 | 25 | // 获取随机的默认缩略图 26 | function randPostThumb(theme) { 27 | if (theme.randomThumb === 0) { 28 | return ""; 29 | } else { 30 | const prefix = '/images/thumbs/'; 31 | const number = theme.randomThumb && typeof theme.randomThumb === 'number' ? theme.randomThumb : 18; 32 | return prefix + randomInt(1, number) + '.jpg'; 33 | } 34 | }; 35 | 36 | // 校验url是否是合法，可以是外链，要符合http(s)开头，也可以是source内/images/下的以（jpg | png | jpeg |webp）结尾的图片 37 | function validUrl(url) { 38 | const regUrl = /^https?:\/\/(([a-zA-Z0-9_-])+(\.)?)*(:\d+)?(\/((\.)?(\?)?=?&?[a-zA-Z0-9_-](\?)?)*)*\.{1}(png|jpg|jpeg|webp)$/i; 39 | const regFolder = /^\/images\/.+\.{1}(png|jpg|jpeg|webp)$/i 40 | return regUrl.test(url) || regFolder.test(url); 41 | } 42 | 43 | function randomInt(min, max) { 44 | return Math.round(Math.random() * (max - min)) + min; 45 | } 46 | 47 | // 获取文章内容中第一张图片的src 48 | function getFirstImgSrc(text) { 49 | const reg = /src=[\'\"]?([^\'\"]*)[\'\"]?/i; 50 | return text.match(reg) && text.match(reg)[1] && validUrl(text.match(reg)[1]) && text.match(reg)[1] || false; 51 | } 52 | 53 | hexo.extend.helper.register('getPostThumb', getPostThumb); -------------------------------------------------------------------------------- /scripts/monthArchivePosts.js: -------------------------------------------------------------------------------- 1 | var monthArchivePosts = function(posts) { 2 | if (posts.count() === 0) return []; 3 | let res = []; 4 | let list = []; 5 | let year, month; 6 | posts.forEach((post, index) => { 7 | const _year = post.date.format('YYYY'); 8 | const _month = post.date.format('MMM'); 9 | 10 | if (!year) year = _year; // 初始化第一年 11 | if (!month) month = _month; // 初始化第一个月 12 | 13 | if (_year === year && _month === month) { // 如果年份和月份还满足前一个条件，则push进去 14 | list.push(post); 15 | } else if (_month !== month) { // 如果月份已经改变 16 | // 将上一个月份的list放到回显数据中 17 | res.push({ 18 | title: month + ' ' + year, 19 | list: list 20 | }) 21 | 22 | // 改变新年份，清空文章列表，并将当前文章push进去作为第一个文章 23 | year = _year; 24 | month = _month; 25 | list = []; 26 | list.push(post); 27 | } 28 | 29 | // 如果是最后一篇了，则push到回显数据中 30 | if (index === posts.count() - 1) { 31 | res.push({ 32 | title: month + ' ' + year, 33 | list: list 34 | }); 35 | } 36 | }) 37 | return res; 38 | } 39 | 40 | hexo.extend.helper.register('monthArchivePosts', monthArchivePosts); -------------------------------------------------------------------------------- /scripts/randPostThumb.js: -------------------------------------------------------------------------------- 1 | var randPostThumb = function() { 2 | const prefix = '/images/thumbs/'; 3 | return prefix + randomInt(0, 9) + '.jpg'; 4 | }; 5 | 6 | function randomInt(min, max) { 7 | return Math.round(Math.random() * (max - min)) + min; 8 | } 9 | 10 | hexo.extend.helper.register('randPostThumb', randPostThumb); -------------------------------------------------------------------------------- /scripts/relatedPosts.js: -------------------------------------------------------------------------------- 1 | var relatedPosts = function(page, limit) { 2 | var res = []; 3 | page.tags.forEach(function(tag) { 4 | tag.posts.forEach(function(post) { 5 | // 结果数组中不存在且不是当前文章 6 | if (!isExist(post, res) && post._id !== page._id) { 7 | res.push(post); 8 | } 9 | }) 10 | }) 11 | return sort(res, 'date', 'desc').slice(0, limit); 12 | } 13 | 14 | /** 15 | * 判断指定是否在文章列表中 16 | * @param {*} post 17 | * @param {*} posts 18 | */ 19 | function isExist(post, posts) { 20 | return posts.some(function(item) { 21 | return item._id == post._id; 22 | }) 23 | } 24 | 25 | /** 26 | * 数组根据指定key排序 27 | * @param {*} arr 28 | * @param {*} key 29 | * @param {*} sort 30 | */ 31 | function sort(arr, key, sort) { 32 | return arr.sort(function(a, b) { 33 | return sort === 'asc' ? a[key] - b[key] : b[key] - a[key]; 34 | }) 35 | } 36 | 37 | hexo.extend.helper.register('relatedPosts', relatedPosts); -------------------------------------------------------------------------------- /scripts/replaceImg.js: -------------------------------------------------------------------------------- 1 | var replaceImg = function(content) { 2 | // 3 | const reg = //g; 4 | content = content.replace(reg, ''); 5 | return content; 6 | }; 7 | 8 | hexo.extend.helper.register('replaceImg', replaceImg); -------------------------------------------------------------------------------- /scripts/yearArchivePosts.js: -------------------------------------------------------------------------------- 1 | var yearArchivePosts = function(posts) { 2 | if (posts.count() === 0) return []; 3 | let res = []; 4 | let list = []; 5 | let year; 6 | posts.forEach((post, index) => { 7 | const _year = post.date.format('YYYY'); 8 | 9 | if (!year) year = _year; // 初始化第一年 10 | 11 | if (_year === year) { // 如果年份还属于当前列表的年份，则push进去 12 | list.push(post); 13 | } else { // 如果年份已经改变 14 | // 将上一个年份的list放到回显数据中 15 | res.push({ 16 | title: year, 17 | list: list 18 | }) 19 | 20 | // 改变新年份，清空文章列表，并将当前文章push进去作为第一个文章 21 | year = _year; 22 | list = []; 23 | list.push(post); 24 | } 25 | 26 | // 如果是最后一篇了，则push到回显数据中 27 | if (index === posts.count() - 1) { 28 | res.push({ 29 | title: year, 30 | list: list 31 | }); 32 | } 33 | }) 34 | return res; 35 | } 36 | 37 | hexo.extend.helper.register('yearArchivePosts', yearArchivePosts); -------------------------------------------------------------------------------- /source/404.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | Nothing here 11 | 121 | 122 | 123 |
124 |
125 |
126 |
404
127 |
128 |
129 |
130 |

I have no secret of success but hard work.

131 |
Back Home 132 |
133 |
134 |
135 | 136 | -------------------------------------------------------------------------------- /source/images/alipay.JPG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cccyb/hexo-theme-pinghsu/2701903d081a98c84789fffbff2d093cf39b577b/source/images/alipay.JPG -------------------------------------------------------------------------------- /source/images/apple-touch-icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cccyb/hexo-theme-pinghsu/2701903d081a98c84789fffbff2d093cf39b577b/source/images/apple-touch-icon.png -------------------------------------------------------------------------------- /source/images/bg-ico.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cccyb/hexo-theme-pinghsu/2701903d081a98c84789fffbff2d093cf39b577b/source/images/bg-ico.png -------------------------------------------------------------------------------- /source/images/favicon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cccyb/hexo-theme-pinghsu/2701903d081a98c84789fffbff2d093cf39b577b/source/images/favicon.png -------------------------------------------------------------------------------- /source/images/logo-hsuping.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cccyb/hexo-theme-pinghsu/2701903d081a98c84789fffbff2d093cf39b577b/source/images/logo-hsuping.png -------------------------------------------------------------------------------- /source/images/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cccyb/hexo-theme-pinghsu/2701903d081a98c84789fffbff2d093cf39b577b/source/images/logo.png -------------------------------------------------------------------------------- /source/images/thumbs/1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cccyb/hexo-theme-pinghsu/2701903d081a98c84789fffbff2d093cf39b577b/source/images/thumbs/1.jpg -------------------------------------------------------------------------------- /source/images/thumbs/10.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cccyb/hexo-theme-pinghsu/2701903d081a98c84789fffbff2d093cf39b577b/source/images/thumbs/10.jpg -------------------------------------------------------------------------------- /source/images/thumbs/11.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cccyb/hexo-theme-pinghsu/2701903d081a98c84789fffbff2d093cf39b577b/source/images/thumbs/11.jpg -------------------------------------------------------------------------------- /source/images/thumbs/12.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cccyb/hexo-theme-pinghsu/2701903d081a98c84789fffbff2d093cf39b577b/source/images/thumbs/12.jpg -------------------------------------------------------------------------------- /source/images/thumbs/13.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cccyb/hexo-theme-pinghsu/2701903d081a98c84789fffbff2d093cf39b577b/source/images/thumbs/13.jpg -------------------------------------------------------------------------------- /source/images/thumbs/14.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cccyb/hexo-theme-pinghsu/2701903d081a98c84789fffbff2d093cf39b577b/source/images/thumbs/14.jpg -------------------------------------------------------------------------------- /source/images/thumbs/15.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cccyb/hexo-theme-pinghsu/2701903d081a98c84789fffbff2d093cf39b577b/source/images/thumbs/15.jpg -------------------------------------------------------------------------------- /source/images/thumbs/16.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cccyb/hexo-theme-pinghsu/2701903d081a98c84789fffbff2d093cf39b577b/source/images/thumbs/16.jpg -------------------------------------------------------------------------------- /source/images/thumbs/17.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cccyb/hexo-theme-pinghsu/2701903d081a98c84789fffbff2d093cf39b577b/source/images/thumbs/17.jpg -------------------------------------------------------------------------------- /source/images/thumbs/18.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cccyb/hexo-theme-pinghsu/2701903d081a98c84789fffbff2d093cf39b577b/source/images/thumbs/18.jpg -------------------------------------------------------------------------------- /source/images/thumbs/2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cccyb/hexo-theme-pinghsu/2701903d081a98c84789fffbff2d093cf39b577b/source/images/thumbs/2.jpg -------------------------------------------------------------------------------- /source/images/thumbs/3.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cccyb/hexo-theme-pinghsu/2701903d081a98c84789fffbff2d093cf39b577b/source/images/thumbs/3.jpg -------------------------------------------------------------------------------- /source/images/thumbs/4.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cccyb/hexo-theme-pinghsu/2701903d081a98c84789fffbff2d093cf39b577b/source/images/thumbs/4.jpg -------------------------------------------------------------------------------- /source/images/thumbs/5.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cccyb/hexo-theme-pinghsu/2701903d081a98c84789fffbff2d093cf39b577b/source/images/thumbs/5.jpg -------------------------------------------------------------------------------- /source/images/thumbs/6.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cccyb/hexo-theme-pinghsu/2701903d081a98c84789fffbff2d093cf39b577b/source/images/thumbs/6.jpg -------------------------------------------------------------------------------- /source/images/thumbs/7.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cccyb/hexo-theme-pinghsu/2701903d081a98c84789fffbff2d093cf39b577b/source/images/thumbs/7.jpg -------------------------------------------------------------------------------- /source/images/thumbs/8.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cccyb/hexo-theme-pinghsu/2701903d081a98c84789fffbff2d093cf39b577b/source/images/thumbs/8.jpg -------------------------------------------------------------------------------- /source/images/thumbs/9.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cccyb/hexo-theme-pinghsu/2701903d081a98c84789fffbff2d093cf39b577b/source/images/thumbs/9.jpg -------------------------------------------------------------------------------- /source/images/wechat.JPG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cccyb/hexo-theme-pinghsu/2701903d081a98c84789fffbff2d093cf39b577b/source/images/wechat.JPG -------------------------------------------------------------------------------- /source/js/instantclick.js: -------------------------------------------------------------------------------- 1 | /* InstantClick 3.1.0 | (C) 2014 Alexandre Dieulot | http://instantclick.io/license */ 2 | 3 | var InstantClick = function(document, location) { 4 | // Internal variables 5 | var $ua = navigator.userAgent, 6 | $isChromeForIOS = $ua.indexOf(' CriOS/') > -1, 7 | $hasTouch = 'createTouch' in document, 8 | $currentLocationWithoutHash, 9 | $urlToPreload, 10 | $preloadTimer, 11 | $lastTouchTimestamp, 12 | 13 | // Preloading-related variables 14 | $history = {}, 15 | $xhr, 16 | $url = false, 17 | $title = false, 18 | $mustRedirect = false, 19 | $body = false, 20 | $timing = {}, 21 | $isPreloading = false, 22 | $isWaitingForCompletion = false, 23 | $trackedAssets = [], 24 | 25 | // Variables defined by public functions 26 | $useWhitelist, 27 | $preloadOnMousedown, 28 | $delayBeforePreload, 29 | $eventsCallbacks = { 30 | fetch: [], 31 | receive: [], 32 | wait: [], 33 | change: [] 34 | } 35 | 36 | 37 | ////////// HELPERS ////////// 38 | 39 | 40 | function removeHash(url) { 41 | var index = url.indexOf('#') 42 | if (index < 0) { 43 | return url 44 | } 45 | return url.substr(0, index) 46 | } 47 | 48 | function getLinkTarget(target) { 49 | while (target && target.nodeName != 'A') { 50 | target = target.parentNode 51 | } 52 | return target 53 | } 54 | 55 | function isBlacklisted(elem) { 56 | do { 57 | if (!elem.hasAttribute) { // Parent of 58 | break 59 | } 60 | if (elem.hasAttribute('data-instant')) { 61 | return false 62 | } 63 | if (elem.hasAttribute('data-no-instant')) { 64 | return true 65 | } 66 | } 67 | while (elem = elem.parentNode); 68 | return false 69 | } 70 | 71 | function isWhitelisted(elem) { 72 | do { 73 | if (!elem.hasAttribute) { // Parent of 74 | break 75 | } 76 | if (elem.hasAttribute('data-no-instant')) { 77 | return false 78 | } 79 | if (elem.hasAttribute('data-instant')) { 80 | return true 81 | } 82 | } 83 | while (elem = elem.parentNode); 84 | return false 85 | } 86 | 87 | function isPreloadable(a) { 88 | var domain = location.protocol + '//' + location.host 89 | 90 | if (a.target // target="_blank" etc. 91 | || a.hasAttribute('download') 92 | || a.href.indexOf(domain + '/') != 0 // Another domain, or no href attribute 93 | || (a.href.indexOf('#') > -1 94 | && removeHash(a.href) == $currentLocationWithoutHash) // Anchor 95 | || ($useWhitelist 96 | ? !isWhitelisted(a) 97 | : isBlacklisted(a)) 98 | ) { 99 | return false 100 | } 101 | return true 102 | } 103 | 104 | function triggerPageEvent(eventType, arg1, arg2, arg3) { 105 | var returnValue = false 106 | for (var i = 0; i < $eventsCallbacks[eventType].length; i++) { 107 | if (eventType == 'receive') { 108 | var altered = $eventsCallbacks[eventType][i](arg1, arg2, arg3) 109 | if (altered) { 110 | /* Update args for the next iteration of the loop. */ 111 | if ('body' in altered) { 112 | arg2 = altered.body 113 | } 114 | if ('title' in altered) { 115 | arg3 = altered.title 116 | } 117 | 118 | returnValue = altered 119 | } 120 | } 121 | else { 122 | $eventsCallbacks[eventType][i](arg1, arg2, arg3) 123 | } 124 | } 125 | return returnValue 126 | } 127 | 128 | function changePage(title, body, newUrl, scrollY) { 129 | document.documentElement.replaceChild(body, document.body) 130 | /* We cannot just use `document.body = doc.body`, it causes Safari (tested 131 | 5.1, 6.0 and Mobile 7.0) to execute script tags directly. 132 | */ 133 | 134 | if (newUrl) { 135 | history.pushState(null, null, newUrl) 136 | 137 | var hashIndex = newUrl.indexOf('#'), 138 | hashElem = hashIndex > -1 139 | && document.getElementById(newUrl.substr(hashIndex + 1)), 140 | offset = 0 141 | 142 | if (hashElem) { 143 | while (hashElem.offsetParent) { 144 | offset += hashElem.offsetTop 145 | 146 | hashElem = hashElem.offsetParent 147 | } 148 | } 149 | scrollTo(0, offset) 150 | 151 | $currentLocationWithoutHash = removeHash(newUrl) 152 | } 153 | else { 154 | scrollTo(0, scrollY) 155 | } 156 | 157 | if ($isChromeForIOS && document.title == title) { 158 | /* Chrome for iOS: 159 | * 160 | * 1. Removes title on pushState, so the title needs to be set after. 161 | * 162 | * 2. Will not set the title if it’s identical when trimmed, so 163 | * appending a space won't do, but a non-breaking space works. 164 | */ 165 | document.title = title + String.fromCharCode(160) 166 | } 167 | else { 168 | document.title = title 169 | } 170 | 171 | instantanize() 172 | bar.done() 173 | triggerPageEvent('change', false) 174 | 175 | // Real event, useful for combining userscripts, but only for that so it’s undocumented. 176 | var userscriptEvent = document.createEvent('HTMLEvents') 177 | userscriptEvent.initEvent('instantclick:newpage', true, true) 178 | dispatchEvent(userscriptEvent) 179 | } 180 | 181 | function setPreloadingAsHalted() { 182 | $isPreloading = false 183 | $isWaitingForCompletion = false 184 | } 185 | 186 | function removeNoscriptTags(html) { 187 | /* Must be done on text, not on a node's innerHTML, otherwise strange 188 | * things happen with implicitly closed elements (see the Noscript test). 189 | */ 190 | return html.replace(//gi, '') 191 | } 192 | 193 | 194 | ////////// EVENT HANDLERS ////////// 195 | 196 | 197 | function mousedown(e) { 198 | if ($lastTouchTimestamp > (+new Date - 500)) { 199 | return // Otherwise, click doesn’t fire 200 | } 201 | 202 | var a = getLinkTarget(e.target) 203 | 204 | if (!a || !isPreloadable(a)) { 205 | return 206 | } 207 | 208 | preload(a.href) 209 | } 210 | 211 | function mouseover(e) { 212 | if ($lastTouchTimestamp > (+new Date - 500)) { 213 | return // Otherwise, click doesn’t fire 214 | } 215 | 216 | var a = getLinkTarget(e.target) 217 | 218 | if (!a || !isPreloadable(a)) { 219 | return 220 | } 221 | 222 | a.addEventListener('mouseout', mouseout) 223 | 224 | if (!$delayBeforePreload) { 225 | preload(a.href) 226 | } 227 | else { 228 | $urlToPreload = a.href 229 | $preloadTimer = setTimeout(preload, $delayBeforePreload) 230 | } 231 | } 232 | 233 | function touchstart(e) { 234 | $lastTouchTimestamp = +new Date 235 | 236 | var a = getLinkTarget(e.target) 237 | 238 | if (!a || !isPreloadable(a)) { 239 | return 240 | } 241 | 242 | if ($preloadOnMousedown) { 243 | a.removeEventListener('mousedown', mousedown) 244 | } 245 | else { 246 | a.removeEventListener('mouseover', mouseover) 247 | } 248 | preload(a.href) 249 | } 250 | 251 | function click(e) { 252 | var a = getLinkTarget(e.target) 253 | 254 | if (!a || !isPreloadable(a)) { 255 | return 256 | } 257 | 258 | if (e.which > 1 || e.metaKey || e.ctrlKey) { // Opening in new tab 259 | return 260 | } 261 | e.preventDefault() 262 | display(a.href) 263 | } 264 | 265 | function mouseout() { 266 | if ($preloadTimer) { 267 | clearTimeout($preloadTimer) 268 | $preloadTimer = false 269 | return 270 | } 271 | 272 | if (!$isPreloading || $isWaitingForCompletion) { 273 | return 274 | } 275 | $xhr.abort() 276 | setPreloadingAsHalted() 277 | } 278 | 279 | function readystatechange() { 280 | if ($xhr.readyState < 4) { 281 | return 282 | } 283 | if ($xhr.status == 0) { 284 | /* Request aborted */ 285 | return 286 | } 287 | 288 | $timing.ready = +new Date - $timing.start 289 | 290 | if ($xhr.getResponseHeader('Content-Type').match(/\/(x|ht|xht)ml/)) { 291 | var doc = document.implementation.createHTMLDocument('') 292 | doc.documentElement.innerHTML = removeNoscriptTags($xhr.responseText) 293 | $title = doc.title 294 | $body = doc.body 295 | 296 | var alteredOnReceive = triggerPageEvent('receive', $url, $body, $title) 297 | if (alteredOnReceive) { 298 | if ('body' in alteredOnReceive) { 299 | $body = alteredOnReceive.body 300 | } 301 | if ('title' in alteredOnReceive) { 302 | $title = alteredOnReceive.title 303 | } 304 | } 305 | 306 | var urlWithoutHash = removeHash($url) 307 | $history[urlWithoutHash] = { 308 | body: $body, 309 | title: $title, 310 | scrollY: urlWithoutHash in $history ? $history[urlWithoutHash].scrollY : 0 311 | } 312 | 313 | var elems = doc.head.children, 314 | found = 0, 315 | elem, 316 | data 317 | 318 | for (var i = elems.length - 1; i >= 0; i--) { 319 | elem = elems[i] 320 | if (elem.hasAttribute('data-instant-track')) { 321 | data = elem.getAttribute('href') || elem.getAttribute('src') || elem.innerHTML 322 | for (var j = $trackedAssets.length - 1; j >= 0; j--) { 323 | if ($trackedAssets[j] == data) { 324 | found++ 325 | } 326 | } 327 | } 328 | } 329 | if (found != $trackedAssets.length) { 330 | $mustRedirect = true // Assets have changed 331 | } 332 | } 333 | else { 334 | $mustRedirect = true // Not an HTML document 335 | } 336 | 337 | if ($isWaitingForCompletion) { 338 | $isWaitingForCompletion = false 339 | display($url) 340 | } 341 | } 342 | 343 | 344 | ////////// MAIN FUNCTIONS ////////// 345 | 346 | 347 | function instantanize(isInitializing) { 348 | document.body.addEventListener('touchstart', touchstart, true) 349 | if ($preloadOnMousedown) { 350 | document.body.addEventListener('mousedown', mousedown, true) 351 | } 352 | else { 353 | document.body.addEventListener('mouseover', mouseover, true) 354 | } 355 | document.body.addEventListener('click', click, true) 356 | 357 | if (!isInitializing) { 358 | var scripts = document.body.getElementsByTagName('script'), 359 | script, 360 | copy, 361 | parentNode, 362 | nextSibling 363 | 364 | for (i = 0, j = scripts.length; i < j; i++) { 365 | script = scripts[i] 366 | if (script.hasAttribute('data-no-instant')) { 367 | continue 368 | } 369 | copy = document.createElement('script') 370 | if (script.src) { 371 | copy.src = script.src 372 | } 373 | if (script.innerHTML) { 374 | copy.innerHTML = script.innerHTML 375 | } 376 | parentNode = script.parentNode 377 | nextSibling = script.nextSibling 378 | parentNode.removeChild(script) 379 | parentNode.insertBefore(copy, nextSibling) 380 | } 381 | } 382 | } 383 | 384 | function preload(url) { 385 | if (!$preloadOnMousedown 386 | && 'display' in $timing 387 | && +new Date - ($timing.start + $timing.display) < 100) { 388 | /* After a page is displayed, if the user's cursor happens to be above 389 | a link a mouseover event will be in most browsers triggered 390 | automatically, and in other browsers it will be triggered when the 391 | user moves his mouse by 1px. 392 | 393 | Here are the behavior I noticed, all on Windows: 394 | - Safari 5.1: auto-triggers after 0 ms 395 | - IE 11: auto-triggers after 30-80 ms (depends on page's size?) 396 | - Firefox: auto-triggers after 10 ms 397 | - Opera 18: auto-triggers after 10 ms 398 | 399 | - Chrome: triggers when cursor moved 400 | - Opera 12.16: triggers when cursor moved 401 | 402 | To remedy to this, we do not start preloading if last display 403 | occurred less than 100 ms ago. If they happen to click on the link, 404 | they will be redirected. 405 | */ 406 | 407 | return 408 | } 409 | if ($preloadTimer) { 410 | clearTimeout($preloadTimer) 411 | $preloadTimer = false 412 | } 413 | 414 | if (!url) { 415 | url = $urlToPreload 416 | } 417 | 418 | if ($isPreloading && (url == $url || $isWaitingForCompletion)) { 419 | return 420 | } 421 | $isPreloading = true 422 | $isWaitingForCompletion = false 423 | 424 | $url = url 425 | $body = false 426 | $mustRedirect = false 427 | $timing = { 428 | start: +new Date 429 | } 430 | triggerPageEvent('fetch') 431 | $xhr.open('GET', url) 432 | $xhr.send() 433 | } 434 | 435 | function display(url) { 436 | if (!('display' in $timing)) { 437 | $timing.display = +new Date - $timing.start 438 | } 439 | if ($preloadTimer || !$isPreloading) { 440 | /* $preloadTimer: 441 | Happens when there’s a delay before preloading and that delay 442 | hasn't expired (preloading didn't kick in). 443 | 444 | !$isPreloading: 445 | A link has been clicked, and preloading hasn’t been initiated. 446 | It happens with touch devices when a user taps *near* the link, 447 | Safari/Chrome will trigger mousedown, mouseover, click (and others), 448 | but when that happens we ignore mousedown/mouseover (otherwise click 449 | doesn’t fire). Maybe there’s a way to make the click event fire, but 450 | that’s not worth it as mousedown/over happen just 1ms before click 451 | in this situation. 452 | 453 | It also happens when a user uses his keyboard to navigate (with Tab 454 | and Return), and possibly in other non-mainstream ways to navigate 455 | a website. 456 | */ 457 | 458 | if ($preloadTimer && $url && $url != url) { 459 | /* Happens when the user clicks on a link before preloading 460 | kicks in while another link is already preloading. 461 | */ 462 | 463 | location.href = url 464 | return 465 | } 466 | 467 | preload(url) 468 | bar.start(0, true) 469 | triggerPageEvent('wait') 470 | $isWaitingForCompletion = true // Must be set *after* calling `preload` 471 | return 472 | } 473 | if ($isWaitingForCompletion) { 474 | /* The user clicked on a link while a page was preloading. Either on 475 | the same link or on another link. If it's the same link something 476 | might have gone wrong (or he could have double clicked, we don’t 477 | handle that case), so we send him to the page without pjax. 478 | If it's another link, it hasn't been preloaded, so we redirect the 479 | user to it. 480 | */ 481 | location.href = url 482 | return 483 | } 484 | if ($mustRedirect) { 485 | location.href = $url 486 | return 487 | } 488 | if (!$body) { 489 | bar.start(0, true) 490 | triggerPageEvent('wait') 491 | $isWaitingForCompletion = true 492 | return 493 | } 494 | $history[$currentLocationWithoutHash].scrollY = pageYOffset 495 | setPreloadingAsHalted() 496 | changePage($title, $body, $url) 497 | } 498 | 499 | 500 | ////////// PROGRESS BAR FUNCTIONS ////////// 501 | 502 | 503 | var bar = function() { 504 | var $barContainer, 505 | $barElement, 506 | $barTransformProperty, 507 | $barProgress, 508 | $barTimer 509 | 510 | function init() { 511 | $barContainer = document.createElement('div') 512 | $barContainer.id = 'instantclick' 513 | $barElement = document.createElement('div') 514 | $barElement.id = 'instantclick-bar' 515 | $barElement.className = 'instantclick-bar' 516 | $barContainer.appendChild($barElement) 517 | 518 | var vendors = ['Webkit', 'Moz', 'O'] 519 | 520 | $barTransformProperty = 'transform' 521 | if (!($barTransformProperty in $barElement.style)) { 522 | for (var i = 0; i < 3; i++) { 523 | if (vendors[i] + 'Transform' in $barElement.style) { 524 | $barTransformProperty = vendors[i] + 'Transform' 525 | } 526 | } 527 | } 528 | 529 | var transitionProperty = 'transition' 530 | if (!(transitionProperty in $barElement.style)) { 531 | for (var i = 0; i < 3; i++) { 532 | if (vendors[i] + 'Transition' in $barElement.style) { 533 | transitionProperty = '-' + vendors[i].toLowerCase() + '-' + transitionProperty 534 | } 535 | } 536 | } 537 | 538 | var style = document.createElement('style') 539 | style.innerHTML = '#instantclick{position:' + ($hasTouch ? 'absolute' : 'fixed') + ';top:0;left:0;width:100%;pointer-events:none;z-index:2147483647;' + transitionProperty + ':opacity .25s .1s}' 540 | + '.instantclick-bar{background:#29d;width:100%;margin-left:-100%;height:2px;' + transitionProperty + ':all .25s}' 541 | /* We set the bar's background in `.instantclick-bar` so that it can be 542 | overriden in CSS with `#instantclick-bar`, as IDs have higher priority. 543 | */ 544 | document.head.appendChild(style) 545 | 546 | if ($hasTouch) { 547 | updatePositionAndScale() 548 | addEventListener('resize', updatePositionAndScale) 549 | addEventListener('scroll', updatePositionAndScale) 550 | } 551 | 552 | } 553 | 554 | function start(at, jump) { 555 | $barProgress = at 556 | if (document.getElementById($barContainer.id)) { 557 | document.body.removeChild($barContainer) 558 | } 559 | $barContainer.style.opacity = '1' 560 | if (document.getElementById($barContainer.id)) { 561 | document.body.removeChild($barContainer) 562 | /* So there's no CSS animation if already done once and it goes from 1 to 0 */ 563 | } 564 | update() 565 | if (jump) { 566 | setTimeout(jumpStart, 0) 567 | /* Must be done in a timer, otherwise the CSS animation doesn't happen. */ 568 | } 569 | clearTimeout($barTimer) 570 | $barTimer = setTimeout(inc, 500) 571 | } 572 | 573 | function jumpStart() { 574 | $barProgress = 10 575 | update() 576 | } 577 | 578 | function inc() { 579 | $barProgress += 1 + (Math.random() * 2) 580 | if ($barProgress >= 98) { 581 | $barProgress = 98 582 | } 583 | else { 584 | $barTimer = setTimeout(inc, 500) 585 | } 586 | update() 587 | } 588 | 589 | function update() { 590 | $barElement.style[$barTransformProperty] = 'translate(' + $barProgress + '%)' 591 | if (!document.getElementById($barContainer.id)) { 592 | document.body.appendChild($barContainer) 593 | } 594 | } 595 | 596 | function done() { 597 | if (document.getElementById($barContainer.id)) { 598 | clearTimeout($barTimer) 599 | $barProgress = 100 600 | update() 601 | $barContainer.style.opacity = '0' 602 | /* If you're debugging, setting this to 0.5 is handy. */ 603 | return 604 | } 605 | 606 | /* The bar container hasn't been appended: It's a new page. */ 607 | start($barProgress == 100 ? 0 : $barProgress) 608 | /* $barProgress is 100 on popstate, usually. */ 609 | setTimeout(done, 0) 610 | /* Must be done in a timer, otherwise the CSS animation doesn't happen. */ 611 | } 612 | 613 | function updatePositionAndScale() { 614 | /* Adapted from code by Sam Stephenson and Mislav Marohnić 615 | http://signalvnoise.com/posts/2407 616 | */ 617 | 618 | $barContainer.style.left = pageXOffset + 'px' 619 | $barContainer.style.width = innerWidth + 'px' 620 | $barContainer.style.top = pageYOffset + 'px' 621 | 622 | var landscape = 'orientation' in window && Math.abs(orientation) == 90, 623 | scaleY = innerWidth / screen[landscape ? 'height' : 'width'] * 2 624 | /* We multiply the size by 2 because the progress bar is harder 625 | to notice on a mobile device. 626 | */ 627 | $barContainer.style[$barTransformProperty] = 'scaleY(' + scaleY + ')' 628 | } 629 | 630 | return { 631 | init: init, 632 | start: start, 633 | done: done 634 | } 635 | }() 636 | 637 | 638 | ////////// PUBLIC VARIABLE AND FUNCTIONS ////////// 639 | 640 | var supported = 'pushState' in history 641 | && (!$ua.match('Android') || $ua.match('Chrome/')) 642 | && location.protocol != "file:" 643 | 644 | /* The state of Android's AOSP browsers: 645 | 646 | 2.3.7: pushState appears to work correctly, but 647 | `doc.documentElement.innerHTML = body` is buggy. 648 | See details here: http://stackoverflow.com/q/21918564 649 | Not an issue anymore, but it may fail where 3.0 do, this needs 650 | testing again. 651 | 652 | 3.0: pushState appears to work correctly (though the URL bar is only 653 | updated on focus), but 654 | `document.documentElement.replaceChild(doc.body, document.body)` 655 | throws DOMException: WRONG_DOCUMENT_ERR. 656 | 657 | 4.0.2: Doesn't support pushState. 658 | 659 | 4.0.4, 660 | 4.1.1, 661 | 4.2, 662 | 4.3: pushState is here, but it doesn't update the URL bar. 663 | (Great logic there.) 664 | 665 | 4.4: Works correctly. Claims to be 'Chrome/30.0.0.0'. 666 | 667 | All androids tested with Android SDK's Emulator. 668 | Version numbers are from the browser's user agent. 669 | 670 | Because of this mess, the only whitelisted browser on Android is Chrome. 671 | */ 672 | 673 | function init() { 674 | if ($currentLocationWithoutHash) { 675 | /* Already initialized */ 676 | return 677 | } 678 | if (!supported) { 679 | triggerPageEvent('change', true) 680 | return 681 | } 682 | for (var i = arguments.length - 1; i >= 0; i--) { 683 | var arg = arguments[i] 684 | if (arg === true) { 685 | $useWhitelist = true 686 | } 687 | else if (arg == 'mousedown') { 688 | $preloadOnMousedown = true 689 | } 690 | else if (typeof arg == 'number') { 691 | $delayBeforePreload = arg 692 | } 693 | } 694 | $currentLocationWithoutHash = removeHash(location.href) 695 | $history[$currentLocationWithoutHash] = { 696 | body: document.body, 697 | title: document.title, 698 | scrollY: pageYOffset 699 | } 700 | 701 | var elems = document.head.children, 702 | elem, 703 | data 704 | for (var i = elems.length - 1; i >= 0; i--) { 705 | elem = elems[i] 706 | if (elem.hasAttribute('data-instant-track')) { 707 | data = elem.getAttribute('href') || elem.getAttribute('src') || elem.innerHTML 708 | /* We can't use just `elem.href` and `elem.src` because we can't 709 | retrieve `href`s and `src`s from the Ajax response. 710 | */ 711 | $trackedAssets.push(data) 712 | } 713 | } 714 | 715 | $xhr = new XMLHttpRequest() 716 | $xhr.addEventListener('readystatechange', readystatechange) 717 | 718 | instantanize(true) 719 | 720 | bar.init() 721 | 722 | triggerPageEvent('change', true) 723 | 724 | addEventListener('popstate', function() { 725 | var loc = removeHash(location.href) 726 | if (loc == $currentLocationWithoutHash) { 727 | return 728 | } 729 | 730 | if (!(loc in $history)) { 731 | location.href = location.href 732 | /* Reloads the page while using cache for scripts, styles and images, 733 | unlike `location.reload()` */ 734 | return 735 | } 736 | 737 | $history[$currentLocationWithoutHash].scrollY = pageYOffset 738 | $currentLocationWithoutHash = loc 739 | changePage($history[loc].title, $history[loc].body, false, $history[loc].scrollY) 740 | }) 741 | } 742 | 743 | function on(eventType, callback) { 744 | $eventsCallbacks[eventType].push(callback) 745 | } 746 | 747 | 748 | //////////////////// 749 | 750 | 751 | return { 752 | supported: supported, 753 | init: init, 754 | on: on 755 | } 756 | 757 | }(document, location); 758 | -------------------------------------------------------------------------------- /source/js/instantclick.min.js: -------------------------------------------------------------------------------- 1 | var InstantClick=function(t,e){function n(t){var e=t.indexOf("#");return e<0?t:t.substr(0,e)}function r(t){for(;t&&"A"!=t.nodeName;)t=t.parentNode;return t}function a(t){do{if(!t.hasAttribute)break;if(t.hasAttribute("data-instant"))return!1;if(t.hasAttribute("data-no-instant"))return!0}while(t=t.parentNode);return!1}function o(t){do{if(!t.hasAttribute)break;if(t.hasAttribute("data-no-instant"))return!1;if(t.hasAttribute("data-instant"))return!0}while(t=t.parentNode);return!1}function s(t){var i=e.protocol+"//"+e.host;return!(t.target||t.hasAttribute("download")||0!=t.href.indexOf(i+"/")||t.href.indexOf("#")>-1&&n(t.href)==L||(M?!o(t):a(t)))}function d(t,e,n,i){for(var r=!1,a=0;a-1&&t.getElementById(r.substr(o+1)),l=0;if(s)for(;s.offsetParent;)l+=s.offsetTop,s=s.offsetParent;scrollTo(0,l),L=n(r)}else scrollTo(0,a);D&&t.title==e?t.title=e+String.fromCharCode(160):t.title=e,b(),G.done(),d("change",!1);var f=t.createEvent("HTMLEvents");f.initEvent("instantclick:newpage",!0,!0),dispatchEvent(f)}function f(){P=!1,R=!1}function c(t){return t.replace(//gi,"")}function u(t){if(!(k>+new Date-500)){var e=r(t.target);e&&s(e)&&g(e.href)}}function h(t){if(!(k>+new Date-500)){var e=r(t.target);e&&s(e)&&(e.addEventListener("mouseout",m),H?(A=e.href,x=setTimeout(g,H)):g(e.href))}}function v(t){k=+new Date;var e=r(t.target);e&&s(e)&&(O?e.removeEventListener("mousedown",u):e.removeEventListener("mouseover",h),g(e.href))}function p(t){var e=r(t.target);e&&s(e)&&(t.which>1||t.metaKey||t.ctrlKey||(t.preventDefault(),T(e.href)))}function m(){if(x)return clearTimeout(x),void(x=!1);P&&!R&&(C.abort(),f())}function y(){if(!(C.readyState<4)&&0!=C.status){if(K.ready=+new Date-K.start,C.getResponseHeader("Content-Type").match(/\/(x|ht|xht)ml/)){var e=t.implementation.createHTMLDocument("");e.documentElement.innerHTML=c(C.responseText),I=e.title,W=e.body;var i=d("receive",S,W,I);i&&("body"in i&&(W=i.body),"title"in i&&(I=i.title));var r=n(S);N[r]={body:W,title:I,scrollY:r in N?N[r].scrollY:0};for(var a,o,s=e.head.children,l=0,f=s.length-1;f>=0;f--)if(a=s[f],a.hasAttribute("data-instant-track")){o=a.getAttribute("href")||a.getAttribute("src")||a.innerHTML;for(var u=X.length-1;u>=0;u--)X[u]==o&&l++}l!=X.length&&(z=!0)}else z=!0;R&&(R=!1,T(S))}}function b(e){if(t.body.addEventListener("touchstart",v,!0),O?t.body.addEventListener("mousedown",u,!0):t.body.addEventListener("mouseover",h,!0),t.body.addEventListener("click",p,!0),!e){var n,r,a,o,s=t.body.getElementsByTagName("script");for(i=0,j=s.length;i=0;i--){var r=arguments[i];r===!0?M=!0:"mousedown"==r?O=!0:"number"==typeof r&&(H=r)}L=n(e.href),N[L]={body:t.body,title:t.title,scrollY:pageYOffset};for(var a,o,s=t.head.children,i=s.length-1;i>=0;i--)a=s[i],a.hasAttribute("data-instant-track")&&(o=a.getAttribute("href")||a.getAttribute("src")||a.innerHTML,X.push(o));C=new XMLHttpRequest,C.addEventListener("readystatechange",y),b(!0),G.init(),d("change",!0),addEventListener("popstate",function(){var t=n(e.href);if(t!=L){if(!(t in N))return void(e.href=e.href);N[L].scrollY=pageYOffset,L=t,l(N[t].title,N[t].body,!1,N[t].scrollY)}})}}function w(t,e){q[t].push(e)}var L,A,x,k,C,M,O,H,Y=navigator.userAgent,D=Y.indexOf(" CriOS/")>-1,B="createTouch"in t,N={},S=!1,I=!1,z=!1,W=!1,K={},P=!1,R=!1,X=[],q={fetch:[],receive:[],wait:[],change:[]},G=function(){function e(){d=t.createElement("div"),d.id="instantclick",l=t.createElement("div"),l.id="instantclick-bar",l.className="instantclick-bar",d.appendChild(l);var e=["Webkit","Moz","O"];if(!((f="transform")in l.style))for(var n=0;n<3;n++)e[n]+"Transform"in l.style&&(f=e[n]+"Transform");var i="transition";if(!(i in l.style))for(var n=0;n<3;n++)e[n]+"Transition"in l.style&&(i="-"+e[n].toLowerCase()+"-"+i);var r=t.createElement("style");r.innerHTML="#instantclick{position:"+(B?"absolute":"fixed")+";top:0;left:0;width:100%;pointer-events:none;z-index:2147483647;"+i+":opacity .25s .1s}.instantclick-bar{background:#29d;width:100%;margin-left:-100%;height:2px;"+i+":all .25s}",t.head.appendChild(r),B&&(s(),addEventListener("resize",s),addEventListener("scroll",s))}function n(e,n){c=e,t.getElementById(d.id)&&t.body.removeChild(d),d.style.opacity="1",t.getElementById(d.id)&&t.body.removeChild(d),a(),n&&setTimeout(i,0),clearTimeout(u),u=setTimeout(r,500)}function i(){c=10,a()}function r(){c+=1+2*Math.random(),c>=98?c=98:u=setTimeout(r,500),a()}function a(){l.style[f]="translate("+c+"%)",t.getElementById(d.id)||t.body.appendChild(d)}function o(){if(t.getElementById(d.id))return clearTimeout(u),c=100,a(),void(d.style.opacity="0");n(100==c?0:c),setTimeout(o,0)}function s(){d.style.left=pageXOffset+"px",d.style.width=innerWidth+"px",d.style.top=pageYOffset+"px";var t="orientation"in window&&90==Math.abs(orientation),e=innerWidth/screen[t?"height":"width"]*2;d.style[f]="scaleY("+e+")"}var d,l,f,c,u;return{init:e,start:n,done:o}}(),F="pushState"in history&&(!Y.match("Android")||Y.match("Chrome/"))&&"file:"!=e.protocol;return{supported:F,init:E,on:w}}(document,location); -------------------------------------------------------------------------------- /source/js/love.js: -------------------------------------------------------------------------------- 1 | !function(e,t,a){function n(){c(".heart{width: 10px;height: 10px;position: fixed;background: #f00;transform: rotate(45deg);-webkit-transform: rotate(45deg);-moz-transform: rotate(45deg);}.heart:after,.heart:before{content: '';width: inherit;height: inherit;background: inherit;border-radius: 50%;-webkit-border-radius: 50%;-moz-border-radius: 50%;position: fixed;}.heart:after{top: -5px;}.heart:before{left: -5px;}"),o(),r()}function r(){for(var e=0;e:first-child{margin-top:0!important}body>:last-child{margin-bottom:0!important}blockquote,dl,ol,p,pre,table,ul{margin:20px 0;vertical-align:baseline}h1,h2,h3,h4,h5,h6{font-weight:400;-webkit-font-smoothing:antialiased}h1 code,h1 tt,h2 code,h2 tt,h3 code,h3 tt,h4 code,h4 tt,h5 code,h5 tt,h6 code,h6 tt{font-size:inherit}h1{font-size:1.4em;color:#222}h2{font-size:1.3em;color:#333}h3{font-size:1.2em;color:#444}h4{font-size:1.1em;color:#555}h5{font-size:1em;color:#555}h6{font-size:1em;color:#555}body>h1:first-child,body>h1:first-child+h2,body>h2:first-child,body>h3:first-child,body>h4:first-child,body>h5:first-child,body>h6:first-child{margin-top:0;padding-top:0}a:first-child h1,a:first-child h2,a:first-child h3,a:first-child h4,a:first-child h5,a:first-child h6{margin-top:0;padding-top:0}a{text-decoration:none;color:#313131;outline:0}a:active,a:focus,a:hover{color:#eb5055;outline:0}ol,ul{padding-left:30px}ol li ol:first-of-type,ol li ul:first-of-type,ol li>:first-child,ul li ol:first-of-type,ul li ul:first-of-type,ul li>:first-child{margin-top:0}li{word-wrap:break-word}li p{margin:0}ol ol,ol ul,ul ol,ul ul{margin-bottom:0}pre{position:relative;margin:20px 0}code{font-family:Menlo,Bitstream Vera Sans Mono,DejaVu Sans Mono,Monaco,Consolas,monospace;font-size:13px;margin:0 3px;padding:2px 6px;border-radius:3px;background-color:#f7f7f7}pre code{font-size:13px;display:block;overflow:auto;padding:1.3em;border:0}blockquote{padding:0 10px 0 20px;border-left:4px solid #ddd}blockquote>:first-child{margin-top:0}blockquote>:last-child{margin-bottom:0}hr{clear:both;overflow:hidden;height:0;margin:15px 0;padding:0;border:0;border-bottom:2px solid #ddd;background:0 0}table{font-size:13px;display:block;overflow:auto;width:100%;border-spacing:0;border-collapse:collapse;word-wrap:normal;word-break:normal}table th{font-weight:700}table td,table th{padding:6px 13px;white-space:nowrap;border:1px solid #ddd}table tr{border-top:1px solid #ccc;background-color:#fff}table tr:hover{background-color:#f7f7f7}table thead tr{background-color:#f7f7f7}button,input,select,textarea{font-family:-apple-system,SF UI Text,Arial,PingFang SC,Hiragino Sans GB,Microsoft YaHei,WenQuanYi Micro Hei,sans-serif;font-size:13px;line-height:1.6;resize:none}input:focus:invalid,input:required:invalid,textarea:focus:invalid,textarea:required:invalid{box-shadow:none}input::-webkit-input-placeholder,textarea::-webkit-input-placeholder{color:#5f5f5f}input:-moz-placeholder,textarea:-moz-placeholder{color:#5f5f5f}input::-moz-placeholder,textarea::-moz-placeholder{color:#5f5f5f}input:-ms-input-placeholder,textarea:-ms-input-placeholder{color:#5f5f5f}.clearfix:after,.clearfix:before{display:table;content:''}.clearfix:after{clear:both}.clearfix{zoom:1}.left{float:left}.right{float:right}.browsehappy{position:fixed;z-index:999;top:0;bottom:0;width:100%;height:40px;padding:10px;text-align:center;color:#8a1f11;background:#fbe3e4}.browsehappy a{font-weight:700;text-decoration:underline;color:#8a1f11}.bg-white{background-color:#fff!important}.bg-grey{background-color:#f7f7f7!important}.bg-deepgrey{background-color:rgba(0,0,0,.5)!important}.bg-blue{background-color:#6fa3ef!important}.bg-purple{background-color:#bc99c4!important}.bg-green{background-color:#46c47c!important}.bg-yellow{background-color:#f9bb3c!important}.bg-red{background-color:#e8583d!important}.bg-orange{background-color:#f68e5f!important}.text-white{color:#fff!important}.MathJax_Display{overflow-x:auto;overflow-y:hidden}.MathJax{outline:0}.MathJax span{font-size:15px}#instantclick-bar{background-color:#eb5055}.icon-search{position:relative;z-index:1;display:inline-block;width:13px;height:13px;margin:2px 0 0 3px;-webkit-transform:rotate(-45deg);-ms-transform:rotate(-45deg);transform:rotate(-45deg);color:#313131;border:solid 2px currentColor;border-radius:50%}.icon-search:before{position:absolute;top:11px;left:3px;width:2px;height:4px;content:'';background-color:currentColor}.icon-menu{position:relative;display:inline-block;width:20px;height:12px;-webkit-transition:all .4s ease-in-out;transition:all .4s ease-in-out;-webkit-transition-timing-function:cubic-bezier(.61,.04,.17,1.32);transition-timing-function:cubic-bezier(.61,.04,.17,1.32)}.icon-menu .middle{position:absolute;top:50%;left:-.25em;display:inline-block;width:20px;height:2px;margin-top:-1px;-webkit-transition:all .4s ease-in-out;transition:all .4s ease-in-out;background:#313131}.icon-menu:after,.icon-menu:before{position:absolute;left:-.25em;width:20px;height:2px;content:'';-webkit-transition:all .4s ease-in-out;transition:all .4s ease-in-out;-webkit-transform-origin:50% 50% 0;-ms-transform-origin:50% 50% 0;transform-origin:50% 50% 0;background:#313131}.icon-menu:after{bottom:0}.icon-menu:before{top:0}.bg-ico-book{background-position:0 0!important}.bg-ico-game{background-position:0 -40px!important}.bg-ico-note{background-position:0 -80px!important}.bg-ico-chat{background-position:0 -120px!important}.bg-ico-code{background-position:0 -160px!important}.bg-ico-image{background-position:0 -200px!important}.bg-ico-web{background-position:0 -240px!important}.bg-ico-link{background-position:0 -280px!important}.bg-ico-design{background-position:0 -320px!important}.bg-ico-lock{background-position:0 -360px!important}.header{line-height:68px;position:fixed;z-index:10;top:0;display:block;width:100%;height:70px;padding:0;text-align:right;-webkit-box-shadow:0 1px 5px rgba(0,0,0,.1);-moz-box-shadow:0 1px 5px rgba(0,0,0,.1);box-shadow:0 1px 5px rgba(0,0,0,.1)}.header.animated{-webkit-animation-duration:.5s;animation-duration:.5s;-webkit-animation-fill-mode:both;animation-fill-mode:both}.header.animated.slideUp{-webkit-animation-name:slideUp;animation-name:slideUp}.header.animated.slideDown{-webkit-animation-name:slideDown;animation-name:slideDown}.navbar-container{position:relative;width:1040px;max-width:100%;height:70px;margin:0 auto}.navbar-logo{font-size:22px;line-height:22px;position:absolute;top:50%;left:0;display:block;width:auto;max-width:50%;height:22px;margin-top:-10px;margin-left:25px;text-decoration:none}.navbar-logo img{width:auto;height:22px;outline:0}.navbar-menu{z-index:10;display:inline-block;width:auto;padding-right:5px}.navbar-menu a{font-size:14px;padding:0 15px}.navbar-menu a.current{color:#eb5055}.navbar-mobile-menu{line-height:70px;z-index:1;display:none;width:28px;padding:0 45px 0 10px;cursor:pointer}.navbar-mobile-menu:active,.navbar-mobile-menu:hover{cursor:pointer}.navbar-mobile-menu:active:before,.navbar-mobile-menu:hover:before{-webkit-animation:pointer-ball .3s ease 1;animation:pointer-ball .3s ease 1;-webkit-animation-timing-function:cubic-bezier(.61,.04,.17,1.32);animation-timing-function:cubic-bezier(.61,.04,.17,1.32)}.navbar-mobile-menu:active .icon-menu,.navbar-mobile-menu:hover .icon-menu{-webkit-transform:rotateZ(360deg);-ms-transform:rotateZ(360deg);transform:rotateZ(360deg)}.navbar-mobile-menu:active .icon-menu.cross .middle,.navbar-mobile-menu:active .icon-menu.cross:after,.navbar-mobile-menu:active .icon-menu.cross:before,.navbar-mobile-menu:hover .icon-menu.cross .middle,.navbar-mobile-menu:hover .icon-menu.cross:after,.navbar-mobile-menu:hover .icon-menu.cross:before{background:#eb5055}.navbar-mobile-menu:active .icon-menu.cross .middle,.navbar-mobile-menu:hover .icon-menu.cross .middle{opacity:0}.navbar-mobile-menu:active .icon-menu.cross:after,.navbar-mobile-menu:hover .icon-menu.cross:after{bottom:5px;-webkit-transform:rotate(135deg);-ms-transform:rotate(135deg);transform:rotate(135deg)}.navbar-mobile-menu:active .icon-menu.cross:before,.navbar-mobile-menu:hover .icon-menu.cross:before{top:5px;-webkit-transform:rotate(45deg);-ms-transform:rotate(45deg);transform:rotate(45deg);-webkit-box-shadow:0 0 0 #fff;box-shadow:0 0 0 #fff}.navbar-mobile-menu li{position:relative;display:inline;margin:0;text-decoration:none}.navbar-mobile-menu ul{position:absolute;z-index:1;top:100%;overflow:hidden;clip:rect(1px,1px,1px,1px);margin:0 0 0 -95px;padding:0;-webkit-transition:-webkit-transform .3s;transition:-webkit-transform .3s;transition:transform .3s;-webkit-transform:translate(120px,0);-ms-transform:translate(120px,0);transform:translate(120px,0);text-indent:0}.navbar-mobile-menu:active>ul,.navbar-mobile-menu:focus>ul,.navbar-mobile-menu:hover>ul{overflow:inherit;clip:inherit;-webkit-transition:-webkit-transform .3s;transition:-webkit-transform .3s;transition:transform .3s;-webkit-transform:translateX(0) translateY(0) translateZ(0);transform:translateX(0) translateY(0) translateZ(0)}.navbar-mobile-menu ul li a{font-size:15px;line-height:2.2;display:block;width:140px;margin:0;padding:8px 25px;background-color:#eee}.navbar-search{line-height:70px;display:inline-block;width:20px;padding:0 40px 0 0;cursor:pointer}.navbar-search:active>form,.navbar-search:focus>form,.navbar-search:hover>form{overflow:inherit;clip:inherit;-webkit-transition:opacity .5s ease-in-out;transition:opacity .5s ease-in-out;opacity:1}.navbar-search:active>.icon-search,.navbar-search:focus>.icon-search,.navbar-search:hover>.icon-search{color:#eb5055}.navbar-search form{line-height:30px;position:absolute;top:50%;right:0;display:block;overflow:hidden;clip:rect(1px,1px,1px,1px);width:auto;max-width:60%;height:30px;margin-top:-15px;padding-right:10px;opacity:0}.navbar-search form .search-box{line-height:30px;position:relative;top:-1px;display:inline-block;width:400px;max-width:100%;height:30px;padding:0;border:none;border-radius:3px}.navbar-search form .search-box input{font-size:14px;line-height:30px;position:absolute;top:0;left:0;width:100%;height:30px;padding:0 40px 0 18px;color:#313131;border:1px solid #eb5055;border-radius:20px;outline:0;background-color:#fff;-webkit-appearance:none}.main-content{position:relative;max-width:940px;margin:0 auto;-webkit-animation:fade-in .5s;animation:fade-in;animation-duration:.5s}.index-page{padding:120px 20px 0}.index-page .post-list-item-container .item-label{padding:10px 20px 40px}.post-lists{position:relative;display:block;overflow:hidden}.post-lists-body{display:block}.post-list-item{float:left;width:33.3333%;height:auto;padding:15px;align-items:center}.post-list-item-container{position:relative;overflow:hidden;width:100%;padding:0;border-radius:3px;background-color:#fff;-webkit-box-shadow:0 1px 4px rgba(0,0,0,.04);box-shadow:0 1px 4px rgba(0,0,0,.04)}.post-list-item-container:hover{-webkit-box-shadow:2px 2px 4px rgba(0,0,0,.1);box-shadow:2px 2px 4px rgba(0,0,0,.1)}.post-list-item-container .item-thumb{position:relative;display:inherit;min-height:250px;-webkit-transition:-webkit-transform .5s ease,filter .5s ease;-moz-transition:-moz-transform .5s ease,filter .5s ease;transition:transform .5s ease,filter .5s ease;background-position:50% 50%;background-size:cover}.post-list-item-container .item-desc{position:absolute;top:0;overflow:hidden;width:100%;height:100%;padding:40px 28px}.post-list-item-container .item-desc p{font-size:14px;margin:0;padding:0;word-break:break-all;opacity:0;color:#fff}.post-list-item-container:hover .item-thumb{-webkit-transform:scale(1.1);-moz-transform:scale(1.1);transform:scale(1.1);-webkit-filter:blur(3px);-moz-filter:blur(3px);filter:blur(3px)}.post-list-item-container:hover .item-desc{background-color:rgba(0,0,0,.5)}.post-list-item-container:hover .item-desc p{-webkit-animation:fade-in .5s;animation:fade-in;animation-duration:.5s;opacity:1}.post-list-item-container .item-slant{position:absolute;z-index:0;right:0;bottom:50px;left:0;width:110%;min-height:100px;-webkit-transform:rotate(7deg) translate(-10px,0);-ms-transform:rotate(7deg) translate(-10px,0);transform:rotate(7deg) translate(-10px,0);background-color:#fff}.post-list-item-container .item-slant.reverse-slant{-webkit-transform:rotate(-10deg) translate(10px,-10px);-ms-transform:rotate(-10deg) translate(10px,-10px);transform:rotate(-10deg) translate(10px,-10px);opacity:.7;background-color:#f68e5f;-webkit-box-shadow:none;box-shadow:none}.post-list-item-container .item-label{position:relative;height:130px;padding:25px 20px 40px;background-color:#fff}.post-list-item-container .item-label .item-title a{font-size:17px;line-height:17px;word-break:break-all;color:#313131}.post-list-item-container .item-label .item-meta{position:absolute;right:0;bottom:0;width:100%;padding:0 15px 15px;text-align:right}.post-list-item-container .item-label .item-meta .item-meta-cat a{font-size:13px;position:relative;float:right;margin-right:10px;padding:10px 0;text-align:right;text-transform:none;color:#5f5f5f}.post-list-item-container .item-label .item-meta .item-meta-date{font-size:12px;position:relative;float:left;padding-top:9px;padding-left:9px;text-align:right;text-transform:none;color:#f1f1f1}.post-list-item-container .item-label .item-meta .item-meta-ico{display:inline-block;float:right;width:42px;height:42px;border:1px solid #eaeaea;border-radius:50%}.onelist-page{max-width:100%;margin:0;padding:70px 0 0}.post-onelist-item{display:inline-block;width:100%;margin:0}.post-onelist-item:nth-child(n){background-color:#f7f7f7}.post-onelist-item:nth-child(2n){background-color:#fff}.post-onelist-item-container{position:relative;max-width:680px;margin:0 auto;padding:70px 20px 65px}.post-onelist-item-container .onelist-item-thumb{min-height:260px;border-radius:5px;background-position:50% 50%;background-size:cover;-webkit-box-shadow:0 1px 4px rgba(0,0,0,.04);box-shadow:0 1px 4px rgba(0,0,0,.04)}.post-onelist-item-container .onelist-item-thumb:hover{-webkit-box-shadow:2px 3px 4px rgba(0,0,0,.1);box-shadow:2px 3px 4px rgba(0,0,0,.1)}.post-onelist-item-container .item-title{display:block;margin:30px 0 0;text-align:center}.post-onelist-item-container .item-title a{font-size:21px;line-height:17px;color:#313131}.post-onelist-item-container .item-content{padding:0 30px 10px;text-align:center;word-break:break-all}.post-onelist-item-container .item-meta,.post-onelist-item-container .item-readmore{font-size:12px;text-align:center;color:#5f5f5f}.post-onelist-item-container .item-meta a{color:#5f5f5f}.post-onelist-item-container .item-readmore a{padding:8px 20px;color:#5f5f5f;border:1px solid #5f5f5f;border-radius:20px}.post-onelist-item-container .item-meta-hr{display:block;width:55px;height:2px;margin:20px auto 0}.post-header-thumb{position:relative;width:100%;height:300px;margin-top:70px}.post-header-thumb-op{position:absolute;width:100%;width:100%;height:300px;background-position:center;background-size:cover;-webkit-filter:blur(4px);-moz-filter:blur(4px);filter:blur(4px)}.post-header-thumb-cover{position:relative;width:100%;height:300px;margin-top:70px;background-color:rgba(0,0,0,.5);-webkit-box-shadow:0 1px 5px rgba(0,0,0,.3);-moz-box-shadow:0 1px 5px rgba(0,0,0,.3);box-shadow:0 1px 5px rgba(0,0,0,.3)}.post-header-thumb-container{position:relative;top:100px;max-width:700px;margin:0 auto;padding:30px 25px 20px;-webkit-animation:fade-in .5s;animation:fade-in;animation-duration:.5s}.post-header-thumb-title{font-size:21px;font-weight:500;color:#fff}.post-header-thumb-meta{color:#fff}.post-header-thumb-meta a{color:#fff}.post-header-thumb-container .post-tags{border-bottom:none}.post-header-thumb-container .post-tags a:hover{color:#5f5f5f;border:1px solid #f7f7f7;outline-style:none;background:#f7f7f7}.post-page{max-width:700px;padding:30px 25px 20px}.page-page{max-width:700px;padding:130px 25px 20px}.post-content p{font-size:14px;word-wrap:break-word;word-break:break-word}.post-content h1,.post-content h2,.post-content h3,.post-content h4,.post-content h5,.post-content h6{font-weight:500;position:relative;margin:20px 0}.post-content h1::before,.post-content h2::before,.post-content h3::before,.post-content h4::before,.post-content h5::before,.post-content h6::before{font-weight:600;position:absolute;top:0;left:-15px;content:'#';color:#eb5055}.post-content pre{overflow-x:auto;margin:20px 0;border-radius:4px;background:#f7f7f7;text-shadow:none}.post-content pre code{line-height:20px;margin:0;padding:1.3em;}.post-content p a{color:#313131;border-bottom:1px solid #ccc}.post-content p a:hover{color:#eb5055;border-bottom:1px solid #eb5055}.post-content img{position:relative;display:block;overflow:hidden;max-width:100%;height:auto;margin:0 auto}.post-content p img{position:relative;display:block;overflow:hidden;max-width:100%;height:auto;margin:20px auto}.post-content input.text{display:inline-block;padding:5px 10px;color:#5f5f5f;border:1px solid #5f5f5f;border-radius:3px;outline:0;background-color:#fff}.post-content input.submit{display:inline-block;padding:5px 15px;color:#fff;border:1px solid #5f5f5f;border-radius:3px;outline:0;background-color:#5f5f5f}.post-content .flinks{padding:0}.post-content .flinks li{display:inline-block;overflow:hidden;width:32%;white-space:nowrap;text-overflow:ellipsis}.post-page .post-header{display:none}.post-page .post-content .post-tags{display:none}.post-title{font-size:21px}.post-data,.post-data a{font-size:12px;color:#5f5f5f}.post-tags{margin:0;padding:5px 0 15px;border-bottom:1px solid #e0e0e0}.post-tags a{font-size:13px;font-weight:600;display:inline-block;margin:4px 8px 0 0;padding:0 15px;-webkit-transition-duration:.4s;transition-duration:.4s;letter-spacing:0}.post-tags a:nth-child(1n){color:#fff;border:1px solid #6fa3ef;border-radius:15px;background:#6fa3ef}.post-tags a:nth-child(2n){color:#fff;border:1px solid #ff9800;border-radius:15px;background:#ff9800}.post-tags a:nth-child(3n){color:#fff;border:1px solid #46c47c;border-radius:15px;background:#46c47c}.post-tags a:nth-child(4n){color:#fff;border:1px solid #f9bb3c;border-radius:15px;background:#f9bb3c}.post-tags a:nth-child(5n){color:#fff;border:1px solid #bc99c4;border-radius:15px;background:#bc99c4}.post-tags a:nth-child(6n){color:#fff;border:1px solid #e8583d;border-radius:15px;background:#e8583d}.post-tags a::before{content:'# '}.post-content .post-tags a:hover{color:#5f5f5f;border:1px solid #f7f7f7;outline-style:none;background:#f7f7f7}.post-info{overflow:hidden;margin:25px -20px 0;padding:25px 20px 20px;white-space:nowrap;text-overflow:ellipsis;border-top:1px solid #e0e0e0}.related-post-lists{position:relative;z-index:1;margin-bottom:-10px;padding-top:30px;padding-bottom:30px;background-color:#f7f7f7}.related-post-lists .post-lists{max-width:940px;margin:0 auto}.related-post-lists .post-list-item-container{border:1px solid rgba(184,197,214,.2);border-radius:3px;background:#fff;-webkit-box-shadow:0 1px 4px rgba(0,0,0,.04);box-shadow:0 1px 4px rgba(0,0,0,.04)}.related-post-lists .post-list-item-container .item-label{height:120px;background:#fff}.related-post-lists .post-list-item-container .item-label .item-title a{font-size:14px;color:#313131}.related-post-lists .post-list-item-container .item-label .item-meta .item-meta-cat a{color:#5f5f5f}.related-post-lists .post-list-item-container .item-label .item-meta .item-meta-ico{width:42px;height:42px;border:1px solid #eaeaea;border-radius:50%}.archive-page{padding:120px 20px 40px}.archive-page .categorys-title{font-size:14px;position:relative;margin:10px auto;padding:0 30px;color:#5f5f5f}.archive-page .categorys-title a{color:#5f5f5f}.archive-page .categorys-title::before{position:absolute;top:0;left:-15px;padding:0 0 0 30px;content:'#';color:#eb5055}.archive-page .post-list-item-container{border:1px solid rgba(184,197,214,.2);border-radius:3px;background:#fff;-webkit-box-shadow:0 1px 4px rgba(0,0,0,.04);box-shadow:0 1px 4px rgba(0,0,0,.04)}.archive-page .post-list-item-container .item-label{height:95px;background:#fff}.archive-page .post-list-item-container .item-label .item-title a{font-size:14px;display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:#313131}.archive-page .post-list-item-container .item-label .item-meta .item-meta-date{padding-bottom:5px;padding-left:5px;color:#5f5f5f}.common-page{padding:120px 20px 0}.common-page .common-title{font-size:14px;position:relative;margin:10px auto;padding:0 30px;color:#5f5f5f}.common-page .common-title::before{position:absolute;top:0;left:-15px;padding:0 0 0 30px;content:'#';color:#eb5055}.common-page .post-list-item{width:49.9999%}.common-page .post-list-item-container .item-label{background-color:#fff}.common-page .post-list-item-container .item-label .item-title a{font-size:14px;color:#313131}.common-page .post-list-item-container .item-label .item-meta .item-meta-date{padding-bottom:5px;padding-left:5px;color:#5f5f5f}.archive-page .post-list-item:hover,.common-page .post-list-item:hover,.related-post-lists .post-list-item:hover{-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transform:scale(1.03);transform:scale(1.03)}.post-list-item-container .item-label.bg-blue .item-title a{color:#fff}.post-list-item-container .item-label.bg-purple .item-title a{color:#fff}.post-list-item-container .item-label.bg-green .item-title a{color:#fff}.post-list-item-container .item-label.bg-yellow .item-title a{color:#fff}.post-list-item-container .item-label.bg-red .item-title a{color:#fff}.post-list-item-container .item-label.bg-orange .item-title a{color:#fff}.post-list-item-container .item-label.bg-blue .item-meta .item-meta-date{color:#fff}.post-list-item-container .item-label.bg-purple .item-meta .item-meta-date{color:#fff}.post-list-item-container .item-label.bg-green .item-meta .item-meta-date{color:#fff}.post-list-item-container .item-label.bg-yellow .item-meta .item-meta-date{color:#fff}.post-list-item-container .item-label.bg-red .item-meta .item-meta-date{color:#fff}.post-list-item-container .item-label.bg-orange .item-meta .item-meta-date{color:#fff}.search-page .search-box{line-height:40px;position:relative;top:-1px;display:inline-block;width:100%;height:40px;padding:0;border:none;border-radius:3px}.search-page .search-box .input{font-size:14px;line-height:40px;position:absolute;top:0;left:0;width:100%;height:40px;padding:0 40px 0 18px;color:#313131;border:1px solid rgba(184,197,214,.2);border-radius:20px;outline:0;background-color:#fff;-webkit-box-shadow:0 1px 4px rgba(0,0,0,.04);box-shadow:0 1px 4px rgba(0,0,0,.04);-webkit-appearance:none}.search-page .search-box .spsubmit{line-height:42px;float:right;margin-right:15px;outline:0;background-color:transparent}.search-page .search-tags{margin:0;padding:15px 0;text-align:center}.search-page .search-tags p{margin:20px 0 0}.search-page .search-tags a{font-size:13px;display:inline-block;margin:10px 8px 0 0;padding:2px 15px;-webkit-transition-duration:.4s;transition-duration:.4s;letter-spacing:0;border-radius:15px;-webkit-box-shadow:0 1px 4px rgba(0,0,0,.04);box-shadow:0 1px 4px rgba(0,0,0,.04)}.search-page .search-tags-hr{display:block;width:55px;height:2px;margin:20px auto 10px}.directory-content{position:relative;z-index:0;max-width:720px;margin-right:auto!important;margin-left:auto!important;text-align:right;opacity:0}.directory-content.initial{opacity:0}.directory-content.pinned{opacity:1}.directory-content.unpinned{opacity:1}.directory-content.headroom--top{opacity:0}.directory-content.headroom--not-top{-webkit-transition:opacity .5s ease-in-out;transition:opacity .5s ease-in-out;opacity:1}#directory{position:fixed;z-index:0;top:100px;display:inline-block;text-align:left}#directory li,#directory ul{margin:0;padding-left:0;list-style:none}#directory>ul{position:relative;border-left:1px solid #ddd}#directory>ul>li::before{position:relative;top:0;left:-4px;display:inline-block;width:7px;height:7px;content:'';border-radius:50%;background-color:#eb5055}#directory ul li a{display:inline-table;margin-left:5px;white-space:nowrap}#directory ul li ul li a{margin-left:20px;white-space:nowrap;color:#5f5f5f}#directory ul li ul li ul li a{margin-left:30px;color:#5f5f5f}#directory a:hover{color:#eb5055}.post-bottom-bar{position:fixed;z-index:2;right:0;bottom:0;left:0;height:48px;border-top:1px solid #e0e0e0;background-color:#fff}.post-bottom-bar .bottom-bar-inner{max-width:900px;margin:0 auto;padding:0 10px}.post-bottom-bar .social-share{font-size:14px;line-height:48px;margin:0 0 0 10px;color:#313131}.post-bottom-bar .bottom-bar-item a{font-size:14px;line-height:48px;margin:0;padding:12px;cursor:pointer;color:#313131;border:0;background:0 0}.post-bottom-bar .bottom-bar-item a:hover{color:#eb5055}.post-bottom-bar .social-share .bottom-bar-item{padding:4px}.post-bottom-bar .social-share .bottom-bar-item a{font-size:13px;padding:4px 12px;-webkit-transition-duration:.4s;transition-duration:.4s;border-radius:15px}.post-bottom-bar .social-share .bottom-bar-item a:hover{color:#5f5f5f;background-color:#f7f7f7}.post-bottom-bar .bottom-bar-item.bottom-bar-facebook a{color:#fff;background-color:#4267b2}.post-bottom-bar .bottom-bar-item.bottom-bar-twitter a{color:#fff;background-color:#1b95e0}.post-bottom-bar .bottom-bar-item.bottom-bar-weibo a{color:#fff;background-color:#db4437}.post-bottom-bar .bottom-bar-item.bottom-bar-qrcode a{color:#fff;background-color:#4caf50}.post-bottom-bar.animated{-webkit-animation-duration:.5s;animation-duration:.5s;-webkit-animation-fill-mode:both;animation-fill-mode:both}.post-bottom-bar.animated.pinned{-webkit-animation-name:pinned;animation-name:pinned}.post-bottom-bar.headroom--top{-webkit-animation-name:pinned;animation-name:pinned}.post-bottom-bar.animated.unpinned{-webkit-animation-name:unpinned;animation-name:unpinned}.lists-navigator{margin:30px 0 35px}.onelist-page .lists-navigator{margin:35px 0 35px}.lists-navigator ol{margin:0;padding:0 10px;list-style:none;text-align:center}.lists-navigator ol li{display:inline-block;color:#5f5f5f}.lists-navigator ol li a{font-size:14px;padding:0 20px;color:#5f5f5f}.lists-navigator ol li.current a{color:#eb5055}#comments .lists-navigator{margin:20px 0}#comments .lists-navigator ol{margin:20px 0;padding:0 10px;list-style:none;text-align:center}#comments .lists-navigator ol li.current a{color:#eb5055}.comment-container{position:relative;z-index:1;color:#5f5f5f;background-color:#f7f7f7}#comments{max-width:700px;margin:0 auto;padding:0 20px}#comments .page-navigator{margin:0}#comments a{color:#5f5f5f}#comments .response{font-size:14px;font-weight:400;display:block;padding:30px 0 30px 20px;color:#5f5f5f}#comments .response a{color:#eb5055}.comment-list{margin:0;padding-left:0;list-style-type:none}.comment-parent{margin:20px 0;border:1px solid rgba(184,197,214,.2);border-radius:3px;background:#fff;-webkit-box-shadow:0 1px 4px rgba(0,0,0,.04);box-shadow:0 1px 4px rgba(0,0,0,.04)}.comment-parent:last-child{margin:20px 0 0}.comment-parent:first-child{margin:0}.comment-child,.comment-child2{border-top:1px solid rgba(184,197,214,.2)}.comment-view{padding:20px;cursor:pointer}.comment-header{display:inline-block;width:100%}.comment-header .avatar{display:inline-block;float:left;width:40px;height:40px;border:1px solid #eaeaea;border-radius:50%}.comment-header .comment-author{font-size:13px;line-height:45px;display:inline-block;float:left;margin:0 20px}.comment-header .comment-by-author a{color:#eb5055!important}.comment-content{margin-bottom:10px;color:#313131}.comment-meta{font-size:12px}.comment-meta .comment-reply{display:none;float:right}.comment-meta .comment-reply a{color:#eb5055!important}.comment-view:hover .comment-meta .comment-reply{display:block}.comment-parent>.comment-children .avatar{width:34px;height:34px;margin:3px 0 0 3px}.comment-parent>.comment-children .comment-author-at{float:left;margin-right:5px}.comment-parent>.comment-children .comment-content{margin:-3px 3px 10px}.comment-parent>.comment-children .comment-meta{margin:0 3px}.comment-form{position:relative;margin:0 0 40px;padding:10px 20px;border-radius:3px;background:#fff;-webkit-box-shadow:0 1px 4px rgba(0,0,0,.04);box-shadow:0 1px 4px rgba(0,0,0,.04)}.comment-form .form-control{font-size:13px;display:block;width:100%;height:34px;color:#313131;outline:0}.comment-form .form-control:focus{border-color:#eb5055;outline:0}.comment-form textarea.form-control{overflow:hidden;height:150px;padding:10px 0;resize:none;border-radius:0}.comment-form .input-control{float:left;width:100%;max-width:206px;border-bottom:1px dashed #ddd;border-radius:0}.comment-form .submit{font-size:13px;position:absolute;right:20px;bottom:20px;display:block;height:32px;margin:0 auto;padding:0 20px;-webkit-transition-duration:.4s;transition-duration:.4s;text-align:center;color:#313131;border:1px solid #f7f7f7;border-radius:30px;background-color:#f7f7f7}.comment-form .submit:hover,.submit:active,.submit:active:focus,.submit:focus{color:#eb5055;border:1px solid #eb5055;outline-style:none;background-color:#fff}.footer{position:relative;z-index:1;margin-top:0;padding-bottom:50px;background-color:#fff}.footer-social{border-bottom:1px solid rgba(184,197,214,.2)}.footer-social .footer-container{max-width:940px;margin:0 auto}.footer-social .social-list{padding:20px;text-align:center}.footer-social .social-list a{font-size:13px;padding:0 25px;text-decoration:none;color:#5f5f5f}.footer-meta{padding:50px 0 0;list-style:none}.footer-meta .footer-container{width:100%;max-width:960px;height:250px;margin:0 auto;padding:0 80px}.footer-meta .meta-item{position:relative;float:left;width:33.3333333%;min-height:1px;padding:0 30px}.footer-meta .meta-copyright .info-logo img{height:32px;margin-bottom:12px}.footer-meta .meta-copyright .info-text p{font-size:13px;line-height:20px;margin:0;color:#767676}.footer-meta .meta-copyright .info-text a{color:#767676}.footer-meta .meta-title{font-size:14px;padding:0 0 10px 0;text-decoration:none;color:#5f5f5f}.footer-meta .meta-posts li{font-size:13px;line-height:25px;display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:#767676}.footer-meta .meta-posts li a{color:#5f5f5f}.footer-meta .meta-comments li{font-size:13px;line-height:25px;display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:#5f5f5f}.footer-meta .meta-comments li a{color:#767676}@media(max-width:1000px){.directory-content{display:none}.post-header-thumb{height:280px}.post-header-thumb-cover{height:280px}.post-header-thumb-op{height:280px}.post-header-thumb-container{top:70px}}@media(max-width:880px){.index-page{padding:80px 0 0}.archive-page{padding:80px 0 20px}.common-page{padding:80px 0 0}.post-onelist-item-container{padding:50px 20px 55px}.post-list-item{width:50%;padding:10px}.post-list-item:nth-child(odd){padding-left:20px}.post-list-item:nth-child(even){padding-right:20px}.lists-navigator{margin:25px 0 30px}.post-header-thumb{height:250px}.post-header-thumb-op{height:250px}.post-header-thumb-cover{height:250px}.post-header-thumb-container{top:60px}.footer-meta .footer-container{padding:0}.main-content{margin:0 auto}.footer-meta .meta-item{padding:0 20px}}@media(max-width:700px){.comment-form .input-control{max-width:100%}.post-header-thumb{height:220px}.post-header-thumb-op{height:220px}.post-header-thumb-cover{height:220px}.post-header-thumb-container{top:40px}.post-page{padding:20px 25px 0}.page-page{padding:90px 25px 0}.search-page .search-tags{padding:0 0 15px}.search-page .search-tags p{margin:0}.related-post-lists{padding-top:15px}.post-onelist-item-container{padding:20px 20px 25px}.post-onelist-item-container .onelist-item-thumb{min-height:240px}}@media(max-width:650px){.navbar-menu{display:none}.navbar-search{padding:0 35px 0 0}.navbar-search form{width:180px;margin-right:55px}.navbar-mobile-menu{display:inline-block}.red-gradient{display:none}.meta-posts{display:none}.meta-comments{display:none}.post-bottom-bar .social-share{display:none}.post-page{padding:90px 25px 0}.common-page .post-list-item{width:100%;padding:10px 20px}.footer-social{display:none}.footer-meta .footer-container{height:70px;padding:0 15px}.footer-meta .meta-item{width:100%;padding:0 10px}.footer-meta .meta-copyright .info-text{float:right}.footer-meta .meta-copyright .info-text p{text-align:right}.post-onelist-item-container .onelist-item-thumb{min-height:220px}.post-header-thumb{display:none}.post-page .post-header{display:inherit}.post-page .post-content .post-tags{display:inherit}}@media(max-width:580px){.navbar-search form{width:150px}.index-page{padding:70px 0 0}.archive-page{padding:70px 0 20px}.common-page{padding:70px 0 0}.post-list-item{width:100%;padding:10px 20px}.post-list-item:first-child{padding-top:20px}.archive-page .post-list-item:first-child{padding-top:0}.archive-page .post-list-item:last-child{padding-bottom:0}.common-page .post-list-item:first-child{padding-top:0}.related-post-lists{padding-top:5px}.main-content{margin:0 auto}.post-onelist-item-container{padding:20px 20px 25px}.post-onelist-item-container .item-content{display:none}.post-onelist-item-container .item-readmore{display:none}.post-onelist-item-container .onelist-item-thumb{min-height:180px}}@media(max-width:410px){.meta-copyright-info .info-logo{display:none}}@-webkit-keyframes unpinned{0%{-webkit-transform:translateY(0)}100%{-webkit-transform:translateY(50px)}}@keyframes unpinned{0%{-webkit-transform:translateY(0);transform:translateY(0)}100%{-webkit-transform:translateY(50px);transform:translateY(50px)}}@-webkit-keyframes pinned{0%{-webkit-transform:translateY(50px)}100%{-webkit-transform:translateY(0)}}@keyframes pinned{0%{-webkit-transform:translateY(50px);transform:translateY(50px)}100%{-webkit-transform:translateY(0);transform:translateY(0)}}@-webkit-keyframes slideDown{0%{-webkit-transform:translateY(-70px)}100%{-webkit-transform:translateY(0)}}@keyframes slideDown{0%{-webkit-transform:translateY(-70px);transform:translateY(-70px)}100%{-webkit-transform:translateY(0);transform:translateY(0)}}@-webkit-keyframes slideUp{0%{-webkit-transform:translateY(0)}100%{-webkit-transform:translateY(-70px)}}@keyframes slideUp{0%{-webkit-transform:translateY(0);transform:translateY(0)}100%{-webkit-transform:translateY(-70px);transform:translateY(-70px)}}@keyframes fade-in{0%{transform:translateY(20px);opacity:0}100%{transform:translateY(0);opacity:1}}@-webkit-keyframes fade-in{0%{-webkit-transform:translateY(20px);opacity:0}100%{-webkit-transform:translateY(0);opacity:1}}.page-navigator span,.page-navigator a{display:inline-block;color:#5f5f5f;word-wrap:break-word;font-size:14px;padding:0 20px;}.page-navigator .current, .page-navigator a:hover{color:#eb5055;}.search-page .search-title{text-align:center}.search-page .search-title h1{color:#313131;padding:0 0 15px;}.search-page .search-title h4{color:#313131;}#vcomments{max-width: 700px;margin:0 auto;padding:20px;}.v .vwrap{background:#fff;box-shadow:0 1px 4px rgba(0,0,0,.04);}.v .vlist .vcard{background:#fff;margin-top:20px;padding:20px 20px 0;border-radius:3px;border:1px solid rgba(184,197,214,.2);box-shadow:0 1px 4px rgba(0,0,0,.04)}.v .vlist .vcard .vh{border:none !important;}.v .vlist .vcard .vquote{padding:0 !important;border:none !important;}#reward-button{cursor:pointer;border:0;outline:0;border-radius:5px;padding:0;margin:0;letter-spacing:normal;text-transform:none;text-indent:0;text-shadow:none}#reward-button span{line-height:35px;display:inline-block;width:80px;height:35px;border-radius:5px;color:#fff;font-weight:400;font-style:normal;font-variant:normal;font-stretch:normal;font-size:18px;font-family:microsoft yahei;background:#f44336}#reward-button span:hover{background:#f7877f}#QR{padding-top:20px}#QR a{border:0}#QR img{width:180px;max-width:100%;display:inline-block;margin:.8em 2em 0}.compensate-for-scrollbar{margin:0!important;} --------------------------------------------------------------------------------