initial
This commit is contained in:
结发受长生
@@ -0,0 +1 @@
|
||||
.DS_Store
|
||||
@@ -0,0 +1,148 @@
|
||||
# Xups 主题安装及 Hexo 使用教程
|
||||
|
||||
|
||||
## 主题的一些特性
|
||||
|
||||
1. 扁平。思路源于大前端 WordPress 主题。
|
||||
2. 自带博客评论系统。博客主题自带评论系统，基于 github issues 实现，了解更多请点击[基于 github issues实现的评论框](http://jelon.top/posts/xups-comment-box/)。
|
||||
|
||||
## 使用指引
|
||||
|
||||
1. 安装hexo
|
||||
|
||||
```
|
||||
npm i hexo-cli -g
|
||||
hexo init blog
|
||||
cd blog
|
||||
npm install
|
||||
```
|
||||
|
||||
2. 将主题拉到本地，并解压
|
||||
|
||||
```
|
||||
cd themes
|
||||
git clone https://github.com/jangdelong/hexo-theme-xups.git
|
||||
```
|
||||
|
||||
3. 配置 _config.yml 的 theme 配置
|
||||
|
||||
```
|
||||
theme: hexo-theme-xups
|
||||
```
|
||||
|
||||
4. 运行 `hexo s --watch`
|
||||
|
||||
```
|
||||
cd ..
|
||||
hexo generate # 或者 hexo g
|
||||
hexo s --watch
|
||||
```
|
||||
|
||||
运行上述命令后，浏览器打开 [http://localhost:4000](http://localhost:4000) 即可本地访问我们的网站
|
||||
|
||||
## 创建文章
|
||||
|
||||
有两种方法创建文章，可任选其一：
|
||||
|
||||
> 注意：文件名不要出现中文!!!
|
||||
|
||||
1. 使用`hexo new` 命令
|
||||
|
||||
``` bash
|
||||
$ hexo new "My New Post"
|
||||
```
|
||||
|
||||
2. 拷贝现有的文章进行修改
|
||||
|
||||
hexo使用markdown来编辑文章，在source目录下，拷贝任意md文件进行创建新的文章。具体可参考下hexo的官方说明
|
||||
|
||||
## 文章规范
|
||||
|
||||
1. 使用markdown写博文
|
||||
2. 建议图片进行单独 cdn 存储
|
||||
3. 标准配图
|
||||
- xups主题现默认有0-9共10张博客配图
|
||||
- 博客封面配图：200x140，命名：xxx_thumbnail
|
||||
4. 指明文章的标题、作者信息、封面图片地址、博客摘要
|
||||
|
||||
```
|
||||
---
|
||||
title: {{ title }}
|
||||
date: {{ date }}
|
||||
author:
|
||||
tags:
|
||||
categories:
|
||||
- Web技术
|
||||
- 生活琐事
|
||||
thumbnail:
|
||||
blogexcerpt:
|
||||
|
||||
---
|
||||
|
||||
```
|
||||
> 另外， 如果您需保留原主题的关于页（about）、留言页面（comment）、实验室页（lab）的话， 请将 __source/ 目录下的 about/、comment/、lab/ 三个目录及里面的页面放到您的 Hexo 程序的 source 目录下（注意不是theme主题下的目录）；将 __scaffolds 目录下的 draft.md、page.md、post.md 放到 Hexo 程序的 scaffolds 目录（注意不是theme主题下的目录）。
|
||||
|
||||
|
||||
5. 利用`<!-- more --> `或者`post.blogexcerpt`设置文章的摘要
|
||||
|
||||
示例：
|
||||
|
||||
```
|
||||
|
||||
---
|
||||
title: 文章标题
|
||||
blogexcerpt: 这里是自定义文章摘要
|
||||
...
|
||||
---
|
||||
|
||||
这里是文章正文内容
|
||||
...
|
||||
|
||||
```
|
||||
|
||||
这部分是文章摘要，这部分是文章摘要。在hexo模版里可通过 `<%- post.blogexcerpt || post.excerpt || post.content %>` 来引用。
|
||||
- post.blogexcerpt：自定义摘要
|
||||
- post.excerpt：通过`<!-- more -->`分隔符来获取的文章摘要
|
||||
- post.content：如不设置摘要情况，则直接输出文章全部内容
|
||||
|
||||
## 评论系统
|
||||
|
||||
1. 创建 Github Application
|
||||
2. 创建仓库
|
||||
3. 主题 _config.yml 配置
|
||||
|
||||
```python
|
||||
#----------------------------
|
||||
# 是否开启评论
|
||||
#----------------------------
|
||||
comment:
|
||||
enable: false # 是否开启配置
|
||||
owner: jangdelong # 你的 github 账户名
|
||||
repo: blog_comments # github repository
|
||||
client_id: xxxxxxxxxx # github application client id
|
||||
client_secret: xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx # github application secret
|
||||
```
|
||||
4. 评论框使用
|
||||
|
||||
```html
|
||||
<div id="comments" class="comment">
|
||||
</div>
|
||||
<script>
|
||||
JELON.Comment({
|
||||
container: 'comments', // 评论框容器id或对象，留空是默认为 comments
|
||||
label: '<%- post.slug %>' || '<%- post.path %>', // 文章标签
|
||||
owner: '<%- theme.comment.owner %>', // GitHub application 创建者
|
||||
repo: '<%- theme.comment.repo %>', // issue 所在仓库名
|
||||
clientId: '<%- theme.comment.client_id %>', // GitHub application client_id
|
||||
clientSecret: '<%- theme.comment.client_secret %>' // GitHub application client_secret
|
||||
});
|
||||
</script>
|
||||
```
|
||||
|
||||
## 其他
|
||||
|
||||
- [Jelon前端小站](http://jelon.top)
|
||||
|
||||
## LICENCE
|
||||
|
||||
The MIT License (MIT)
|
||||
@@ -0,0 +1,10 @@
|
||||
---
|
||||
title: {{ title }}
|
||||
author:
|
||||
tags:
|
||||
categories:
|
||||
- Web技术
|
||||
- 生活琐事
|
||||
thumbnail:
|
||||
blogexcerpt:
|
||||
---
|
||||
@@ -0,0 +1,4 @@
|
||||
---
|
||||
title: {{ title }}
|
||||
date: {{ date }}
|
||||
---
|
||||
@@ -0,0 +1,10 @@
|
||||
---
|
||||
title: {{ title }}
|
||||
author:
|
||||
tags:
|
||||
categories:
|
||||
- Web技术
|
||||
- 生活琐事
|
||||
thumbnail:
|
||||
blogexcerpt:
|
||||
---
|
||||
@@ -0,0 +1,5 @@
|
||||
---
|
||||
title: 关于
|
||||
date: 2016-01-31 22:10:28
|
||||
pageid: about
|
||||
---
|
||||
@@ -0,0 +1,5 @@
|
||||
---
|
||||
title: 留言
|
||||
date: 2016-02-01 20:29:57
|
||||
pageid: comment
|
||||
---
|
||||
@@ -0,0 +1,28 @@
|
||||
---
|
||||
title: 实验室
|
||||
date: 2016-02-01 20:29:57
|
||||
pageid: lab
|
||||
|
||||
projects:
|
||||
blog_demo:
|
||||
title: Blog Demo
|
||||
time: 2016-10-10
|
||||
content:
|
||||
1:
|
||||
name: 基于 vue + vuex + bootstrap 的 blog demo
|
||||
link: https://github.com/jangdelong/vue-blog-demo
|
||||
hexo_theme_xups:
|
||||
title: hexo-theme-xups 博客主题
|
||||
time: 2016-03-12
|
||||
content:
|
||||
1:
|
||||
name: 基于 hexo 静态博客系统的 博客主题 xups
|
||||
link: https://github.com/jangdelong/hexo-theme-xups
|
||||
typecho_theme_xups:
|
||||
title: Typecho 博客主题
|
||||
time: 2015-10-15
|
||||
content:
|
||||
1:
|
||||
name: 基于 php 博客系统 typecho 的主题 xups
|
||||
link: https://github.com/jangdelong/typecho-theme-xups
|
||||
---
|
||||
@@ -0,0 +1,137 @@
|
||||
#############################
|
||||
# Xups for Hexo 主题配置文件
|
||||
# Jelon
|
||||
# http://jelon.top
|
||||
#############################
|
||||
|
||||
#----------------------------
|
||||
# 头部导航
|
||||
#----------------------------
|
||||
menu:
|
||||
home:
|
||||
name: 首页
|
||||
link: /
|
||||
icon: icon-home
|
||||
lab:
|
||||
name: 实验室
|
||||
link: /lab/
|
||||
icon: icon-lab
|
||||
about:
|
||||
name: 关于
|
||||
link: /about/
|
||||
icon: icon-about
|
||||
comment:
|
||||
name: 留言
|
||||
link: /comment/
|
||||
icon: icon-comment
|
||||
|
||||
#----------------------------
|
||||
# 副导航
|
||||
#----------------------------
|
||||
subnav:
|
||||
github: "#"
|
||||
weibo: "#"
|
||||
rss: "#"
|
||||
zhihu: "#"
|
||||
|
||||
#----------------------------
|
||||
# RSS
|
||||
#----------------------------
|
||||
rss: /atom.xml
|
||||
|
||||
#----------------------------
|
||||
# Favicon
|
||||
#----------------------------
|
||||
favicon: /favicon.ico
|
||||
|
||||
#----------------------------
|
||||
# 头像url
|
||||
#----------------------------
|
||||
avatar: https://i.loli.net/2018/05/04/5aeb37415a0dc.jpg
|
||||
|
||||
#----------------------------
|
||||
# 是否开启分享
|
||||
#----------------------------
|
||||
share: true
|
||||
|
||||
#----------------------------
|
||||
# 侧栏是否显示微博秀
|
||||
#----------------------------
|
||||
weibo_show:
|
||||
enable: false
|
||||
code: <iframe id="myWeibo" width="100%" height="550" class="share_self" frameborder="0" scrolling="no" src="http://widget.weibo.com/weiboshow/index.php?language=&width=0&height=550&fansRow=2&ptype=1&speed=0&skin=1&isTitle=0&noborder=0&isWeibo=1&isFans=0&uid=2376003112&verifier=796ea597&dpc=1"></iframe>
|
||||
|
||||
#----------------------------
|
||||
# 是否开启评论
|
||||
#----------------------------
|
||||
comment:
|
||||
enable: true
|
||||
owner: jangdelong
|
||||
repo: blog_comments
|
||||
client_id: b08ed25e52c57993e69c
|
||||
client_secret: 1cb9545488f0380904b87350e7c5a270ae03bab7
|
||||
|
||||
#----------------------------
|
||||
# 是否开启云标签
|
||||
#----------------------------
|
||||
tagcloud: true
|
||||
|
||||
#----------------------------
|
||||
# 友情链接
|
||||
#----------------------------
|
||||
friends:
|
||||
enable: true
|
||||
list:
|
||||
1:
|
||||
name: Haoren博客
|
||||
title: 网络安全博客
|
||||
link: http://blog.sina.com.cn/u/1825875765
|
||||
2:
|
||||
name: Maxwell博客
|
||||
title: 技术博客
|
||||
link: http://blog.csdn.net/yeweiouyang
|
||||
|
||||
#----------------------------
|
||||
# 头部链接
|
||||
#----------------------------
|
||||
head_links:
|
||||
enable: true
|
||||
list:
|
||||
sup:
|
||||
0:
|
||||
name: Github
|
||||
link: https://github.com/sookie2010
|
||||
last:
|
||||
name: Hosted by Coding Pages
|
||||
link: https://pages.coding.me
|
||||
sub:
|
||||
sinaweibo:
|
||||
name: 新浪微博
|
||||
link: https://weibo.com/2633013641
|
||||
qqweibo:
|
||||
name: Facebook
|
||||
link: https://www.facebook.com/profile.php?id=100016469831631
|
||||
#----------------------------
|
||||
# SEO
|
||||
#----------------------------
|
||||
SEO:
|
||||
keywords: 前端, Web, Java
|
||||
description: Jelon个人前端小站
|
||||
|
||||
#----------------------------
|
||||
# 百度分析
|
||||
#----------------------------
|
||||
baidu_analytics: true
|
||||
|
||||
#----------------------------
|
||||
# 高亮样式
|
||||
#----------------------------
|
||||
highlight_theme: normal
|
||||
#----------------------------
|
||||
# CDN
|
||||
# 如: //7xs305.com1.z0.glb.clouddn.com/
|
||||
# 主要以下两个目录进行 cdn 存储
|
||||
# - img 图片资源下的 thumbnail 目录
|
||||
# - css 样式资源下的 fonts 目录
|
||||
#----------------------------
|
||||
CDN:
|
||||
@@ -0,0 +1,57 @@
|
||||
<!-- 自定义关于页 -->
|
||||
|
||||
<p style="color: #444;">
|
||||
<span class="icon-cogs"></span>
|
||||
关于我
|
||||
</p>
|
||||
|
||||
<ul style="list-style-type: none;">
|
||||
<li>
|
||||
<span class="icon-profile"></span>
|
||||
查看<a href="javascript: alert('更新中...');" target="_blank">个人介绍</a>
|
||||
</li>
|
||||
<li>
|
||||
<span class="icon-office"></span>
|
||||
2014年7月，毕业于中南民族大学
|
||||
</li>
|
||||
<li>
|
||||
<span class="icon-newspaper"></span>
|
||||
现工作于深圳，任职前端开发
|
||||
</li>
|
||||
<li>
|
||||
<span class="icon-envelop"></span>
|
||||
联系邮箱 jangdelong#qq.com（'#'改为'@'）
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<p style="color: #444;">
|
||||
<span class="icon-cogs"></span>
|
||||
关于博客
|
||||
</p>
|
||||
|
||||
<ul style="list-style-type: none;">
|
||||
<li>
|
||||
<span class="icon-files-empty"></span>
|
||||
博客采用<a href="https://hexo.io/">Hexo</a>静态博客系统、主题为个人开发主题<a href="https://github.com/jangdelong/hexo-theme-xups" target="_blank">Xups</a> (<a href="https://hexo.io/themes/" target="_blank">Hexo 官网</a>已收录)
|
||||
</li>
|
||||
<li>
|
||||
<span class="icon-files-empty"></span>
|
||||
博客内容主要是学习工作过程中的一些Web总结和日志琐事，除非特殊声明，博客内容皆为个人原创，转载烦请标注文章来源
|
||||
</li>
|
||||
<li>
|
||||
<span class="icon-files-empty"></span>
|
||||
为了提升博客的访问速度，博客的字体文件以及绝大部分图片采用了某 CDN 存储，代码托管采用 <a target="_blank" href="https://coding.net/">Coding</a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<p style="color: #444;">
|
||||
<span class="icon-cogs"></span>
|
||||
Github账号
|
||||
</p>
|
||||
|
||||
<ul style="list-style-type: none;">
|
||||
<li>
|
||||
<span class="icon-github"></span>
|
||||
<a href="https://github.com/jangdelong" target="_blank">我的Github</a>
|
||||
</li>
|
||||
</ul>
|
||||
@@ -0,0 +1,12 @@
|
||||
<!-- 自定义留言页 -->
|
||||
|
||||
<p class="text-center">
|
||||
<img style="width: 258px; height: 258px; border: 1px solid #eee; padding: 0; border-radius: 3px;" src="<%- url_for('img/wechat_pay.png') %>">
|
||||
</p>
|
||||
|
||||
<p class="text-center">
|
||||
如果觉得博客对您有用，欢迎微信赞赏
|
||||
</p>
|
||||
<% if (theme.comment.enable) { %>
|
||||
<%- partial('../_partial/post/comment') %>
|
||||
<% } %>
|
||||
@@ -0,0 +1,27 @@
|
||||
<!-- 自定义实验室页 -->
|
||||
|
||||
<section>
|
||||
<img title="图片摄于2017年1月1日深圳梧桐山 By iPhone 7。" src="<%- url_for('/img/lab/banner.jpg?v=3') %>" alt="Lab Banner" style="max-width: 100%;" alt="Banner" >
|
||||
</section>
|
||||
<%
|
||||
var projects = page.projects;
|
||||
for (var i in projects) {
|
||||
%>
|
||||
<p style="color: #444;">
|
||||
<!--
|
||||
<span class="icon-cogs"></span>
|
||||
-->
|
||||
<span class="icon-price-tags"></span>
|
||||
<%- date(projects[i].time, 'YYYY-MM-DD') %> <%- projects[i].title %>
|
||||
</p>
|
||||
|
||||
<ul style="list-style-type: none;">
|
||||
<% var content = projects[i].content; %>
|
||||
<% for (var j in content) { %>
|
||||
<li>
|
||||
<a href="<%- content[j].link %>" target="_blank" class="icon-lab fr" title="查看代码" style="color: #ff5e52; border-bottom: none; font-size: 16px; margin-top: 2.5px;"></a>
|
||||
<span><%- content[j].name %></span>
|
||||
</li>
|
||||
<% } %>
|
||||
</ul>
|
||||
<% } %>
|
||||
@@ -0,0 +1,2 @@
|
||||
<!-- 这里放网站js脚本 -->
|
||||
<%- js('js/main') %>
|
||||
@@ -0,0 +1,56 @@
|
||||
<!-- 文章 -->
|
||||
<article class="post">
|
||||
<header>
|
||||
<!-- 标签这有且只能显示一个 -->
|
||||
<% if (post.categories && post.categories.length) { %>
|
||||
<%-
|
||||
list_categories(post.categories, {
|
||||
show_count: false,
|
||||
class: 'cat',
|
||||
style: 'none',
|
||||
separator: '|'
|
||||
}).split('|')[0]
|
||||
%>
|
||||
<% } else { %>
|
||||
<a href="javascript: void(0);" class="cat">未分类</a>
|
||||
<% } %>
|
||||
<!-- 文章标题 -->
|
||||
<%- partial('post/title', { class_name: 'post-title' }) %>
|
||||
</header>
|
||||
<p class="post-meta">
|
||||
<%- post.author || 'Jelon' %> 发表于
|
||||
<%- partial('post/date', { date_format: 'YYYY-MM-DD' }) %>
|
||||
|
||||
<span class="post-tags">
|
||||
标签：
|
||||
<%- partial('post/tag') %>
|
||||
</span>
|
||||
</p>
|
||||
|
||||
<div class="post-content">
|
||||
<div class="post-excerpt">
|
||||
<% if (index == true) { %>
|
||||
<%- post.blogexcerpt || post.excerpt || post.content %>
|
||||
<% } %>
|
||||
<p class="more">
|
||||
<a href="<%- url_for(post.permalink) %>">阅读全文</a>
|
||||
</p>
|
||||
</div>
|
||||
<div class="post-thumbnail" data-img="<%- post.photos[0] %>">
|
||||
<a href="<%= post.permalink %>" title="<%= post.title %>">
|
||||
<% if (post.thumbnail) { %>
|
||||
<!--
|
||||
<%- image_tag(post.thumbnail, { class: "thumbnail" }) %>
|
||||
-->
|
||||
<img class="thumbnail" src="<%- url_for('img/default.png') %>" data-echo="<%= post.thumbnail %>" alt="<%= post.title %>" >
|
||||
<% } else if (post.photos.length) { %>
|
||||
<img class="thumbnail" src="<%- url_for('img/default.png') %>" data-echo="<%= url_for(post.photos[0]) %>" alt="<%= post.title %>" >
|
||||
<% } else if (theme.CDN) { %>
|
||||
<img class="thumbnail" src="<%- url_for('img/default.png') %>" data-echo="<%- url_for(theme.CDN + 'thumbnail/' + date(post.date, 'YYYY-MM-DD').charAt(date(post.date, 'YYYY-MM-DD').length - 1) + '.jpg') %>" alt="默认配图" >
|
||||
<% } else { %>
|
||||
<img class="thumbnail" src="<%- url_for('img/default.png') %>" data-echo="<%- url_for('img/thumbnail/' + date(post.date, 'YYYY-MM-DD').charAt(date(post.date, 'YYYY-MM-DD').length - 1) + '.jpg') %>" alt="默认配图" >
|
||||
<% } %>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
@@ -0,0 +1,27 @@
|
||||
<% if (index == true) { %>
|
||||
<h3 class="widget-hd">
|
||||
<strong>
|
||||
<% if (pagination == 2) { %>
|
||||
最近动态
|
||||
<% } else if (pagination == 3) { %>
|
||||
文章归档
|
||||
<% } else if (pagination == 4) { %>
|
||||
`<%- page.category %>`分类下的文章
|
||||
<% } else if (pagination == 5) { %>
|
||||
`<%- page.tag %>`标签下的文章
|
||||
<% } %>
|
||||
</strong>
|
||||
</h3>
|
||||
<% page.posts.each(function(post) { %>
|
||||
<%- partial('archive-post', { post: post }) %>
|
||||
<% }) %>
|
||||
|
||||
<% if (page.total >= 1){ %>
|
||||
<nav class="page-navigator">
|
||||
<%- paginator({
|
||||
prev_text: '前一页',
|
||||
next_text: '后一页'
|
||||
}) %>
|
||||
</nav>
|
||||
<% } %>
|
||||
<% } %>
|
||||
@@ -0,0 +1,35 @@
|
||||
<!-- 文章 -->
|
||||
<article class="post article">
|
||||
<header class="text-center">
|
||||
<h3 class="post-title"><span><%= post.title %></span></h3>
|
||||
</header>
|
||||
<p class="post-meta text-center">
|
||||
<%- post.author || 'Jelon' %> 发表于
|
||||
<%- partial('post/date', { date_format: 'YYYY-MM-DD' }) %>
|
||||
</p>
|
||||
<div class="post-content">
|
||||
<%- post.content %>
|
||||
</div>
|
||||
<p class="post-meta">
|
||||
<span class="post-cat">分类：
|
||||
<%-
|
||||
list_categories(post.categories, {
|
||||
show_count: false,
|
||||
class: 'cat',
|
||||
style: 'none',
|
||||
separator: '|'
|
||||
})
|
||||
%>
|
||||
</span>
|
||||
<span class="post-tags">
|
||||
标签：
|
||||
<%- partial('post/tag') %>
|
||||
</span>
|
||||
</p>
|
||||
</article>
|
||||
<!-- 分享按钮 -->
|
||||
<%- partial('post/share') %>
|
||||
|
||||
<%- partial('post/nav', { post: post }) %>
|
||||
<!-- 文章评论 -->
|
||||
<%- partial('post/comment') %>
|
||||
@@ -0,0 +1,11 @@
|
||||
<% if (theme.baidu_analytics) { %>
|
||||
<script>
|
||||
var _hmt = _hmt || [];
|
||||
(function() {
|
||||
var hm = document.createElement("script");
|
||||
hm.src = "//hm.baidu.com/hm.js?fd459238242776d173cdc64918fb32f2";
|
||||
var s = document.getElementsByTagName("script")[0];
|
||||
s.parentNode.insertBefore(hm, s);
|
||||
})();
|
||||
</script>
|
||||
<% } %>
|
||||
@@ -0,0 +1,11 @@
|
||||
<footer class="footer">
|
||||
©
|
||||
<% if (new Date().getFullYear() == 2016) { %>
|
||||
<%- new Date().getFullYear() %>
|
||||
<% } else { %>
|
||||
2016-<%- new Date().getFullYear() %>
|
||||
<% } %>
|
||||
|
||||
<a href="<%- url_for() %>">Power By Hexo</a>
|
||||
</footer>
|
||||
<div class="back-to-top" id="JELON__backToTop" title="返回顶部">返回顶部</div>
|
||||
@@ -0,0 +1,41 @@
|
||||
<!doctype html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8" >
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=11,IE=10,IE=9,IE=8" >
|
||||
<meta name="baidu-site-verification" content="dIcXMeY8Ya" />
|
||||
<%
|
||||
var title = page.title;
|
||||
|
||||
if (is_archive()) {
|
||||
title = '文章归档';
|
||||
if (is_month()){
|
||||
title += ': ' + page.year + '/' + page.month;
|
||||
} else if (is_year()) {
|
||||
title += ': ' + page.year;
|
||||
}
|
||||
} else if (is_category()) {
|
||||
title = '`' + page.category + '`分类下的文章';
|
||||
} else if (is_tag()) {
|
||||
title = '`' + page.tag + '`标签下的文章';
|
||||
}
|
||||
%>
|
||||
<title><% if (title) { %><%= title %> | <% } %><%= config.title %></title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0" >
|
||||
<meta name="keywords" content="<%- theme.SEO.keywords %>" >
|
||||
<meta name="description" content="<%- theme.SEO.description %>" >
|
||||
|
||||
<% if (theme.rss) { %>
|
||||
<link rel="alternative" href="<%- theme.rss %>" title="<%= config.title %>" type="application/atom+xml" >
|
||||
<% } %>
|
||||
<% if (config.favicon) { %>
|
||||
<link rel="shortcut icon" href="<%- url_for(config.favicon) %>" >
|
||||
<% } else { %>
|
||||
<link rel="shortcut icon" href="<%- url_for(theme.favicon) %>" >
|
||||
<% } %>
|
||||
<%- css('css/style') %>
|
||||
<!--[if lt IE 9]>
|
||||
<%- js('js/html5') %>
|
||||
<![endif]-->
|
||||
<%- partial('baidu-analytics') %>
|
||||
</head>
|
||||
@@ -0,0 +1,52 @@
|
||||
<header class="header">
|
||||
<section class="container header-main">
|
||||
<div class="logo">
|
||||
<a href="<%- url_for() %>">
|
||||
<div class="cover">
|
||||
<span class="name"><%= config.title %></span>
|
||||
<span class="description"><%= config.subtitle %></span>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="dropnav icon-paragraph-justify" id="JELON__btnDropNav"></div>
|
||||
<ul class="menu hidden" id="JELON__menu">
|
||||
<% for (var i in theme.menu) { %>
|
||||
<li rel="<%= url_for(path) %>" class="item <%= url_for(theme.menu[i].link) == url_for(path).substring(0, url_for(path).lastIndexOf('/') + 1) ? 'current' : '' %>">
|
||||
<a href="<%= url_for(theme.menu[i].link) %>" title="<%= theme.menu[i].name %>" class="<%= theme.menu[i].icon %>"> <%= theme.menu[i].name %></a>
|
||||
</li>
|
||||
<% } %>
|
||||
</ul>
|
||||
<div class="profile clearfix">
|
||||
<div class="feeds fl">
|
||||
<% if (theme.head_links.enable) { %>
|
||||
<%
|
||||
var supList = theme.head_links.list.sup,
|
||||
subList = theme.head_links.list.sub;
|
||||
%>
|
||||
<p class="links">
|
||||
<% for (var i in supList) { %>
|
||||
<a href="<%= supList[i]['link'] %>" target="_blank"><%= supList[i]['name'] %></a>
|
||||
<% if (i != 'last') { %>|<% } %>
|
||||
<% } %>
|
||||
</p>
|
||||
<p class="sns">
|
||||
<% for (var j in subList) { %>
|
||||
<a href="<%= subList[j]['link'] %>" class="<%= j %>" target="_blank"><b>■</b> <%= subList[j]['name'] %></a>
|
||||
<% } %>
|
||||
<a href="javascript: void(0);" class="wechat">
|
||||
<b>■</b>
|
||||
公众号
|
||||
<span class="popover">
|
||||
<img src="<%= url_for('img/wechat_mp.jpg') %>" width="120" height="120" alt="我的微信订阅号">
|
||||
<i class="arrow"></i>
|
||||
</span>
|
||||
</a>
|
||||
</p>
|
||||
<% } %>
|
||||
</div>
|
||||
<div class="avatar fr">
|
||||
<img src="<%- theme.avatar %>" alt="avatar" title="Jelon" >
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</header>
|
||||
@@ -0,0 +1,4 @@
|
||||
<!-- 文档分类 -->
|
||||
<% if (post.categories && post.categories.length) { %>
|
||||
|
||||
<% } %>
|
||||
@@ -0,0 +1,77 @@
|
||||
<% if (theme.comment.enable) { %>
|
||||
<%- js('js/comment') %>
|
||||
<div id="comments" class="comment">
|
||||
<!--
|
||||
<div class="sign-bar">
|
||||
GitHub 已登录!
|
||||
<span class="sign-link">登出</span>
|
||||
</div>
|
||||
<section class="box">
|
||||
<div class="com-avatar"><img src="/img/jelon.jpg" alt="avatar"></div>
|
||||
<div class="com-text">
|
||||
<div class="main">
|
||||
<textarea class="text-area-edited show" placeholder="欢迎评论！"></textarea>
|
||||
<div class="text-area-preview"></div>
|
||||
</div>
|
||||
<div class="switch">
|
||||
<div class="switch-item on">编辑</div>
|
||||
<div class="switch-item">预览</div>
|
||||
</div>
|
||||
<div class="button">提交</div>
|
||||
</div>
|
||||
</section>
|
||||
<section class="tips">注：评论支持 markdown 语法！</section>
|
||||
<section class="list-wrap">
|
||||
<ul class="list">
|
||||
<li>
|
||||
<div class="user-avatar">
|
||||
<a href="/">
|
||||
<img src="/img/jelon.jpg" alt="user-avatar">
|
||||
</a>
|
||||
</div>
|
||||
<div class="user-comment">
|
||||
<div class="user-comment-header">
|
||||
<span class="post-name">张德龙</span>
|
||||
<span class="post-time">2017年12月12日</span>
|
||||
<span class="like liked">已赞</span>
|
||||
<span class="like-num">2</span>
|
||||
</div>
|
||||
<div class="user-comment-body">333333</div>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="user-avatar">
|
||||
<a href="/">
|
||||
<img src="/img/jelon.jpg" alt="user-avatar">
|
||||
</a>
|
||||
</div>
|
||||
<div class="user-comment">
|
||||
<div class="user-comment-header">
|
||||
<span class="post-name">刘德华</span>
|
||||
<span class="post-time">2017年12月12日</span>
|
||||
<span class="like">点赞</span>
|
||||
<span class="like-num">2</span>
|
||||
</div>
|
||||
<div class="user-comment-body">vvvvv</div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="page-nav">
|
||||
<a href="javascript: void(0);" class="item">1</a>
|
||||
<a href="javascript: void(0);" class="item">2</a>
|
||||
<a href="javascript: void(0);" class="item current">3</a>
|
||||
</div>
|
||||
</section>
|
||||
-->
|
||||
</div>
|
||||
<script>
|
||||
JELON.Comment({
|
||||
container: 'comments',
|
||||
label: '<%- post.slug %>' || '<%- post.path %>',
|
||||
owner: '<%- theme.comment.owner %>',
|
||||
repo: '<%- theme.comment.repo %>',
|
||||
clientId: '<%- theme.comment.client_id %>',
|
||||
clientSecret: '<%- theme.comment.client_secret %>'
|
||||
});
|
||||
</script>
|
||||
<% } %>
|
||||
@@ -0,0 +1 @@
|
||||
<time datetime="<%= date_xml(post.date) %>"><%= date(post.date, date_format) %></time>
|
||||
@@ -0,0 +1,4 @@
|
||||
<% if (post.photos && post.photos.length) { %>
|
||||
<!-- 相册 -->
|
||||
|
||||
<% } %>
|
||||
@@ -0,0 +1,40 @@
|
||||
<!-- 上一篇/下一篇 -->
|
||||
<% if (post.prev || post.next) { %>
|
||||
<div class="article-nav clearfix">
|
||||
<% if (post.prev) { %>
|
||||
<span class="prev fl">
|
||||
上一篇<br >
|
||||
<a href="<%- url_for(post.prev.path) %>">
|
||||
<% if (post.prev.title) { %>
|
||||
<%= post.prev.title %>
|
||||
<% } else { %>
|
||||
无标题
|
||||
<% } %>
|
||||
</a>
|
||||
</span>
|
||||
<% } else { %>
|
||||
<span class="prev fl">
|
||||
上一篇<br >
|
||||
<a href="javascript: void(0);">没有上一篇了</a>
|
||||
</span>
|
||||
<% } %>
|
||||
|
||||
<% if (post.next) { %>
|
||||
<span class="next fr">
|
||||
下一篇<br >
|
||||
<a href="<%- url_for(post.next.path) %>">
|
||||
<% if (post.next.title) { %>
|
||||
<%= post.next.title %>
|
||||
<% } else { %>
|
||||
无标题
|
||||
<% } %>
|
||||
</a>
|
||||
</span>
|
||||
<% } else { %>
|
||||
<span class="next fr">
|
||||
下一篇<br >
|
||||
<a href="javascript: void(0);">没有下一篇了</a>
|
||||
</span>
|
||||
<% } %>
|
||||
</div>
|
||||
<% } %>
|
||||
@@ -0,0 +1,12 @@
|
||||
<% if (theme.share) { %>
|
||||
<div class="article-share clearfix text-center">
|
||||
<div class="share-area">
|
||||
<span class="share-txt">分享到：</span>
|
||||
<a href="javascript: window.open('http://service.weibo.com/share/share.php?url=' + encodeURIComponent(location.href) + '&title=' + document.title + '&language=zh_cn');" class="share-icon weibo"></a>
|
||||
<a href="javascript: alert('请复制链接到微信并发送');" class="share-icon wechat"></a>
|
||||
<a href="javascript: window.open('http://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?url=' + encodeURIComponent(location.href) + '&title=' + document.title);" class="share-icon qqzone"></a>
|
||||
<a href="javascript: window.open('http://connect.qq.com/widget/shareqq/index.html?url=' + encodeURIComponent(location.href) + '&desc=Jelon个人博客&title=' + document.title + '&callback=' + encodeURIComponent(location.href));" class="share-icon qq"></a>
|
||||
<a href="javascript: window.open('http://shuo.douban.com/!service/share?href=' + encodeURIComponent(location.href) + '&name=' + document.title + '&text=' + document.title);" class="share-icon douban"></a>
|
||||
</div>
|
||||
</div>
|
||||
<% } %>
|
||||
@@ -0,0 +1,5 @@
|
||||
<% if (post.tags && post.tags.length) { %>
|
||||
<% post.tags.forEach(function(tag, i) { %>
|
||||
<%- link_to(tag.path, tag.name) %><% if (i != post.tags.length - 1) { %> / <% } %>
|
||||
<% }); %>
|
||||
<% } %>
|
||||
@@ -0,0 +1,13 @@
|
||||
<% if (post.link) { %>
|
||||
<h3 class="<%= class_name || 'post-title' %>">
|
||||
<a href="<%= url_for(post.link) %>">
|
||||
<%= post.title || post.link %>
|
||||
</a>
|
||||
</h3>
|
||||
<% } else if (post.title) { %>
|
||||
<h3 class="<%= class_name || 'post-title' %>">
|
||||
<a href="<%= url_for(post.permalink) %>">
|
||||
<%= post.title %>
|
||||
</a>
|
||||
</h3>
|
||||
<% } %>
|
||||
@@ -0,0 +1,31 @@
|
||||
<!-- 侧栏部分 -->
|
||||
<aside class="sidebar">
|
||||
<section class="widget">
|
||||
<h3 class="widget-hd"><strong>文章分类</strong></h3>
|
||||
<%- partial('_widget/categorys') %>
|
||||
</section>
|
||||
|
||||
<% if (theme.tagcloud) { %>
|
||||
<section class="widget">
|
||||
<h3 class="widget-hd"><strong>热门标签</strong></h3>
|
||||
<%- partial('_widget/tags') %>
|
||||
</section>
|
||||
<% } %>
|
||||
|
||||
<% if (theme.weibo_show.enable) { %>
|
||||
<!-- 我的微博 -->
|
||||
<section class="widget">
|
||||
<h3 class="widget-hd"><strong>我的微博</strong></h3>
|
||||
<%- partial('_widget/weibo') %>
|
||||
</section>
|
||||
<% } %>
|
||||
|
||||
<% if (theme.friends.enable && theme.friends['list']) { %>
|
||||
<!-- 友情链接 -->
|
||||
<section class="widget">
|
||||
<h3 class="widget-hd"><strong>友情链接</strong></h3>
|
||||
<%- partial('_widget/friend_links') %>
|
||||
</section>
|
||||
<% } %>
|
||||
</aside>
|
||||
<!-- / 侧栏部分 -->
|
||||
@@ -0,0 +1,9 @@
|
||||
<!-- 文章分类 -->
|
||||
<ul class="widget-bd">
|
||||
<% site.categories.forEach(function(cat){ %>
|
||||
<li>
|
||||
<a href="<%= url_for(cat.path) %>"><%= cat.name %></a>
|
||||
<span class="badge">(<%= cat.length %>)</span>
|
||||
</li>
|
||||
<% }); %>
|
||||
</ul>
|
||||
@@ -0,0 +1,11 @@
|
||||
<!-- 文章分类 -->
|
||||
<ul class="widget-bd">
|
||||
<%
|
||||
var list = theme.friends['list'];
|
||||
for (var i in list) {
|
||||
%>
|
||||
<li>
|
||||
<a href="<%= list[i].link %>" target="_blank" title="<%= list[i].title %>"><%= list[i].name %></a>
|
||||
</li>
|
||||
<% } %>
|
||||
</ul>
|
||||
@@ -0,0 +1,12 @@
|
||||
<!-- 文章标签 -->
|
||||
<div class="widget-bd tag-wrap">
|
||||
<%
|
||||
site.tags.forEach(function (tag, index) {
|
||||
if (index < 39) {
|
||||
%>
|
||||
<a class="tag-item" href="<%= url_for(tag.path) %>" title="<%= tag.name %>"><%- tag.name %> (<%- tag.length %>)</a>
|
||||
<%
|
||||
}
|
||||
});
|
||||
%>
|
||||
</div>
|
||||
@@ -0,0 +1,29 @@
|
||||
<div class="widget-bd" style="position: relative;">
|
||||
<div id="myWeiboLoading" class="text-center" style="position:absolute;top:0;left:0;right:0;bottom:0;line-height:50px;font-size:12px;background-color:#fff;z-index:9;">微博加载中...</div>
|
||||
<%- theme.weibo_show.code %>
|
||||
<script>
|
||||
(function () {
|
||||
var oMyWeibo = document.getElementById('myWeibo');
|
||||
var oMyWeiboLoading = document.getElementById('myWeiboLoading');
|
||||
var isIE = /msie/i.test(navigator.userAgent) && !window.opera;
|
||||
var timer = null;
|
||||
if (isIE) {
|
||||
oMyWeibo.onreadystatechange = function(){
|
||||
if(oMyWeibo.readyState === 'loaded' || oMyWeibo.readyState === 'complete'){
|
||||
timer = setTimeout(function () {
|
||||
oMyWeiboLoading.parentNode.removeChild(oMyWeiboLoading);
|
||||
timer = null;
|
||||
}, 300);
|
||||
}
|
||||
};
|
||||
} else {
|
||||
oMyWeibo.onload = function () {
|
||||
timer = setTimeout(function () {
|
||||
oMyWeiboLoading.parentNode.removeChild(oMyWeiboLoading);
|
||||
timer = null;
|
||||
}, 300);
|
||||
};
|
||||
}
|
||||
})();
|
||||
</script>
|
||||
</div>
|
||||
@@ -0,0 +1,2 @@
|
||||
<!-- 文章归档 -->
|
||||
<%- partial('_partial/archive', { pagination: 3, index: true }) %>
|
||||
@@ -0,0 +1,2 @@
|
||||
<!-- 文章分类 -->
|
||||
<%- partial('_partial/archive', { pagination: 4, index: true }) %>
|
||||
@@ -0,0 +1,6 @@
|
||||
<!-- 首页 -->
|
||||
<% if (page.content) { %>
|
||||
<%- page.content %>
|
||||
<% } else { %>
|
||||
<%- partial('_partial/archive', { pagination: 2, index: true }) %>
|
||||
<% } %>
|
||||
@@ -0,0 +1,29 @@
|
||||
<%- partial('_partial/head') %>
|
||||
<body class="home">
|
||||
<!--[if lt IE 9]>
|
||||
<div class="browsehappy">
|
||||
当前网页 <strong>不支持</strong>
|
||||
你正在使用的浏览器. 为了正常的访问, 请 <a href="http://browsehappy.com/">升级你的浏览器</a>.
|
||||
</div>
|
||||
<![endif]-->
|
||||
|
||||
<!-- 博客头部 -->
|
||||
<%- partial('_partial/header') %>
|
||||
|
||||
<!-- 博客正文 -->
|
||||
<div class="container body clearfix">
|
||||
<section class="content">
|
||||
<div class="content-main widget">
|
||||
<%- body %>
|
||||
</div>
|
||||
|
||||
</section>
|
||||
<%- partial('_partial/sidebar') %>
|
||||
</div>
|
||||
|
||||
<!-- 博客底部 -->
|
||||
<%- partial('_partial/footer') %>
|
||||
<!--博客js脚本 -->
|
||||
<%- partial('_partial/after-footer') %>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,17 @@
|
||||
<!-- 独立页面 -->
|
||||
<article class="post article">
|
||||
<header class="text-center">
|
||||
<h4 class="post-title"><a href="javascript: void(0);"><%- page.title %></a></h4>
|
||||
</header>
|
||||
<div class="post-content">
|
||||
<% if (page.pageid && page.pageid == 'about') { %>
|
||||
<%- partial('_custom/about', { page: page, post: page }) %>
|
||||
<% } else if (page.pageid && page.pageid == 'lab') { %>
|
||||
<%- partial('_custom/lab', { page: page, post: page }) %>
|
||||
<% } else if (page.pageid && page.pageid == 'comment') { %>
|
||||
<%- partial('_custom/comment', { page: page, post: page }) %>
|
||||
<% } else { %>
|
||||
<%- page.content %>
|
||||
<% } %>
|
||||
</div>
|
||||
</article>
|
||||
@@ -0,0 +1,2 @@
|
||||
<!-- 文章页 -->
|
||||
<%- partial('_partial/article', { index: false, post: page }) %>
|
||||
@@ -0,0 +1,2 @@
|
||||
<!-- 按标签分类 -->
|
||||
<%- partial('_partial/archive', { pagination: 5, index: true }) %>
|
||||
@@ -0,0 +1 @@
|
||||
<!-- 文章按标签归档 -->
|
||||
@@ -0,0 +1,77 @@
|
||||
/*!
|
||||
* 网站字体及icon
|
||||
* $CDN = hexo-config("CDN") || '//7xs305.com1.z0.glb.clouddn.com/'
|
||||
*/
|
||||
$CDN = hexo-config("CDN") || './fonts/'
|
||||
|
||||
@font-face
|
||||
font-family "HomizioNova"
|
||||
src url($CDN + 'homizio-nova/light.ttf'),url($CDN + 'homizio-nova/light.otf')
|
||||
font-weight normal
|
||||
font-style normal
|
||||
@font-face
|
||||
font-family "HomizioNova"
|
||||
src url($CDN + 'homizio-nova/light_italic.ttf'),url($CDN + 'homizio-nova/light_italic.otf')
|
||||
font-weight normal
|
||||
font-style italic
|
||||
@font-face
|
||||
font-family "HomizioNova"
|
||||
src url($CDN + 'homizio-nova/regular.ttf'),url($CDN + 'homizio-nova/regular.otf')
|
||||
font-weight bold
|
||||
font-style normal
|
||||
@font-face
|
||||
font-family "HomizioNova"
|
||||
src url($CDN + 'homizio-nova/italic.ttf'),url($CDN + 'homizio-nova/italic.otf')
|
||||
font-weight bold
|
||||
font-style italic
|
||||
@font-face
|
||||
font-family 'icomoon'
|
||||
src url($CDN + 'icomoon/icomoon.eot?e2xg5y'), url('./fonts/icomoon/icomoon.eot?e2xg5y')
|
||||
src url($CDN + 'icomoon/icomoon.eot?#iefixe2xg5y') format('embedded-opentype'),
|
||||
url($CDN + 'icomoon/icomoon.woff?e2xg5y') format('woff'),
|
||||
url($CDN + 'icomoon/icomoon.ttf?e2xg5y') format('truetype'),
|
||||
url($CDN + 'icomoon/icomoon.svg?e2xg5y#icomoon') format('svg'),
|
||||
url('./fonts/icomoon/icomoon.eot?#iefixe2xg5y') format('embedded-opentype'),
|
||||
url('./fonts/icomoon/icomoon.woff?e2xg5y') format('woff'),
|
||||
url('./fonts/icomoon/icomoon.ttf?e2xg5y') format('truetype'),
|
||||
url('./fonts/icomoon/icomoon.svg?e2xg5y#icomoon') format('svg')
|
||||
font-weight normal
|
||||
font-style normal
|
||||
[class^="icon-"],[class*=" icon-"]
|
||||
font-family 'icomoon'
|
||||
speak none
|
||||
font-style normal
|
||||
font-weight normal
|
||||
font-variant normal
|
||||
text-transform none
|
||||
line-height 1
|
||||
-webkit-font-smoothing antialiased
|
||||
-moz-osx-font-smoothing grayscale
|
||||
.icon-home:before
|
||||
content "\e900"
|
||||
.icon-office:before
|
||||
content "\e903"
|
||||
.icon-newspaper:before
|
||||
content "\e904"
|
||||
.icon-profile:before
|
||||
content "\e923"
|
||||
.icon-files-empty:before
|
||||
content "\e925"
|
||||
.icon-price-tags:before
|
||||
content "\e936"
|
||||
.icon-envelop:before
|
||||
content "\e945"
|
||||
.icon-bubble:before
|
||||
content "\e96b"
|
||||
.icon-comment:before
|
||||
content "\e96d"
|
||||
.icon-about:before
|
||||
content "\e976"
|
||||
.icon-cogs:before
|
||||
content "\e995"
|
||||
.icon-paragraph-justify:before
|
||||
content "\ea7a"
|
||||
.icon-lab:before
|
||||
content "\ea80"
|
||||
.icon-github:before
|
||||
content "\eab1"
|
||||
@@ -0,0 +1,51 @@
|
||||
/*!
|
||||
* 全局样式
|
||||
*/
|
||||
.container
|
||||
max-width 1180px
|
||||
_width 1180px
|
||||
background-color c-fff
|
||||
margin 0 auto 10px
|
||||
text-left()
|
||||
.home
|
||||
//margin-top 78px
|
||||
background-color c-eee
|
||||
.btn
|
||||
background-color #ff5e52
|
||||
border 0
|
||||
color c-fff
|
||||
opacity .8
|
||||
box-sizing border-box
|
||||
&:hover
|
||||
opacity .75
|
||||
.btn-ok
|
||||
background-color #ff5e52
|
||||
.btn-cancel
|
||||
background-color #51cc87
|
||||
.form-control
|
||||
box-sizing border-box
|
||||
|
||||
.browsehappy
|
||||
padding 8px 0
|
||||
background #fbe3e4
|
||||
color #8a1f11
|
||||
text-align center
|
||||
.loading-mask
|
||||
position fixed
|
||||
top 0
|
||||
right 0
|
||||
left 0
|
||||
bottom 0
|
||||
display block
|
||||
width 100%
|
||||
height 100%
|
||||
background-color rgb(255, 255, 255)
|
||||
opacity .8
|
||||
.loading-icon
|
||||
position relative
|
||||
top 50%
|
||||
left 50%
|
||||
width 50px
|
||||
height 50px
|
||||
margin-top -25px
|
||||
margin-left -25px
|
||||
@@ -0,0 +1,157 @@
|
||||
html
|
||||
font-family sans-serif
|
||||
-ms-text-size-adjust 100%
|
||||
-webkit-text-size-adjust 100%
|
||||
body
|
||||
margin: 0
|
||||
article,
|
||||
aside,
|
||||
details,
|
||||
figcaption,
|
||||
figure,
|
||||
footer,
|
||||
header,
|
||||
hgroup,
|
||||
main,
|
||||
menu,
|
||||
nav,
|
||||
section,
|
||||
summary
|
||||
display block
|
||||
|
||||
audio,
|
||||
canvas,
|
||||
progress,
|
||||
video
|
||||
display inline-block
|
||||
vertical-align baseline
|
||||
|
||||
audio:not([controls])
|
||||
display none
|
||||
height 0
|
||||
[hidden],
|
||||
template
|
||||
display none
|
||||
a
|
||||
background-color transparent
|
||||
|
||||
a:active,
|
||||
a:hover
|
||||
outline: 0
|
||||
abbr[title]
|
||||
border-bottom 1px dotted
|
||||
|
||||
b,
|
||||
strong
|
||||
font-weight bold
|
||||
dfn
|
||||
font-style italic
|
||||
h1
|
||||
font-size 2em
|
||||
margin 0.67em 0
|
||||
|
||||
mark
|
||||
background #ff0
|
||||
color #000
|
||||
small
|
||||
font-size 80%
|
||||
sub,
|
||||
sup
|
||||
font-size 75%
|
||||
line-height 0
|
||||
position relative
|
||||
vertical-align baseline
|
||||
sup
|
||||
top -0.5em
|
||||
sub
|
||||
bottom -0.25em
|
||||
img
|
||||
border 0
|
||||
svg:not(:root)
|
||||
overflow hidden
|
||||
|
||||
figure
|
||||
margin 1em 40px
|
||||
|
||||
hr
|
||||
-moz-box-sizing content-box
|
||||
box-sizing content-box
|
||||
height 0
|
||||
pre
|
||||
overflow auto
|
||||
code,
|
||||
kbd,
|
||||
pre,
|
||||
samp
|
||||
font-family monospace, monospace
|
||||
font-size 1em
|
||||
|
||||
button,
|
||||
input,
|
||||
optgroup,
|
||||
select,
|
||||
textarea
|
||||
color inherit /* 1 */
|
||||
font inherit /* 2 */
|
||||
margin 0 /* 3 */
|
||||
|
||||
button
|
||||
overflow visible
|
||||
|
||||
button,
|
||||
select
|
||||
text-transform none
|
||||
|
||||
button,
|
||||
html input[type="button"], /* 1 */
|
||||
input[type="reset"],
|
||||
input[type="submit"]
|
||||
-webkit-appearance button /* 2 */
|
||||
cursor pointer /* 3 */
|
||||
|
||||
button[disabled],
|
||||
html input[disabled]
|
||||
cursor default
|
||||
|
||||
button::-moz-focus-inner,
|
||||
input::-moz-focus-inner
|
||||
border 0
|
||||
padding 0
|
||||
input
|
||||
line-height normal
|
||||
input[type="checkbox"],
|
||||
input[type="radio"]
|
||||
box-sizing border-box /* 1 */
|
||||
padding 0 /* 2 */
|
||||
input[type="number"]::-webkit-inner-spin-button,
|
||||
input[type="number"]::-webkit-outer-spin-button
|
||||
height auto
|
||||
|
||||
input[type="search"]
|
||||
-webkit-appearance textfield /* 1 */
|
||||
-moz-box-sizing content-box
|
||||
-webkit-box-sizing content-box /* 2 */
|
||||
box-sizing content-box
|
||||
input[type="search"]::-webkit-search-cancel-button,
|
||||
input[type="search"]::-webkit-search-decoration
|
||||
-webkit-appearance none
|
||||
|
||||
fieldset
|
||||
border 1px solid #c0c0c0
|
||||
margin 0 2px
|
||||
padding 0.35em 0.625em 0.75em
|
||||
legend
|
||||
border 0
|
||||
padding 0
|
||||
textarea
|
||||
overflow auto
|
||||
|
||||
optgroup
|
||||
font-weight: bold
|
||||
|
||||
table
|
||||
border-collapse collapse
|
||||
border-spacing 0
|
||||
td,
|
||||
th
|
||||
padding 0
|
||||
@@ -0,0 +1,48 @@
|
||||
/*!
|
||||
* Reset css
|
||||
*/
|
||||
::selection
|
||||
color c-fff
|
||||
background-color #f99
|
||||
opacity .8
|
||||
::-webkit-scrollbar
|
||||
width 7px
|
||||
height 4px
|
||||
::-webkit-scrollbar-thumb
|
||||
border-radius 4px
|
||||
background rgba(0, 0, 0, .15)
|
||||
::-webkit-scrollbar-track
|
||||
background rgba(0, 0, 0, .06)
|
||||
body
|
||||
font 14px/1.5 "Microsoft Yahei", "微软雅黑", Arial, "宋体"
|
||||
color c-666
|
||||
-webkit-overflow-scrolling touch // iOS下支持弹性滚动
|
||||
-webkit-font-smoothing antialiased // 优化字体渲染、让页面字体更精更清楚
|
||||
-webkit-text-size-adjust 100%
|
||||
-ms-text-size-adjust 100%
|
||||
text-rendering optimizelegibility
|
||||
a
|
||||
color c-666
|
||||
text-decoration none
|
||||
&:link,
|
||||
&:visited,
|
||||
&:active
|
||||
color c-666
|
||||
&:hover
|
||||
color #ff5e52
|
||||
hr
|
||||
border-top 1px solid c-eee
|
||||
.fl
|
||||
float left
|
||||
.fr
|
||||
float right
|
||||
.text-center
|
||||
text-center()
|
||||
.clearfix
|
||||
zoom 1
|
||||
&:after
|
||||
display block
|
||||
width 100%
|
||||
height 0
|
||||
content " "
|
||||
clear both
|
||||
@@ -0,0 +1,65 @@
|
||||
$base-style
|
||||
h1
|
||||
font-size: 2em
|
||||
h2
|
||||
font-size: 1.6em
|
||||
h3
|
||||
font-size: 1.4em
|
||||
h4
|
||||
font-size: 1.2em
|
||||
h5
|
||||
font-size: 1em
|
||||
h6
|
||||
font-size: 1em
|
||||
color: #999
|
||||
hr
|
||||
border: 1px dashed #ddd
|
||||
strong
|
||||
font-weight: bold
|
||||
em, cite
|
||||
font-style: italic
|
||||
sup, sub
|
||||
font-size: 0.75em
|
||||
line-height: 0
|
||||
position: relative
|
||||
vertical-align: baseline
|
||||
sup
|
||||
top: -0.5em
|
||||
sub
|
||||
bottom: -0.2em
|
||||
small
|
||||
font-size: 0.85em
|
||||
acronym, abbr
|
||||
border-bottom: 1px dotted
|
||||
ul, ol, dl
|
||||
margin: 0 20px
|
||||
padding: 0
|
||||
line-height: line-height
|
||||
ul, ol
|
||||
ul, ol
|
||||
margin-top: 0
|
||||
margin-bottom: 0
|
||||
ul
|
||||
list-style: disc
|
||||
ol
|
||||
list-style: decimal
|
||||
dt
|
||||
font-weight: bold
|
||||
table
|
||||
display: table;
|
||||
font-size: 12px;
|
||||
background-color: transparent;
|
||||
border: 1px solid #ddd;
|
||||
box-sizing: border-box;
|
||||
word-wrap: break-word;
|
||||
th, td
|
||||
border-bottom: solid 1px #ddd;
|
||||
border-right: solid 1px #ddd;
|
||||
padding: 5px 10px;
|
||||
thead tr
|
||||
background-color: #f6f6f6;
|
||||
blockquote
|
||||
margin 1em 0
|
||||
padding 5px 10px
|
||||
color #666
|
||||
border-left 2px solid #eee
|
||||
@@ -0,0 +1,699 @@
|
||||
@font-face {
|
||||
font-family: octicons-link;
|
||||
src: url("data:font/woff;charset=utf-8;base64,d09GRgABAAAAAAZwABAAAAAACFQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABEU0lHAAAGaAAAAAgAAAAIAAAAAUdTVUIAAAZcAAAACgAAAAoAAQAAT1MvMgAAAyQAAABJAAAAYFYEU3RjbWFwAAADcAAAAEUAAACAAJThvmN2dCAAAATkAAAABAAAAAQAAAAAZnBnbQAAA7gAAACyAAABCUM+8IhnYXNwAAAGTAAAABAAAAAQABoAI2dseWYAAAFsAAABPAAAAZwcEq9taGVhZAAAAsgAAAA0AAAANgh4a91oaGVhAAADCAAAABoAAAAkCA8DRGhtdHgAAAL8AAAADAAAAAwGAACfbG9jYQAAAsAAAAAIAAAACABiATBtYXhwAAACqAAAABgAAAAgAA8ASm5hbWUAAAToAAABQgAAAlXu73sOcG9zdAAABiwAAAAeAAAAME3QpOBwcmVwAAAEbAAAAHYAAAB/aFGpk3jaTY6xa8JAGMW/O62BDi0tJLYQincXEypYIiGJjSgHniQ6umTsUEyLm5BV6NDBP8Tpts6F0v+k/0an2i+itHDw3v2+9+DBKTzsJNnWJNTgHEy4BgG3EMI9DCEDOGEXzDADU5hBKMIgNPZqoD3SilVaXZCER3/I7AtxEJLtzzuZfI+VVkprxTlXShWKb3TBecG11rwoNlmmn1P2WYcJczl32etSpKnziC7lQyWe1smVPy/Lt7Kc+0vWY/gAgIIEqAN9we0pwKXreiMasxvabDQMM4riO+qxM2ogwDGOZTXxwxDiycQIcoYFBLj5K3EIaSctAq2kTYiw+ymhce7vwM9jSqO8JyVd5RH9gyTt2+J/yUmYlIR0s04n6+7Vm1ozezUeLEaUjhaDSuXHwVRgvLJn1tQ7xiuVv/ocTRF42mNgZGBgYGbwZOBiAAFGJBIMAAizAFoAAABiAGIAznjaY2BkYGAA4in8zwXi+W2+MjCzMIDApSwvXzC97Z4Ig8N/BxYGZgcgl52BCSQKAA3jCV8CAABfAAAAAAQAAEB42mNgZGBg4f3vACQZQABIMjKgAmYAKEgBXgAAeNpjYGY6wTiBgZWBg2kmUxoDA4MPhGZMYzBi1AHygVLYQUCaawqDA4PChxhmh/8ODDEsvAwHgMKMIDnGL0x7gJQCAwMAJd4MFwAAAHjaY2BgYGaA4DAGRgYQkAHyGMF8NgYrIM3JIAGVYYDT+AEjAwuDFpBmA9KMDEwMCh9i/v8H8sH0/4dQc1iAmAkALaUKLgAAAHjaTY9LDsIgEIbtgqHUPpDi3gPoBVyRTmTddOmqTXThEXqrob2gQ1FjwpDvfwCBdmdXC5AVKFu3e5MfNFJ29KTQT48Ob9/lqYwOGZxeUelN2U2R6+cArgtCJpauW7UQBqnFkUsjAY/kOU1cP+DAgvxwn1chZDwUbd6CFimGXwzwF6tPbFIcjEl+vvmM/byA48e6tWrKArm4ZJlCbdsrxksL1AwWn/yBSJKpYbq8AXaaTb8AAHja28jAwOC00ZrBeQNDQOWO//sdBBgYGRiYWYAEELEwMTE4uzo5Zzo5b2BxdnFOcALxNjA6b2ByTswC8jYwg0VlNuoCTWAMqNzMzsoK1rEhNqByEyerg5PMJlYuVueETKcd/89uBpnpvIEVomeHLoMsAAe1Id4AAAAAAAB42oWQT07CQBTGv0JBhagk7HQzKxca2sJCE1hDt4QF+9JOS0nbaaYDCQfwCJ7Au3AHj+LO13FMmm6cl7785vven0kBjHCBhfpYuNa5Ph1c0e2Xu3jEvWG7UdPDLZ4N92nOm+EBXuAbHmIMSRMs+4aUEd4Nd3CHD8NdvOLTsA2GL8M9PODbcL+hD7C1xoaHeLJSEao0FEW14ckxC+TU8TxvsY6X0eLPmRhry2WVioLpkrbp84LLQPGI7c6sOiUzpWIWS5GzlSgUzzLBSikOPFTOXqly7rqx0Z1Q5BAIoZBSFihQYQOOBEdkCOgXTOHA07HAGjGWiIjaPZNW13/+lm6S9FT7rLHFJ6fQbkATOG1j2OFMucKJJsxIVfQORl+9Jyda6Sl1dUYhSCm1dyClfoeDve4qMYdLEbfqHf3O/AdDumsjAAB42mNgYoAAZQYjBmyAGYQZmdhL8zLdDEydARfoAqIAAAABAAMABwAKABMAB///AA8AAQAAAAAAAAAAAAAAAAABAAAAAA==") format('woff');
|
||||
}
|
||||
$markdown-style
|
||||
.markdown-body
|
||||
-ms-text-size-adjust 100%;
|
||||
-webkit-text-size-adjust: 100%;
|
||||
line-height: 1.5;
|
||||
color: #24292e;
|
||||
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
|
||||
font-size: 16px;
|
||||
line-height: 1.5;
|
||||
word-wrap: break-word;
|
||||
|
||||
.markdown-body .pl-c {
|
||||
color: #6a737d;
|
||||
}
|
||||
|
||||
.markdown-body .pl-c1,
|
||||
.markdown-body .pl-s .pl-v {
|
||||
color: #005cc5;
|
||||
}
|
||||
|
||||
.markdown-body .pl-e,
|
||||
.markdown-body .pl-en {
|
||||
color: #6f42c1;
|
||||
}
|
||||
|
||||
.markdown-body .pl-smi,
|
||||
.markdown-body .pl-s .pl-s1 {
|
||||
color: #24292e;
|
||||
}
|
||||
|
||||
.markdown-body .pl-ent {
|
||||
color: #22863a;
|
||||
}
|
||||
|
||||
.markdown-body .pl-k {
|
||||
color: #d73a49;
|
||||
}
|
||||
|
||||
.markdown-body .pl-s,
|
||||
.markdown-body .pl-pds,
|
||||
.markdown-body .pl-s .pl-pse .pl-s1,
|
||||
.markdown-body .pl-sr,
|
||||
.markdown-body .pl-sr .pl-cce,
|
||||
.markdown-body .pl-sr .pl-sre,
|
||||
.markdown-body .pl-sr .pl-sra {
|
||||
color: #032f62;
|
||||
}
|
||||
|
||||
.markdown-body .pl-v,
|
||||
.markdown-body .pl-smw {
|
||||
color: #e36209;
|
||||
}
|
||||
|
||||
.markdown-body .pl-bu {
|
||||
color: #b31d28;
|
||||
}
|
||||
|
||||
.markdown-body .pl-ii {
|
||||
color: #fafbfc;
|
||||
background-color: #b31d28;
|
||||
}
|
||||
|
||||
.markdown-body .pl-c2 {
|
||||
color: #fafbfc;
|
||||
background-color: #d73a49;
|
||||
}
|
||||
|
||||
.markdown-body .pl-c2::before {
|
||||
content: "^M";
|
||||
}
|
||||
|
||||
.markdown-body .pl-sr .pl-cce {
|
||||
font-weight: bold;
|
||||
color: #22863a;
|
||||
}
|
||||
|
||||
.markdown-body .pl-ml {
|
||||
color: #735c0f;
|
||||
}
|
||||
|
||||
.markdown-body .pl-mh,
|
||||
.markdown-body .pl-mh .pl-en,
|
||||
.markdown-body .pl-ms {
|
||||
font-weight: bold;
|
||||
color: #005cc5;
|
||||
}
|
||||
|
||||
.markdown-body .pl-mi {
|
||||
font-style: italic;
|
||||
color: #24292e;
|
||||
}
|
||||
|
||||
.markdown-body .pl-mb {
|
||||
font-weight: bold;
|
||||
color: #24292e;
|
||||
}
|
||||
|
||||
.markdown-body .pl-md {
|
||||
color: #b31d28;
|
||||
background-color: #ffeef0;
|
||||
}
|
||||
|
||||
.markdown-body .pl-mi1 {
|
||||
color: #22863a;
|
||||
background-color: #f0fff4;
|
||||
}
|
||||
|
||||
.markdown-body .pl-mc {
|
||||
color: #e36209;
|
||||
background-color: #ffebda;
|
||||
}
|
||||
|
||||
.markdown-body .pl-mi2 {
|
||||
color: #f6f8fa;
|
||||
background-color: #005cc5;
|
||||
}
|
||||
|
||||
.markdown-body .pl-mdr {
|
||||
font-weight: bold;
|
||||
color: #6f42c1;
|
||||
}
|
||||
|
||||
.markdown-body .pl-ba {
|
||||
color: #586069;
|
||||
}
|
||||
|
||||
.markdown-body .pl-sg {
|
||||
color: #959da5;
|
||||
}
|
||||
|
||||
.markdown-body .pl-corl {
|
||||
text-decoration: underline;
|
||||
color: #032f62;
|
||||
}
|
||||
|
||||
.markdown-body .octicon {
|
||||
display: inline-block;
|
||||
vertical-align: text-top;
|
||||
fill: currentColor;
|
||||
}
|
||||
|
||||
.markdown-body a {
|
||||
background-color: transparent;
|
||||
-webkit-text-decoration-skip: objects;
|
||||
}
|
||||
|
||||
.markdown-body a:active,
|
||||
.markdown-body a:hover {
|
||||
outline-width: 0;
|
||||
}
|
||||
|
||||
.markdown-body strong {
|
||||
font-weight: inherit;
|
||||
}
|
||||
|
||||
.markdown-body strong {
|
||||
font-weight: bolder;
|
||||
}
|
||||
|
||||
.markdown-body h1 {
|
||||
font-size: 2em;
|
||||
margin: 0.67em 0;
|
||||
}
|
||||
|
||||
.markdown-body img {
|
||||
border-style: none;
|
||||
}
|
||||
|
||||
.markdown-body svg:not(:root) {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.markdown-body code,
|
||||
.markdown-body kbd,
|
||||
.markdown-body pre {
|
||||
font-family: monospace, monospace;
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
.markdown-body hr {
|
||||
box-sizing: content-box;
|
||||
height: 0;
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
.markdown-body input {
|
||||
font: inherit;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.markdown-body input {
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
.markdown-body [type="checkbox"] {
|
||||
box-sizing: border-box;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.markdown-body * {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.markdown-body input {
|
||||
font-family: inherit;
|
||||
font-size: inherit;
|
||||
line-height: inherit;
|
||||
}
|
||||
|
||||
.markdown-body a {
|
||||
color: #0366d6;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.markdown-body a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.markdown-body strong {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.markdown-body hr {
|
||||
height: 0;
|
||||
margin: 15px 0;
|
||||
overflow: hidden;
|
||||
background: transparent;
|
||||
border: 0;
|
||||
border-bottom: 1px solid #dfe2e5;
|
||||
}
|
||||
|
||||
.markdown-body hr::before {
|
||||
display: table;
|
||||
content: "";
|
||||
}
|
||||
|
||||
.markdown-body hr::after {
|
||||
display: table;
|
||||
clear: both;
|
||||
content: "";
|
||||
}
|
||||
|
||||
.markdown-body table {
|
||||
border-spacing: 0;
|
||||
border-collapse: collapse;
|
||||
}
|
||||
|
||||
.markdown-body td,
|
||||
.markdown-body th {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.markdown-body h1,
|
||||
.markdown-body h2,
|
||||
.markdown-body h3,
|
||||
.markdown-body h4,
|
||||
.markdown-body h5,
|
||||
.markdown-body h6 {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.markdown-body h1 {
|
||||
font-size: 32px;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.markdown-body h2 {
|
||||
font-size: 24px;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.markdown-body h3 {
|
||||
font-size: 20px;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.markdown-body h4 {
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.markdown-body h5 {
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.markdown-body h6 {
|
||||
font-size: 12px;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.markdown-body p {
|
||||
margin-top: 0;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.markdown-body blockquote {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.markdown-body ul,
|
||||
.markdown-body ol {
|
||||
padding-left: 0;
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.markdown-body ol ol,
|
||||
.markdown-body ul ol {
|
||||
list-style-type: lower-roman;
|
||||
}
|
||||
|
||||
.markdown-body ul ul ol,
|
||||
.markdown-body ul ol ol,
|
||||
.markdown-body ol ul ol,
|
||||
.markdown-body ol ol ol {
|
||||
list-style-type: lower-alpha;
|
||||
}
|
||||
|
||||
.markdown-body dd {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.markdown-body code {
|
||||
font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, Courier, monospace;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.markdown-body pre {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
font: 12px "SFMono-Regular", Consolas, "Liberation Mono", Menlo, Courier, monospace;
|
||||
}
|
||||
|
||||
.markdown-body .octicon {
|
||||
vertical-align: text-bottom;
|
||||
}
|
||||
|
||||
.markdown-body .pl-0 {
|
||||
padding-left: 0 !important;
|
||||
}
|
||||
|
||||
.markdown-body .pl-1 {
|
||||
padding-left: 4px !important;
|
||||
}
|
||||
|
||||
.markdown-body .pl-2 {
|
||||
padding-left: 8px !important;
|
||||
}
|
||||
|
||||
.markdown-body .pl-3 {
|
||||
padding-left: 16px !important;
|
||||
}
|
||||
|
||||
.markdown-body .pl-4 {
|
||||
padding-left: 24px !important;
|
||||
}
|
||||
|
||||
.markdown-body .pl-5 {
|
||||
padding-left: 32px !important;
|
||||
}
|
||||
|
||||
.markdown-body .pl-6 {
|
||||
padding-left: 40px !important;
|
||||
}
|
||||
|
||||
.markdown-body::before {
|
||||
display: table;
|
||||
content: "";
|
||||
}
|
||||
|
||||
.markdown-body::after {
|
||||
display: table;
|
||||
clear: both;
|
||||
content: "";
|
||||
}
|
||||
|
||||
.markdown-body>*:first-child {
|
||||
margin-top: 0 !important;
|
||||
}
|
||||
|
||||
.markdown-body>*:last-child {
|
||||
margin-bottom: 0 !important;
|
||||
}
|
||||
|
||||
.markdown-body a:not([href]) {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.markdown-body .anchor {
|
||||
float: left;
|
||||
padding-right: 4px;
|
||||
margin-left: -20px;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.markdown-body .anchor:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.markdown-body p,
|
||||
.markdown-body blockquote,
|
||||
.markdown-body ul,
|
||||
.markdown-body ol,
|
||||
.markdown-body dl,
|
||||
.markdown-body table,
|
||||
.markdown-body pre {
|
||||
margin-top: 0;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.markdown-body hr {
|
||||
height: 0.25em;
|
||||
padding: 0;
|
||||
margin: 24px 0;
|
||||
background-color: #e1e4e8;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.markdown-body blockquote {
|
||||
padding: 0 1em;
|
||||
color: #6a737d;
|
||||
border-left: 0.25em solid #dfe2e5;
|
||||
}
|
||||
|
||||
.markdown-body blockquote>:first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.markdown-body blockquote>:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.markdown-body kbd {
|
||||
display: inline-block;
|
||||
padding: 3px 5px;
|
||||
font-size: 11px;
|
||||
line-height: 10px;
|
||||
color: #444d56;
|
||||
vertical-align: middle;
|
||||
background-color: #fafbfc;
|
||||
border: solid 1px #c6cbd1;
|
||||
border-bottom-color: #959da5;
|
||||
border-radius: 3px;
|
||||
box-shadow: inset 0 -1px 0 #959da5;
|
||||
}
|
||||
|
||||
.markdown-body h1,
|
||||
.markdown-body h2,
|
||||
.markdown-body h3,
|
||||
.markdown-body h4,
|
||||
.markdown-body h5,
|
||||
.markdown-body h6 {
|
||||
margin-top: 24px;
|
||||
margin-bottom: 16px;
|
||||
font-weight: 600;
|
||||
line-height: 1.25;
|
||||
}
|
||||
|
||||
.markdown-body h1 .octicon-link,
|
||||
.markdown-body h2 .octicon-link,
|
||||
.markdown-body h3 .octicon-link,
|
||||
.markdown-body h4 .octicon-link,
|
||||
.markdown-body h5 .octicon-link,
|
||||
.markdown-body h6 .octicon-link {
|
||||
color: #1b1f23;
|
||||
vertical-align: middle;
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
.markdown-body h1:hover .anchor,
|
||||
.markdown-body h2:hover .anchor,
|
||||
.markdown-body h3:hover .anchor,
|
||||
.markdown-body h4:hover .anchor,
|
||||
.markdown-body h5:hover .anchor,
|
||||
.markdown-body h6:hover .anchor {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.markdown-body h1:hover .anchor .octicon-link,
|
||||
.markdown-body h2:hover .anchor .octicon-link,
|
||||
.markdown-body h3:hover .anchor .octicon-link,
|
||||
.markdown-body h4:hover .anchor .octicon-link,
|
||||
.markdown-body h5:hover .anchor .octicon-link,
|
||||
.markdown-body h6:hover .anchor .octicon-link {
|
||||
visibility: visible;
|
||||
}
|
||||
|
||||
.markdown-body h1 {
|
||||
padding-bottom: 0.3em;
|
||||
font-size: 2em;
|
||||
border-bottom: 1px solid #eaecef;
|
||||
}
|
||||
|
||||
.markdown-body h2 {
|
||||
padding-bottom: 0.3em;
|
||||
font-size: 1.5em;
|
||||
border-bottom: 1px solid #eaecef;
|
||||
}
|
||||
|
||||
.markdown-body h3 {
|
||||
font-size: 1.25em;
|
||||
}
|
||||
|
||||
.markdown-body h4 {
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
.markdown-body h5 {
|
||||
font-size: 0.875em;
|
||||
}
|
||||
|
||||
.markdown-body h6 {
|
||||
font-size: 0.85em;
|
||||
color: #6a737d;
|
||||
}
|
||||
|
||||
.markdown-body ul,
|
||||
.markdown-body ol {
|
||||
padding-left: 2em;
|
||||
}
|
||||
|
||||
.markdown-body ul ul,
|
||||
.markdown-body ul ol,
|
||||
.markdown-body ol ol,
|
||||
.markdown-body ol ul {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.markdown-body li>p {
|
||||
margin-top: 16px;
|
||||
}
|
||||
|
||||
.markdown-body li+li {
|
||||
margin-top: 0.25em;
|
||||
}
|
||||
|
||||
.markdown-body dl {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.markdown-body dl dt {
|
||||
padding: 0;
|
||||
margin-top: 16px;
|
||||
font-size: 1em;
|
||||
font-style: italic;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.markdown-body dl dd {
|
||||
padding: 0 16px;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.markdown-body table {
|
||||
display: block;
|
||||
width: 100%;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.markdown-body table th {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.markdown-body table th,
|
||||
.markdown-body table td {
|
||||
padding: 6px 13px;
|
||||
border: 1px solid #dfe2e5;
|
||||
}
|
||||
|
||||
.markdown-body table tr {
|
||||
background-color: #fff;
|
||||
border-top: 1px solid #c6cbd1;
|
||||
}
|
||||
|
||||
.markdown-body table tr:nth-child(2n) {
|
||||
background-color: #f6f8fa;
|
||||
}
|
||||
|
||||
.markdown-body img {
|
||||
max-width: 100%;
|
||||
box-sizing: content-box;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.markdown-body code {
|
||||
padding: 0;
|
||||
padding-top: 0.2em;
|
||||
padding-bottom: 0.2em;
|
||||
margin: 0;
|
||||
font-size: 85%;
|
||||
background-color: rgba(27,31,35,0.05);
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.markdown-body code::before,
|
||||
.markdown-body code::after {
|
||||
letter-spacing: -0.2em;
|
||||
content: "\00a0";
|
||||
}
|
||||
|
||||
.markdown-body pre {
|
||||
word-wrap: normal;
|
||||
}
|
||||
|
||||
.markdown-body pre>code {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
font-size: 100%;
|
||||
word-break: normal;
|
||||
white-space: pre;
|
||||
background: transparent;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.markdown-body .highlight {
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.markdown-body .highlight pre {
|
||||
margin-bottom: 0;
|
||||
word-break: normal;
|
||||
}
|
||||
|
||||
.markdown-body .highlight pre,
|
||||
.markdown-body pre {
|
||||
padding: 16px;
|
||||
overflow: auto;
|
||||
font-size: 85%;
|
||||
line-height: 1.45;
|
||||
background-color: #f6f8fa;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.markdown-body pre code {
|
||||
display: inline;
|
||||
max-width: auto;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
overflow: visible;
|
||||
line-height: inherit;
|
||||
word-wrap: normal;
|
||||
background-color: transparent;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.markdown-body pre code::before,
|
||||
.markdown-body pre code::after {
|
||||
content: normal;
|
||||
}
|
||||
|
||||
.markdown-body .full-commit .btn-outline:not(:disabled):hover {
|
||||
color: #005cc5;
|
||||
border-color: #005cc5;
|
||||
}
|
||||
|
||||
.markdown-body kbd {
|
||||
display: inline-block;
|
||||
padding: 3px 5px;
|
||||
font: 11px "SFMono-Regular", Consolas, "Liberation Mono", Menlo, Courier, monospace;
|
||||
line-height: 10px;
|
||||
color: #444d56;
|
||||
vertical-align: middle;
|
||||
background-color: #fafbfc;
|
||||
border: solid 1px #d1d5da;
|
||||
border-bottom-color: #c6cbd1;
|
||||
border-radius: 3px;
|
||||
box-shadow: inset 0 -1px 0 #c6cbd1;
|
||||
}
|
||||
|
||||
.markdown-body :checked+.radio-label {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
border-color: #0366d6;
|
||||
}
|
||||
|
||||
.markdown-body .task-list-item {
|
||||
list-style-type: none;
|
||||
}
|
||||
|
||||
.markdown-body .task-list-item+.task-list-item {
|
||||
margin-top: 3px;
|
||||
}
|
||||
|
||||
.markdown-body .task-list-item input {
|
||||
margin: 0 0.2em 0.25em -1.6em;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.markdown-body hr {
|
||||
border-bottom-color: #eee;
|
||||
}
|
||||
@@ -0,0 +1,75 @@
|
||||
/*!
|
||||
* Article
|
||||
*/
|
||||
.article-nav
|
||||
padding-bottom 10px
|
||||
color #888
|
||||
.article-share
|
||||
padding 0 0 15px
|
||||
.share-area
|
||||
height 24px
|
||||
line-height 24px
|
||||
margin 0 auto
|
||||
padding-left 10px
|
||||
text-align left
|
||||
border-left 3px solid rgba(255, 153, 153, .8)
|
||||
.share-txt
|
||||
float left
|
||||
height 24px
|
||||
line-height 24px
|
||||
margin-right 5px
|
||||
font-size 12px
|
||||
color c-999
|
||||
.share-icon
|
||||
float left
|
||||
display inline-block
|
||||
width 24px
|
||||
height 24px
|
||||
margin-right 10px
|
||||
background url(../img/share.png) no-repeat 0 0
|
||||
opacity .9
|
||||
&:hover
|
||||
opacity .7
|
||||
&.weibo
|
||||
background-position 0 0
|
||||
&.wechat
|
||||
background-position 0 -32px
|
||||
&.qqzone
|
||||
background-position 0 -65px
|
||||
&.qq
|
||||
background-position 0 -98px
|
||||
&.douban
|
||||
background-position 0 -324px
|
||||
.body
|
||||
box-shadow 0 1px 5px rgba(0, 0, 0, .08)
|
||||
.article
|
||||
padding-top 0 !important
|
||||
padding-bottom 10px
|
||||
border-bottom 0
|
||||
.comments
|
||||
margin-top 20px
|
||||
.page-navigator
|
||||
margin 1em 0
|
||||
padding 0 20px
|
||||
list-style none
|
||||
.extend
|
||||
.page-number
|
||||
display inline-block
|
||||
margin-right 10px
|
||||
padding 3px 10px
|
||||
background-color c-eee
|
||||
opacity .8
|
||||
&.current
|
||||
color c-fff
|
||||
background-color #ff5e52
|
||||
cursor not-allowed
|
||||
.extend
|
||||
a.page-number
|
||||
transition .5s linear
|
||||
&:hover
|
||||
color c-444
|
||||
background-color c-ccc
|
||||
.space
|
||||
display inline-block
|
||||
margin-right 10px
|
||||
padding 3px 0
|
||||
@@ -0,0 +1,203 @@
|
||||
.comment
|
||||
margin-top 10px
|
||||
box-sizing border-box
|
||||
.box
|
||||
position relative
|
||||
width 100%
|
||||
.com-avatar
|
||||
position absolute
|
||||
top 2px
|
||||
left 0
|
||||
width 40px
|
||||
height 40px
|
||||
img
|
||||
width 100%
|
||||
height 100%
|
||||
border none
|
||||
border-radius 50%
|
||||
.com-text
|
||||
position relative
|
||||
margin-left 45px
|
||||
height 120px
|
||||
border 2px solid c-eee
|
||||
box-sizing border-box
|
||||
border-radius 2px
|
||||
.switch
|
||||
position absolute
|
||||
right -2px
|
||||
top -2px
|
||||
width 81px
|
||||
height 10px
|
||||
line-height 10px
|
||||
padding 5px 0
|
||||
.switch-item
|
||||
float left
|
||||
width 40px
|
||||
height @height
|
||||
color c-999
|
||||
text-center()
|
||||
font-size 10px
|
||||
cursor pointer
|
||||
opacity .8
|
||||
:first-child
|
||||
border-right 1px solid c-ccc
|
||||
.on
|
||||
color #ff5e52
|
||||
.main
|
||||
margin 0
|
||||
padding 0
|
||||
.text-area-edited
|
||||
display none
|
||||
width 100%
|
||||
height 116px
|
||||
padding 10px
|
||||
border none
|
||||
box-sizing border-box
|
||||
outline none
|
||||
resize none
|
||||
.text-area-preview
|
||||
display none
|
||||
width 100%
|
||||
height 116px
|
||||
padding 10px
|
||||
border none
|
||||
box-sizing border-box
|
||||
overflow auto
|
||||
@extend $base-style
|
||||
p
|
||||
margin 0
|
||||
.show
|
||||
display block
|
||||
.button
|
||||
position absolute
|
||||
bottom -2px
|
||||
right -2px
|
||||
width 100px
|
||||
height 30px
|
||||
line-height @height
|
||||
border-radius 0 0 2px 0
|
||||
color c-fff
|
||||
background-color #ff5e52
|
||||
text-align center
|
||||
opacity .8
|
||||
cursor pointer
|
||||
.button:hover
|
||||
opacity .7
|
||||
.sign-bar
|
||||
height 30px
|
||||
line-height @height
|
||||
text-align right
|
||||
font-size 12px
|
||||
.sign-link
|
||||
margin-left 5px
|
||||
color #ff5e52
|
||||
cursor pointer
|
||||
border none
|
||||
.sign-txt
|
||||
color c-999
|
||||
.tips
|
||||
height 30px
|
||||
line-height @height
|
||||
margin-left 45px
|
||||
font-size 12px
|
||||
color c-999
|
||||
.init
|
||||
color c-999
|
||||
float right
|
||||
.list-wrap
|
||||
margin-top 10px
|
||||
.list-header
|
||||
margin 0
|
||||
padding 0 0 0 15px
|
||||
font-size 12px
|
||||
border-left 2px solid c-eee
|
||||
.comments-num
|
||||
color #ff5e52
|
||||
font-size 14px
|
||||
.list
|
||||
list-style-type none
|
||||
margin 0
|
||||
padding 0
|
||||
.item
|
||||
position relative
|
||||
margin 10px 0
|
||||
border-bottom 1px solid c-eee
|
||||
.user-avatar
|
||||
position absolute
|
||||
top 0
|
||||
left 0
|
||||
width 40px
|
||||
height 40px
|
||||
img
|
||||
width 100%
|
||||
height 100%
|
||||
border none
|
||||
border-radius 50%
|
||||
a
|
||||
border none
|
||||
.user-comment
|
||||
min-height 50px
|
||||
margin-left 50px
|
||||
.user-comment-body
|
||||
margin 5px 0
|
||||
color c-666
|
||||
word-wrap break-word
|
||||
word-break normal
|
||||
@extend $base-style
|
||||
p
|
||||
margin 0
|
||||
a
|
||||
border none
|
||||
color #ff5e52
|
||||
.user-comment-header
|
||||
color c-aaa
|
||||
position relative
|
||||
span
|
||||
margin-right 5px
|
||||
.post-name
|
||||
font-size 12px
|
||||
.post-time
|
||||
font-size 10px
|
||||
.like
|
||||
font-size 10px
|
||||
color #ff5e52
|
||||
cursor pointer
|
||||
.like.liked
|
||||
color c-aaa
|
||||
.like-num
|
||||
font-size 10px
|
||||
.reply
|
||||
position absolute
|
||||
display none
|
||||
right 0
|
||||
top 3px
|
||||
font-size 10px
|
||||
cursor pointer
|
||||
&:hover
|
||||
.user-comment-header
|
||||
.reply
|
||||
display block
|
||||
.page-nav
|
||||
margin-top 10px
|
||||
text-align right
|
||||
.item
|
||||
display inline-block
|
||||
height 10px
|
||||
line-height @height
|
||||
margin 0 2px
|
||||
padding 8px 10px
|
||||
font-size 10px
|
||||
background-color c-eee
|
||||
opacity .8
|
||||
text-align center
|
||||
border none
|
||||
.item.current
|
||||
color c-fff
|
||||
background-color #ff5e52
|
||||
cursor not-allowed
|
||||
.more
|
||||
height 10px
|
||||
line-height @height
|
||||
padding 8px 5px
|
||||
font-size 10px
|
||||
text-align center
|
||||
@@ -0,0 +1,31 @@
|
||||
/*!
|
||||
* 底部
|
||||
*/
|
||||
.footer
|
||||
padding 30px
|
||||
color c-aaa
|
||||
background-color c-444
|
||||
font-size 12px
|
||||
text-center()
|
||||
opacity .9
|
||||
a
|
||||
color c-aaa
|
||||
.back-to-top {
|
||||
display: none;
|
||||
width: 40px;
|
||||
height: 39px;
|
||||
border-radius: 4px;
|
||||
-moz-border-radius: 4px;
|
||||
-webkit-border-radius: 4px;
|
||||
background: #000 url(../img/scrolltoparrow.png) no-repeat center center;
|
||||
position: fixed;
|
||||
_position: absolute;
|
||||
right: 20px;
|
||||
bottom: 50px;
|
||||
cursor: pointer;
|
||||
opacity: .20;
|
||||
filter: Alpha(opacity=20) !important;
|
||||
text-indent: -9999px;
|
||||
overflow: hidden;
|
||||
z-index: 5
|
||||
}
|
||||
@@ -0,0 +1,160 @@
|
||||
/*!
|
||||
* 头部样式
|
||||
*/
|
||||
.header
|
||||
width 100%
|
||||
background-color c-fff
|
||||
box-shadow 1px 1px 5px rgba(0, 0, 0, .1)
|
||||
margin-bottom 10px
|
||||
.header-main
|
||||
position relative
|
||||
height 68px
|
||||
margin-bottom 0
|
||||
.header .logo
|
||||
float left
|
||||
width 260px
|
||||
.logo
|
||||
a
|
||||
position relative
|
||||
display block
|
||||
height 68px
|
||||
line-height @height
|
||||
color c-fff
|
||||
background-color #ff5e52
|
||||
opacity .85
|
||||
text-center()
|
||||
overflow hidden
|
||||
.cover
|
||||
position absolute
|
||||
display block
|
||||
top 0
|
||||
left 0
|
||||
width 100%
|
||||
transition top .5s
|
||||
.name
|
||||
display block
|
||||
height 100%
|
||||
font-size 28px
|
||||
font-family "HomizioNova", "Microsoft Yahei"
|
||||
font-style italic
|
||||
.description
|
||||
display block
|
||||
height 100%
|
||||
color c-fff
|
||||
background-color #51cc87
|
||||
opacity .85
|
||||
&:hover .cover
|
||||
top -100%
|
||||
.header .menu
|
||||
margin 0
|
||||
padding 10px
|
||||
float left
|
||||
list-style-type none
|
||||
.menu
|
||||
.item
|
||||
float left
|
||||
padding 0 20px
|
||||
height 48px
|
||||
line-height @height
|
||||
font-size 16px
|
||||
a
|
||||
color c-666
|
||||
&:hover
|
||||
color #ff5e52
|
||||
.current a
|
||||
color #ff5e52
|
||||
.header .profile
|
||||
position absolute
|
||||
right 0
|
||||
top 0
|
||||
height 68px
|
||||
.profile
|
||||
.avatar
|
||||
width 50px
|
||||
height 50px
|
||||
margin 8px 0
|
||||
border 1px solid c-ddd
|
||||
border-radius 3px
|
||||
> img
|
||||
width 46px
|
||||
height 46px
|
||||
margin 2px
|
||||
.feeds
|
||||
height 68px
|
||||
padding 0 10px
|
||||
color c-666
|
||||
font-size 12px
|
||||
text-right()
|
||||
.links
|
||||
margin 5px 0 0
|
||||
padding 10px 0 3px
|
||||
.sns
|
||||
margin 0 0 5px 0
|
||||
padding 2px 0 10px
|
||||
line-height 14px
|
||||
a
|
||||
margin-left 5px
|
||||
.sinaweibo
|
||||
b
|
||||
color #ff5e52
|
||||
font-size 14px
|
||||
&:hover
|
||||
color #ff5e52
|
||||
.qqweibo
|
||||
b
|
||||
color #1faeff
|
||||
font-size 14px
|
||||
&:hover
|
||||
color #1faeff
|
||||
.wechat
|
||||
position relative
|
||||
b
|
||||
color #4bc916
|
||||
font-size 14px
|
||||
.popover
|
||||
position absolute
|
||||
display none
|
||||
top 28px
|
||||
left 50%
|
||||
width 120px
|
||||
height @width
|
||||
margin-left -60px
|
||||
border 1px solid c-ddd
|
||||
background-color c-fff
|
||||
border-radius 5px
|
||||
z-index 9
|
||||
img
|
||||
width 120px
|
||||
height @width
|
||||
border 0
|
||||
border-radius 5px
|
||||
.arrow
|
||||
position absolute
|
||||
display block
|
||||
top -10px
|
||||
left 50%
|
||||
width 0
|
||||
height 0
|
||||
margin-left -10px
|
||||
border-width 10px
|
||||
border-color transparent
|
||||
border-style solid
|
||||
border-top-width 0
|
||||
border-bottom-color c-ddd
|
||||
&:after
|
||||
position absolute
|
||||
content " "
|
||||
top 1px
|
||||
left 50%
|
||||
margin-left -9px
|
||||
border-width 9px
|
||||
border-color transparent
|
||||
border-style solid
|
||||
border-top-width 0
|
||||
border-bottom-color c-fff
|
||||
&:hover
|
||||
color #4bc916
|
||||
.popover
|
||||
display block
|
||||
.dropnav
|
||||
display none
|
||||
@@ -0,0 +1,140 @@
|
||||
// https://github.com/chriskempson/tomorrow-theme
|
||||
$code-block
|
||||
background: highlight-background
|
||||
margin: 20px 0
|
||||
padding: 15px
|
||||
overflow: auto
|
||||
font-size: $code-font-size
|
||||
color: highlight-foreground
|
||||
line-height: $line-height-code-block
|
||||
|
||||
$line-numbers
|
||||
color: #666
|
||||
|
||||
pre, code
|
||||
font-family: $code-font-family
|
||||
code
|
||||
word-break: break-all
|
||||
background: $gainsboro
|
||||
text-shadow: 0 1px #fff
|
||||
padding: 0 0.3em
|
||||
pre
|
||||
@extend $code-block
|
||||
code
|
||||
background: none
|
||||
text-shadow: none
|
||||
padding: 0
|
||||
.highlight
|
||||
@extend $code-block
|
||||
pre
|
||||
border: none !important
|
||||
margin: 0
|
||||
padding: 1px
|
||||
table
|
||||
margin: 0 !important
|
||||
width: auto !important
|
||||
border: none !important
|
||||
td
|
||||
border: none !important
|
||||
padding: 0 !important
|
||||
figcaption
|
||||
clearfix()
|
||||
font-size: 0.85em
|
||||
color: highlight-comment
|
||||
line-height: 1em
|
||||
margin-bottom: 1em
|
||||
a
|
||||
float: right
|
||||
.gutter pre
|
||||
@extend $line-numbers
|
||||
text-align: right
|
||||
padding-right: 20px
|
||||
.line
|
||||
height: 20px
|
||||
.gist
|
||||
margin: 20px 0
|
||||
border-style: solid
|
||||
border-color: $border-color
|
||||
border-width: 1px 0
|
||||
background: highlight-background
|
||||
padding: 15px $content-desktop-padding 15px 15px
|
||||
.gist-file
|
||||
border: none
|
||||
font-family: $font-family-monospace
|
||||
margin: 0
|
||||
.gist-data
|
||||
background: none
|
||||
border: none
|
||||
.line-numbers
|
||||
@extend $line-numbers
|
||||
background: none
|
||||
border: none
|
||||
padding: 0 20px 0 0
|
||||
.line-data
|
||||
padding: 0 !important
|
||||
.highlight
|
||||
margin: 0
|
||||
padding: 0
|
||||
border: none
|
||||
.gist-meta
|
||||
background: highlight-background
|
||||
color: highlight-comment
|
||||
font: 13px $font-family-base
|
||||
text-shadow: 0 0
|
||||
padding: 0
|
||||
margin-top: 1em
|
||||
margin-left: $content-desktop-padding
|
||||
a
|
||||
color: color-link
|
||||
font-weight: normal
|
||||
&:hover
|
||||
text-decoration: underline
|
||||
|
||||
pre
|
||||
.comment
|
||||
color: highlight-comment
|
||||
.variable
|
||||
.attribute
|
||||
.tag
|
||||
.regexp
|
||||
.ruby .constant
|
||||
.xml .tag .title
|
||||
.xml .pi
|
||||
.xml .doctype
|
||||
.html .doctype
|
||||
.css .id
|
||||
.css .class
|
||||
.css .pseudo
|
||||
color: highlight-red
|
||||
.number
|
||||
.preprocessor
|
||||
.built_in
|
||||
.literal
|
||||
.params
|
||||
.constant
|
||||
color: highlight-orange
|
||||
.ruby .class .title
|
||||
.css .rules .attribute
|
||||
color: highlight-green
|
||||
.string
|
||||
.value
|
||||
.inheritance
|
||||
.header
|
||||
.ruby .symbol
|
||||
.xml .cdata
|
||||
color: highlight-green
|
||||
.title
|
||||
.css .hexcolor
|
||||
color: highlight-aqua
|
||||
.function
|
||||
.python .decorator
|
||||
.python .title
|
||||
.ruby .function .title
|
||||
.ruby .title .keyword
|
||||
.perl .sub
|
||||
.javascript .title
|
||||
.coffeescript .title
|
||||
color: highlight-blue
|
||||
.keyword
|
||||
.javascript .function
|
||||
color: highlight-purple
|
||||
@@ -0,0 +1,117 @@
|
||||
/*!
|
||||
* 正文内容
|
||||
*/
|
||||
.content
|
||||
float left
|
||||
width 100%
|
||||
min-height 689px
|
||||
.content-main
|
||||
margin-right 350px
|
||||
padding 20px
|
||||
/*!
|
||||
* Post
|
||||
*/
|
||||
.post
|
||||
padding 25px 0
|
||||
border-bottom 1px solid c-eee
|
||||
overflow hidden
|
||||
header
|
||||
margin 0 0 10px 0
|
||||
> a
|
||||
position relative
|
||||
display inline-block
|
||||
margin-right 6px
|
||||
padding 4px 7px
|
||||
top -3px
|
||||
color c-fff
|
||||
background-color #ff5e52
|
||||
font-size 12px
|
||||
vertical-align baseline
|
||||
opacity .85
|
||||
&:after
|
||||
position absolute
|
||||
display block
|
||||
top 9px
|
||||
right -4px
|
||||
width 0
|
||||
height 0
|
||||
content " "
|
||||
border-left 4px solid #ff5e52
|
||||
border-top 4px solid transparent
|
||||
border-bottom 4px solid transparent
|
||||
.post-title
|
||||
display inline
|
||||
font-size 20px
|
||||
font-weight normal
|
||||
a:hover
|
||||
border-bottom 1px dotted #ff5e52
|
||||
.post-meta
|
||||
color #888
|
||||
font-size 12px
|
||||
.post-views,
|
||||
.post-cat,
|
||||
.post-comments
|
||||
margin-right 15px
|
||||
.post-content
|
||||
position relative
|
||||
color c-666
|
||||
img
|
||||
max-width 100%
|
||||
.post-excerpt
|
||||
position relative
|
||||
min-height 140px
|
||||
margin-right 210px
|
||||
overflow hidden
|
||||
.post-thumbnail
|
||||
position absolute
|
||||
top 0
|
||||
right 0
|
||||
width 200px
|
||||
height 140px
|
||||
overflow hidden
|
||||
.thumbnail
|
||||
width 200px
|
||||
height 140px
|
||||
border 0
|
||||
transition .5s
|
||||
a:after
|
||||
content ""
|
||||
position absolute
|
||||
left -70px
|
||||
top 0
|
||||
width 140px
|
||||
height 140px
|
||||
background-image -moz-linear-gradient(0deg,rgba(255,255,255,0),rgba(255,255,255,.5),rgba(255,255,255,0))
|
||||
background-image -webkit-linear-gradient(0deg,rgba(255,255,255,0),rgba(255,255,255,.5),rgba(255,255,255,0))
|
||||
transform skewx(-25deg)
|
||||
-o-transform skewx(-25deg)
|
||||
-moz-transform skewx(-25deg)
|
||||
-webkit-transform skewx(-25deg)
|
||||
&:hover a:after
|
||||
left 130px
|
||||
-webkit-transition all .3s ease-in-out
|
||||
-moz-transition all .3s ease-in-out
|
||||
-o-transition all .3s ease-in-out
|
||||
transition all .3s ease-in-out
|
||||
@extend $base-style
|
||||
a
|
||||
border-bottom 1px dotted #ff5e52
|
||||
.more a
|
||||
position absolute
|
||||
display inline-block
|
||||
right 0
|
||||
bottom 0
|
||||
padding 3px 7px
|
||||
border none
|
||||
color c-fff
|
||||
background-color #51cc87
|
||||
opacity .8
|
||||
&:hover
|
||||
opacity .75
|
||||
blockquote
|
||||
margin 1em 0
|
||||
padding 5px 10px
|
||||
color c-666
|
||||
border-left 4px solid c-eee
|
||||
p
|
||||
margin 0
|
||||
@@ -0,0 +1,104 @@
|
||||
/*!
|
||||
* 响应式媒体查询
|
||||
*/
|
||||
@media screen and (min-width: 1440px)
|
||||
.container
|
||||
max-width 1340px
|
||||
.content
|
||||
min-height 500px
|
||||
@media screen and (max-width: 1000px) and (min-width: 960px)
|
||||
.container
|
||||
max-width 952px
|
||||
.content
|
||||
min-height 500px
|
||||
@media screen and (max-width: 959px)
|
||||
.container
|
||||
margin-bottom 10px
|
||||
padding 0 10px
|
||||
.content
|
||||
min-height 500px
|
||||
.sidebar
|
||||
display none
|
||||
.content-main
|
||||
margin-right 0
|
||||
padding 20px 10px
|
||||
.header
|
||||
.header-main
|
||||
height auto
|
||||
padding-bottom 10px
|
||||
.logo
|
||||
float none
|
||||
width auto
|
||||
.profile
|
||||
display none
|
||||
.menu
|
||||
float none
|
||||
padding 8px 10px
|
||||
border 1px solid rgba(0, 0, 0, .1)
|
||||
background-color #fff
|
||||
border-top 0
|
||||
overflow hidden
|
||||
.item
|
||||
width 50%
|
||||
height auto
|
||||
line-height 1
|
||||
padding 8px 0
|
||||
font-size 14px
|
||||
.hidden
|
||||
display none
|
||||
.dropnav
|
||||
position absolute
|
||||
display block
|
||||
top 12px
|
||||
right 20px
|
||||
width 40px
|
||||
height @width
|
||||
padding 0 2px
|
||||
line-height @height
|
||||
font-size @height
|
||||
color #efe0ce
|
||||
border 2px solid @color
|
||||
border-radius 2px
|
||||
z-index 3
|
||||
cursor pointer
|
||||
&:hover
|
||||
opacity .8
|
||||
.post
|
||||
header .post-title
|
||||
font-size 15px
|
||||
.post-meta
|
||||
text-center()
|
||||
.post-content
|
||||
.post-excerpt
|
||||
margin-right 0
|
||||
.post-thumbnail
|
||||
display none
|
||||
.more a
|
||||
position relative
|
||||
display block
|
||||
padding 6px
|
||||
text-center()
|
||||
.page-navigator
|
||||
padding-left 0
|
||||
.page-number
|
||||
.space
|
||||
.extend
|
||||
margin-right 6px
|
||||
.page-navigator li
|
||||
display inline-block
|
||||
margin-right 7px
|
||||
opacity .8
|
||||
|
||||
.page-navigator li a
|
||||
display block
|
||||
padding 2px 8px
|
||||
background-color #eee
|
||||
.comment
|
||||
.list-wrap
|
||||
.list
|
||||
.user-comment
|
||||
.user-comment-header
|
||||
.reply
|
||||
display block
|
||||
.page-nav .more
|
||||
display none
|
||||
@@ -0,0 +1,22 @@
|
||||
/*!
|
||||
* 搜索框
|
||||
*/
|
||||
.search-form
|
||||
position relative
|
||||
padding 10px 70px 0 0
|
||||
.form-control
|
||||
display block
|
||||
width 100%
|
||||
padding 5px 5px 5px 10px
|
||||
border 2px solid c-ddd
|
||||
border-right 0
|
||||
outline 0
|
||||
box-shadow 2px 2px 4px rgba(0, 0, 0, .07) inset
|
||||
.btn
|
||||
position absolute
|
||||
top 10px
|
||||
right 0
|
||||
width 70px
|
||||
padding 7px 0
|
||||
&:hover
|
||||
opacity .75
|
||||
@@ -0,0 +1,90 @@
|
||||
/*!
|
||||
* Sidebar
|
||||
*/
|
||||
.sidebar
|
||||
float left
|
||||
width 330px
|
||||
margin-left -350px
|
||||
padding-top 20px
|
||||
padding-bottom 20px
|
||||
.widget
|
||||
position relative
|
||||
margin-bottom 20px
|
||||
clear both
|
||||
.widget
|
||||
ul
|
||||
margin 0
|
||||
padding 0
|
||||
.widget-hd
|
||||
margin 0
|
||||
padding 0
|
||||
border-bottom 2px solid c-eee
|
||||
strong
|
||||
position relative
|
||||
display inline-block
|
||||
bottom -2px
|
||||
color #444
|
||||
border-bottom 2px solid #ff5e52
|
||||
font-weight normal
|
||||
.logout
|
||||
position relative
|
||||
bottom -2px
|
||||
font-size 14px
|
||||
font-weight normal
|
||||
text-decoration underline
|
||||
&:hover
|
||||
text-decoration none
|
||||
.widget-bd
|
||||
margin 0
|
||||
padding 0
|
||||
list-style none
|
||||
li
|
||||
display block
|
||||
padding 10px 0
|
||||
line-height 1.5
|
||||
border-bottom 1px solid c-eee
|
||||
font-size 12px
|
||||
overflow hidden
|
||||
text-overflow ellipsis
|
||||
white-space nowrap
|
||||
a .avatar
|
||||
float left
|
||||
width 36px
|
||||
height 36px
|
||||
margin-right 10px
|
||||
border-radius 50%
|
||||
transform rotate(0)
|
||||
transition .5s
|
||||
a:hover .avatar
|
||||
transform rotate(360deg)
|
||||
opacity .85
|
||||
p
|
||||
margin 0
|
||||
padding 0
|
||||
.tag-item
|
||||
float left
|
||||
width 32.6666%
|
||||
margin 0 1% 1% 0
|
||||
padding 0 8px
|
||||
line-height 29px
|
||||
font-size 12px
|
||||
color c-999
|
||||
background-color #f6f6f6
|
||||
-webkit-box-sizing border-box
|
||||
box-sizing border-box
|
||||
text-overflow ellipsis
|
||||
overflow hidden
|
||||
white-space nowrap
|
||||
-webkit-transition .5s
|
||||
-ms-transition .5s
|
||||
-moz-transition .5s
|
||||
transition .5s
|
||||
&:hover
|
||||
color #fff
|
||||
background-color #ff5e52
|
||||
opacity .85;
|
||||
.tag-item:nth-child(3n+0)
|
||||
margin-right 0
|
||||
.tag-wrap
|
||||
padding 10px 0 0
|
||||
overflow hidden
|
||||
@@ -0,0 +1,74 @@
|
||||
$theme_config = hexo-config("highlight_theme")
|
||||
/*!
|
||||
* 高亮样式
|
||||
*/
|
||||
|
||||
if $theme_config == "normal"
|
||||
highlight-background = #f7f7f7
|
||||
highlight-current-line = #efefef
|
||||
highlight-selection = #d6d6d6
|
||||
highlight-foreground = #4d4d4c
|
||||
highlight-comment = #8e908c
|
||||
highlight-red = #c82829
|
||||
highlight-orange = #f5871f
|
||||
highlight-yellow = #eab700
|
||||
highlight-green = #718c00
|
||||
highlight-aqua = #3e999f
|
||||
highlight-blue = #4271ae
|
||||
highlight-purple = #8959a8
|
||||
|
||||
if $theme_config == "night"
|
||||
highlight-background = #1d1f21
|
||||
highlight-current-line = #282a2e
|
||||
highlight-selection = #373b41
|
||||
highlight-foreground = #c5c8c6
|
||||
highlight-comment = #969896
|
||||
highlight-red = #cc6666
|
||||
highlight-orange = #de935f
|
||||
highlight-yellow = #f0c674
|
||||
highlight-green = #b5bd68
|
||||
highlight-aqua = #8abeb7
|
||||
highlight-blue = #81a2be
|
||||
highlight-purple = #b294bb
|
||||
|
||||
if $theme_config == "night eighties"
|
||||
highlight-background = #2d2d2d
|
||||
highlight-current-line = #393939
|
||||
highlight-selection = #515151
|
||||
highlight-foreground = #cccccc
|
||||
highlight-comment = #999999
|
||||
highlight-red = #f2777a
|
||||
highlight-orange = #f99157
|
||||
highlight-yellow = #ffcc66
|
||||
highlight-green = #99cc99
|
||||
highlight-aqua = #66cccc
|
||||
highlight-blue = #6699cc
|
||||
highlight-purple = #cc99cc
|
||||
|
||||
if $theme_config == "night blue"
|
||||
highlight-background = #002451
|
||||
highlight-current-line = #00346e
|
||||
highlight-selection = #003f8e
|
||||
highlight-foreground = #ffffff
|
||||
highlight-comment = #7285b7
|
||||
highlight-red = #ff9da4
|
||||
highlight-orange = #ffc58f
|
||||
highlight-yellow = #ffeead
|
||||
highlight-green = #d1f1a9
|
||||
highlight-aqua = #99ffff
|
||||
highlight-blue = #bbdaff
|
||||
highlight-purple = #ebbbff
|
||||
|
||||
if $theme_config == "night bright"
|
||||
highlight-background = #000000
|
||||
highlight-current-line = #2a2a2a
|
||||
highlight-selection = #424242
|
||||
highlight-foreground = #eaeaea
|
||||
highlight-comment = #969896
|
||||
highlight-red = #d54e53
|
||||
highlight-orange = #e78c45
|
||||
highlight-yellow = #e7c547
|
||||
highlight-green = #b9ca4a
|
||||
highlight-aqua = #70c0b1
|
||||
highlight-blue = #7aa6da
|
||||
highlight-purple = #c397d8
|
||||
@@ -0,0 +1,55 @@
|
||||
// 公共变量
|
||||
c-333 = #333
|
||||
c-444 = #444
|
||||
c-555 = #555
|
||||
c-666 = #666
|
||||
c-999 = #999
|
||||
c-aaa = #aaa
|
||||
c-ccc = #ccc
|
||||
c-ddd = #ddd
|
||||
c-eee = #eee
|
||||
c-fff = #fff
|
||||
// 公共函数
|
||||
text-center()
|
||||
text-align center
|
||||
text-left()
|
||||
text-align left
|
||||
text-right()
|
||||
text-align right
|
||||
box-sizing()
|
||||
-ms-box-sizing arguments
|
||||
-moz-box-sizing arguments
|
||||
-webkit-box-sizing arguments
|
||||
-o-box-sizing arguments
|
||||
box-sizing arguments
|
||||
transition()
|
||||
-ms-transition: arguments
|
||||
-moz-transition arguments
|
||||
-webkit-transition arguments
|
||||
-o-transition arguments
|
||||
transition arguments
|
||||
border-radius()
|
||||
-ms-border-radius arguments
|
||||
-moz-border-radius arguments
|
||||
-webkit-border-radius arguments
|
||||
-o-border-radius arguments
|
||||
border-radius arguments
|
||||
transform()
|
||||
-ms-transform arguments
|
||||
-moz-transform arguments
|
||||
-webkit-transform arguments
|
||||
-o-transform arguments
|
||||
transform arguments
|
||||
clearfix()
|
||||
clear both
|
||||
zoom 1
|
||||
|
||||
// 高亮样式变量
|
||||
$code-font-size = 13px
|
||||
$line-height-code-block = 1.6
|
||||
$code-font-family = "Input Mono", "PT Mono", Consolas, Monaco, Menlo, monospace
|
||||
$gainsboro = #eee
|
||||
$border-color = #ccc
|
||||
$content-desktop-padding = 15px
|
||||
$font-family-base = Consolas, Monaco, Menlo, monospace
|
||||
$font-family-monospace = monospace
|
||||
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
@@ -0,0 +1,24 @@
|
||||
<?xml version="1.0" standalone="no"?>
|
||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
|
||||
<svg xmlns="http://www.w3.org/2000/svg">
|
||||
<metadata>Generated by IcoMoon</metadata>
|
||||
<defs>
|
||||
<font id="icomoon" horiz-adv-x="1024">
|
||||
<font-face units-per-em="1024" ascent="960" descent="-64" />
|
||||
<missing-glyph horiz-adv-x="1024" />
|
||||
<glyph unicode=" " d="" horiz-adv-x="512" />
|
||||
<glyph unicode="" d="M1024 369.556l-512 397.426-512-397.428v162.038l512 397.426 512-397.428zM896 384v-384h-256v256h-256v-256h-256v384l384 288z" />
|
||||
<glyph unicode="" d="M0-64h512v1024h-512v-1024zM320 832h128v-128h-128v128zM320 576h128v-128h-128v128zM320 320h128v-128h-128v128zM64 832h128v-128h-128v128zM64 576h128v-128h-128v128zM64 320h128v-128h-128v128zM576 640h448v-64h-448zM576-64h128v256h192v-256h128v576h-448z" />
|
||||
<glyph unicode="" d="M896 704v128h-896v-704c0-35.346 28.654-64 64-64h864c53.022 0 96 42.978 96 96v544h-128zM832 128h-768v640h768v-640zM128 640h640v-64h-640zM512 512h256v-64h-256zM512 384h256v-64h-256zM512 256h192v-64h-192zM128 512h320v-320h-320z" />
|
||||
<glyph unicode="" d="M864 960h-768c-52.8 0-96-43.2-96-96v-832c0-52.8 43.2-96 96-96h768c52.8 0 96 43.2 96 96v832c0 52.8-43.2 96-96 96zM832 64h-704v768h704v-768zM256 384h448v-64h-448zM256 256h448v-64h-448zM320 672c0 53.019 42.981 96 96 96s96-42.981 96-96c0-53.019-42.981-96-96-96s-96 42.981-96 96zM480 576h-128c-52.8 0-96-28.8-96-64v-64h320v64c0 35.2-43.2 64-96 64z" />
|
||||
<glyph unicode="" d="M917.806 602.924c-22.21 30.292-53.174 65.7-87.178 99.704s-69.412 64.964-99.704 87.178c-51.574 37.82-76.592 42.194-90.924 42.194h-368c-44.114 0-80-35.888-80-80v-736c0-44.112 35.886-80 80-80h608c44.112 0 80 35.888 80 80v496c0 14.332-4.372 39.35-42.194 90.924zM785.374 657.374c30.7-30.7 54.8-58.398 72.58-81.374h-153.954v153.946c22.982-17.78 50.678-41.878 81.374-72.572v0zM896 16c0-8.672-7.328-16-16-16h-608c-8.672 0-16 7.328-16 16v736c0 8.672 7.328 16 16 16 0 0 367.956 0.002 368 0v-224c0-17.672 14.324-32 32-32h224v-496zM602.924 917.804c-51.574 37.822-76.592 42.196-90.924 42.196h-368c-44.112 0-80-35.888-80-80v-736c0-38.632 27.528-70.958 64-78.39v814.39c0 8.672 7.328 16 16 16h486.876c-9.646 7.92-19.028 15.26-27.952 21.804z" />
|
||||
<glyph unicode="" d="M1232 960h-384c-26.4 0-63.274-15.274-81.942-33.942l-476.116-476.116c-18.668-18.668-18.668-49.214 0-67.882l412.118-412.118c18.668-18.668 49.214-18.668 67.882 0l476.118 476.118c18.666 18.666 33.94 55.54 33.94 81.94v384c0 26.4-21.6 48-48 48zM992 576c-53.020 0-96 42.98-96 96s42.98 96 96 96 96-42.98 96-96-42.98-96-96-96zM128 416l544 544h-80c-26.4 0-63.274-15.274-81.942-33.942l-476.116-476.116c-18.668-18.668-18.668-49.214 0-67.882l412.118-412.118c18.668-18.668 49.214-18.668 67.882 0l30.058 30.058-416 416z" horiz-adv-x="1280" />
|
||||
<glyph unicode="" d="M928 832h-832c-52.8 0-96-43.2-96-96v-640c0-52.8 43.2-96 96-96h832c52.8 0 96 43.2 96 96v640c0 52.8-43.2 96-96 96zM398.74 409.628l-270.74-210.892v501.642l270.74-290.75zM176.38 704h671.24l-335.62-252-335.62 252zM409.288 398.302l102.712-110.302 102.71 110.302 210.554-270.302h-626.528l210.552 270.302zM625.26 409.628l270.74 290.75v-501.642l-270.74 210.892z" />
|
||||
<glyph unicode="" d="M512 896c282.77 0 512-186.25 512-416 0-229.752-229.23-416-512-416-27.156 0-53.81 1.734-79.824 5.044-109.978-109.978-241.25-129.7-368.176-132.596v26.916c68.536 33.578 128 94.74 128 164.636 0 9.754-0.758 19.33-2.164 28.696-115.796 76.264-189.836 192.754-189.836 323.304 0 229.75 229.23 416 512 416z" />
|
||||
<glyph unicode="" d="M480 960v0c265.096 0 480-173.914 480-388.448s-214.904-388.448-480-388.448c-25.458 0-50.446 1.62-74.834 4.71-103.106-102.694-222.172-121.108-341.166-123.814v25.134c64.252 31.354 116 88.466 116 153.734 0 9.106-0.712 18.048-2.030 26.794-108.558 71.214-177.97 179.988-177.97 301.89 0 214.534 214.904 388.448 480 388.448zM996 89.314c0-55.942 36.314-104.898 92-131.772v-21.542c-103.126 2.318-197.786 18.102-287.142 106.126-21.14-2.65-42.794-4.040-64.858-4.040-95.47 0-183.408 25.758-253.614 69.040 144.674 0.506 281.26 46.854 384.834 130.672 52.208 42.252 93.394 91.826 122.414 147.348 30.766 58.866 46.366 121.582 46.366 186.406 0 10.448-0.45 20.836-1.258 31.168 72.57-59.934 117.258-141.622 117.258-231.676 0-104.488-60.158-197.722-154.24-258.764-1.142-7.496-1.76-15.16-1.76-22.966z" horiz-adv-x="1152" />
|
||||
<glyph unicode="" d="M320 768c0 106.039 85.961 192 192 192s192-85.961 192-192c0-106.039-85.961-192-192-192s-192 85.961-192 192zM768.078 512h-35.424l-199.104-404.244 74.45 372.244-96 96-96-96 74.45-372.244-199.102 404.244h-35.424c-127.924 0-127.924-85.986-127.924-192v-320h768v320c0 106.014 0 192-127.922 192z" />
|
||||
<glyph unicode="" d="M363.722 237.948l41.298 57.816-45.254 45.256-57.818-41.296c-10.722 5.994-22.204 10.774-34.266 14.192l-11.682 70.084h-64l-11.68-70.086c-12.062-3.418-23.544-8.198-34.266-14.192l-57.818 41.298-45.256-45.256 41.298-57.816c-5.994-10.72-10.774-22.206-14.192-34.266l-70.086-11.682v-64l70.086-11.682c3.418-12.060 8.198-23.544 14.192-34.266l-41.298-57.816 45.254-45.256 57.818 41.296c10.722-5.994 22.204-10.774 34.266-14.192l11.682-70.084h64l11.68 70.086c12.062 3.418 23.544 8.198 34.266 14.192l57.818-41.296 45.254 45.256-41.298 57.816c5.994 10.72 10.774 22.206 14.192 34.266l70.088 11.68v64l-70.086 11.682c-3.418 12.060-8.198 23.544-14.192 34.266zM224 96c-35.348 0-64 28.654-64 64s28.652 64 64 64 64-28.654 64-64-28.652-64-64-64zM1024 576v64l-67.382 12.25c-1.242 8.046-2.832 15.978-4.724 23.79l57.558 37.1-24.492 59.128-66.944-14.468c-4.214 6.91-8.726 13.62-13.492 20.13l39.006 56.342-45.256 45.254-56.342-39.006c-6.512 4.766-13.22 9.276-20.13 13.494l14.468 66.944-59.128 24.494-37.1-57.558c-7.812 1.892-15.744 3.482-23.79 4.724l-12.252 67.382h-64l-12.252-67.382c-8.046-1.242-15.976-2.832-23.79-4.724l-37.098 57.558-59.128-24.492 14.468-66.944c-6.91-4.216-13.62-8.728-20.13-13.494l-56.342 39.006-45.254-45.254 39.006-56.342c-4.766-6.51-9.278-13.22-13.494-20.13l-66.944 14.468-24.492-59.128 57.558-37.1c-1.892-7.812-3.482-15.742-4.724-23.79l-67.384-12.252v-64l67.382-12.25c1.242-8.046 2.832-15.978 4.724-23.79l-57.558-37.1 24.492-59.128 66.944 14.468c4.216-6.91 8.728-13.618 13.494-20.13l-39.006-56.342 45.254-45.256 56.342 39.006c6.51-4.766 13.22-9.276 20.13-13.492l-14.468-66.944 59.128-24.492 37.102 57.558c7.81-1.892 15.742-3.482 23.788-4.724l12.252-67.384h64l12.252 67.382c8.044 1.242 15.976 2.832 23.79 4.724l37.1-57.558 59.128 24.492-14.468 66.944c6.91 4.216 13.62 8.726 20.13 13.492l56.342-39.006 45.256 45.256-39.006 56.342c4.766 6.512 9.276 13.22 13.492 20.13l66.944-14.468 24.492 59.13-57.558 37.1c1.892 7.812 3.482 15.742 4.724 23.79l67.382 12.25zM672 468.8c-76.878 0-139.2 62.322-139.2 139.2s62.32 139.2 139.2 139.2 139.2-62.322 139.2-139.2c0-76.878-62.32-139.2-139.2-139.2z" />
|
||||
<glyph unicode="" d="M0 896h1024v-128h-1024zM0 704h1024v-128h-1024zM0 512h1024v-128h-1024zM0 320h1024v-128h-1024zM0 128h1024v-128h-1024z" />
|
||||
<glyph unicode="" d="M832 224l96-96 320 320-320 320-96-96 224-224zM448 672l-96 96-320-320 320-320 96 96-224 224zM701.298 809.481l69.468-18.944-191.987-704.026-69.468 18.944 191.987 704.026z" horiz-adv-x="1280" />
|
||||
<glyph unicode="" d="M512.008 947.358c-282.738 0-512.008-229.218-512.008-511.998 0-226.214 146.704-418.132 350.136-485.836 25.586-4.738 34.992 11.11 34.992 24.632 0 12.204-0.48 52.542-0.696 95.324-142.448-30.976-172.504 60.41-172.504 60.41-23.282 59.176-56.848 74.916-56.848 74.916-46.452 31.778 3.51 31.124 3.51 31.124 51.4-3.61 78.476-52.766 78.476-52.766 45.672-78.27 119.776-55.64 149.004-42.558 4.588 33.086 17.852 55.68 32.506 68.464-113.73 12.942-233.276 56.85-233.276 253.032 0 55.898 20.004 101.574 52.76 137.428-5.316 12.9-22.854 64.972 4.952 135.5 0 0 43.006 13.752 140.84-52.49 40.836 11.348 84.636 17.036 128.154 17.234 43.502-0.198 87.336-5.886 128.256-17.234 97.734 66.244 140.656 52.49 140.656 52.49 27.872-70.528 10.35-122.6 5.036-135.5 32.82-35.856 52.694-81.532 52.694-137.428 0-196.654-119.778-239.95-233.79-252.624 18.364-15.89 34.724-47.046 34.724-94.812 0-68.508-0.596-123.644-0.596-140.508 0-13.628 9.222-29.594 35.172-24.566 203.322 67.776 349.842 259.626 349.842 485.768 0 282.78-229.234 511.998-511.992 511.998z" />
|
||||
</font></defs></svg>
|
||||
|
After Width: | Height: | Size: 8.0 KiB |
Binary file not shown.
@@ -0,0 +1,58 @@
|
||||
@charset "UTF-8"
|
||||
@import "_variables"
|
||||
@import "_extend"
|
||||
$comment_config = hexo-config("comment.enable")
|
||||
|
||||
// 字体样式
|
||||
//-----------------------------------------------
|
||||
@import "_base/font"
|
||||
|
||||
// Normalize
|
||||
//-----------------------------------------------
|
||||
@import "_base/normalize"
|
||||
|
||||
// Reset
|
||||
//-----------------------------------------------
|
||||
@import "_base/reset"
|
||||
|
||||
// Global
|
||||
//-----------------------------------------------
|
||||
@import "_base/global"
|
||||
|
||||
// 头部样式
|
||||
//-----------------------------------------------
|
||||
@import "_partial/header"
|
||||
|
||||
// 文章列表样式
|
||||
//-----------------------------------------------
|
||||
@import "_partial/post"
|
||||
|
||||
// 代码高亮样式
|
||||
//-----------------------------------------------
|
||||
@import "_partial/theme"
|
||||
@import "_partial/highlight"
|
||||
|
||||
// 搜索框样式
|
||||
//-----------------------------------------------
|
||||
@import "_partial/searchform"
|
||||
|
||||
// 侧栏样式
|
||||
//-----------------------------------------------
|
||||
@import "_partial/sidebar"
|
||||
|
||||
// 文章正文样式
|
||||
//-----------------------------------------------
|
||||
@import "_partial/article"
|
||||
|
||||
// 博客底部样式
|
||||
//-----------------------------------------------
|
||||
@import "_partial/footer"
|
||||
|
||||
// 评论框样式
|
||||
//-----------------------------------------------
|
||||
if $comment_config
|
||||
@import "_partial/comment"
|
||||
|
||||
// 响应式样式
|
||||
//-----------------------------------------------
|
||||
@import "_partial/responsive"
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 5.8 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.3 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 19 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 7.9 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 97 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 212 B |
Binary file not shown.
|
After Width: | Height: | Size: 6.8 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 30 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 58 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 71 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 78 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 48 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 60 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 41 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 62 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 58 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 54 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 126 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 32 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 26 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 51 KiB |
@@ -0,0 +1,943 @@
|
||||
if (!window['String']['prototype']['trim']) {
|
||||
window['String']['prototype']['trim'] = function () {
|
||||
return this.replace(/^\s+|\s+$/g, '');
|
||||
};
|
||||
}
|
||||
var JELON = window.JELON || {};
|
||||
;(function (JL) {
|
||||
var constants = {
|
||||
ACCESS_TOKEN_KEY: 'xups-github-comments-token', // access_token key
|
||||
USER_INFO_KEY: 'xups-github-user-info', // 登录用户信息 key
|
||||
PER_PAGE: 5, // 每页的评论数
|
||||
API_HOST: 'https://api.github.com'
|
||||
};
|
||||
var queryUrl = function (key, url, uncode) {
|
||||
url = url || location.href;
|
||||
var reg = new RegExp('(\\?|&|#|&)' + key + '=([^?&#]*)');
|
||||
var result = url.match(reg);
|
||||
if (uncode) {
|
||||
return result ? result[2] : '';
|
||||
}
|
||||
return result ? decodeURIComponent(result[2]) : '';
|
||||
};
|
||||
var $ = JL.$ || function(str) {
|
||||
return /^(\[object HTML)[a-zA-Z]*(Element\])$/.test(Object.prototype.toString.call(str)) ? str : document.getElementById(str);
|
||||
};
|
||||
var addClass = function (elem, className) {
|
||||
if (!elem) return;
|
||||
var classNames;
|
||||
var setClass;
|
||||
var i, l, cl;
|
||||
if (elem instanceof Array) {
|
||||
for (i = 0, l = elem.length; i < l; i++) {
|
||||
elem[i] = arguments.callee.call(this, elem[i], className);
|
||||
}
|
||||
} else if (typeof elem.item === 'function') {
|
||||
var result = [];
|
||||
for (i = 0, l = elem.length; i < l; i++) {
|
||||
result.push(arguments.callee.call(this, elem.item(i), className));
|
||||
}
|
||||
elem = result;
|
||||
} else {
|
||||
elem = $(elem);
|
||||
if (!elem) return;
|
||||
if (className && typeof className === 'string') {
|
||||
classNames = className.split(/\s+/);
|
||||
if (elem.nodeType === 1) {
|
||||
if (!elem.className && classNames.length === 1) {
|
||||
elem.className = className;
|
||||
} else {
|
||||
setClass = ' ' + elem.className + ' ';
|
||||
for (i = 0, cl = classNames.length; i < cl; i++) {
|
||||
if (setClass.indexOf(' ' + classNames[i] + ' ') < 0) {
|
||||
setClass += classNames[i] + ' ';
|
||||
}
|
||||
}
|
||||
elem.className = setClass.trim();
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
return elem;
|
||||
};
|
||||
var removeClass = function (elem, className) {
|
||||
if (!elem) return;
|
||||
var classNames, i, l, c, cl;
|
||||
if (elem instanceof Array) {
|
||||
for (i = 0, l = elem.length; i < l; i++) {
|
||||
elem[i] = arguments.callee.call(this, elem[i], className);
|
||||
}
|
||||
} else if (typeof elem.item === 'function') {
|
||||
var result = [];
|
||||
for (i = 0, l = elem.length; i < l; i++) {
|
||||
result.push(arguments.callee.call(this, elem.item(i), className));
|
||||
}
|
||||
elem = result;
|
||||
} else {
|
||||
elem = $(elem);
|
||||
if (!elem) return;
|
||||
if ((className && typeof className === 'string') || className === undefined) {
|
||||
classNames = (className || '').split(/\s+/);
|
||||
if (elem.nodeType === 1 && elem.className) {
|
||||
if (className) {
|
||||
className = (' ' + elem.className + ' ').replace(/[\n\t\r]/g, ' ');
|
||||
for (c = 0, cl = classNames.length; c < cl; c++) {
|
||||
className = className.replace(' ' + classNames[c] + ' ', ' ');
|
||||
}
|
||||
elem.className = className.trim();
|
||||
} else {
|
||||
elem.className = '';
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
return elem;
|
||||
};
|
||||
/**
|
||||
* 格式化日期文本，如 yyyy-MM-dd hh:mm:ss
|
||||
*/
|
||||
var formatDate = function (format, date) {
|
||||
if (!date) return '';
|
||||
if (typeof date == 'number') date = new Date(date * 1000);
|
||||
var o = {
|
||||
'M+': date.getMonth() + 1,
|
||||
'd+': date.getDate(),
|
||||
'h+': date.getHours(),
|
||||
'm+': date.getMinutes(),
|
||||
's+': date.getSeconds(),
|
||||
'q+': Math.floor((date.getMonth() + 3) / 3),
|
||||
'S': date.getMilliseconds(),
|
||||
'w': '日一二三四五六'.charAt(date.getDay())
|
||||
};
|
||||
format = format.replace(/y{4}/, date.getFullYear()).replace(/y{2}/, date.getFullYear().toString().substring(2));
|
||||
for (var k in o) {
|
||||
var reg = new RegExp(k);
|
||||
format = format.replace(reg, match);
|
||||
}
|
||||
function match(m) {
|
||||
return m.length == 1 ? o[k] : ('00' + o[k]).substr(('' + o[k]).length);
|
||||
}
|
||||
return format;
|
||||
};
|
||||
var htmlEncode = function (str) {
|
||||
if (typeof str !== 'string') return;
|
||||
str = str.replace(/&/g, '&')
|
||||
.replace(/</g, '<')
|
||||
// .replace(/>/g, '>')
|
||||
.replace(/\"/g, '"')
|
||||
.replace(/\'/g, ''')
|
||||
.replace(/ /g, ' ');
|
||||
return str;
|
||||
};
|
||||
|
||||
/**
|
||||
* 封装ajax函数
|
||||
* @param {String} opt.method 连接的方式，包括POST和GET两种方式
|
||||
* @param {String} opt.url 发送请求的url
|
||||
* @param {Boolean} opt.async 是否为异步请求，true为异步的，false为同步的
|
||||
* @param {Object} opt.data 发送的参数，格式为对象类型
|
||||
* @param {Function} opt.success 发送并接收成功调用的回调函数
|
||||
* @param {Function} opt.fail 失败回调
|
||||
*/
|
||||
var ajax = function (opt) {
|
||||
opt = opt || {};
|
||||
opt.method = opt.method.toUpperCase() || 'POST';
|
||||
opt.url = opt.url || '';
|
||||
opt.async = opt.async || true;
|
||||
opt.data = opt.data || null;
|
||||
opt.success = opt.success || function () {};
|
||||
var xhr = null;
|
||||
if (window.XMLHttpRequest) {
|
||||
xhr = new XMLHttpRequest();
|
||||
} else {
|
||||
xhr = new ActiveXObject('Microsoft.XMLHTTP');
|
||||
}
|
||||
var params = [];
|
||||
var token = window.localStorage.getItem(constants.ACCESS_TOKEN_KEY);
|
||||
|
||||
for (var key in opt.data) {
|
||||
params.push(key + '=' + opt.data[key]);
|
||||
}
|
||||
var postData = params.join('&');
|
||||
if (opt.method.toUpperCase() === 'POST') {
|
||||
xhr.open(opt.method, opt.url, opt.async);
|
||||
if (window.JSON) {
|
||||
postData = JSON.stringify(opt.data);
|
||||
xhr.setRequestHeader('Content-Type', 'application/json;charset=utf-8');
|
||||
} else {
|
||||
xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded;charset=utf-8');
|
||||
}
|
||||
if (opt.headers && opt.headers['Accept']) {
|
||||
xhr.setRequestHeader('Accept', opt.headers['Accept']);
|
||||
} else {
|
||||
xhr.setRequestHeader('Accept', 'application/vnd.github.squirrel-girl-preview, application/vnd.github.html+json');
|
||||
}
|
||||
// 登录校验
|
||||
if (token) {
|
||||
xhr.setRequestHeader('Authorization', 'token ' + token);
|
||||
}
|
||||
xhr.send(postData);
|
||||
} else if (opt.method.toUpperCase() === 'GET') {
|
||||
xhr.open(opt.method, opt.url + '?' + postData, opt.async);
|
||||
xhr.setRequestHeader('Accept', 'application/vnd.github.squirrel-girl-preview, application/vnd.github.html+json');
|
||||
// 登录校验
|
||||
if (token) {
|
||||
xhr.setRequestHeader('Authorization', 'token ' + token);
|
||||
}
|
||||
xhr.send(null);
|
||||
}
|
||||
|
||||
xhr.onreadystatechange = function () {
|
||||
if (xhr.readyState === 4) {
|
||||
if (xhr.status >= 200 && xhr.status < 300) {
|
||||
opt.success && opt.success(xhr.responseText);
|
||||
} else {
|
||||
opt.fail && opt.fail(xhr.status)
|
||||
}
|
||||
}
|
||||
};
|
||||
xhr.onerror = function () {
|
||||
opt.fail && opt.fail({ message: '请求错误！' });
|
||||
};
|
||||
};
|
||||
JL.issueComments = 0;
|
||||
JL.issueNumber = 0;
|
||||
JL.Utils = {
|
||||
ajax: ajax,
|
||||
queryUrl: queryUrl,
|
||||
addClass: addClass,
|
||||
removeClass: removeClass,
|
||||
formatDate: formatDate
|
||||
};
|
||||
JL.Renders = {
|
||||
box: {
|
||||
tpl: [
|
||||
'<section class="box" id="JELON__commentBox">',
|
||||
'<div class="com-avatar"><img id="JELON__loginAvatar" src="/img/unsigned_avatar.jpg" alt="avatar"></div>',
|
||||
'<div class="com-text">',
|
||||
'<div class="main">',
|
||||
'<textarea class="text-area-edited show" id="JELON__editBox" placeholder="欢迎评论！"></textarea>',
|
||||
'<div class="text-area-preview" id="JELON__previewBox"></div>',
|
||||
'</div>',
|
||||
'<div class="switch">',
|
||||
'<div class="switch-item on" id="JELON__editSwitcher" onclick="JELON.Actions.editPreviewSwitch(\'edit\')">编辑</div>',
|
||||
'<div class="switch-item" id="JELON__previewSwitcher" onclick="JELON.Actions.editPreviewSwitch(\'preview\')">预览</div>',
|
||||
'</div>',
|
||||
'<div class="button" onclick="JELON.Actions.postComment()">提交</div>',
|
||||
'</div>',
|
||||
'</section>'
|
||||
].join(''),
|
||||
update: function () {
|
||||
var userInfo = localStorage.getItem(constants.USER_INFO_KEY);
|
||||
if (userInfo) {
|
||||
userInfo = JSON.parse(userInfo);
|
||||
} else {
|
||||
userInfo = {};
|
||||
}
|
||||
// 默认头像路径 /img/jelon.jpg
|
||||
$('JELON__loginAvatar').src = userInfo.avatar_url || '/img/unsigned_avatar.jpg';
|
||||
}
|
||||
},
|
||||
list: {
|
||||
tpl: [
|
||||
'<section class="list-wrap" id="JELON__commentList">',
|
||||
'<div class="text-center">正在加载评论</div>',
|
||||
'</section>'
|
||||
].join(''),
|
||||
/**
|
||||
* 评论列表模块视图更新
|
||||
* @param {Number} page 评论列表当前页码
|
||||
* @param {Number} comments 当前文章下所有评论总数
|
||||
* @param {Number} list 当前列表下评论列表数据
|
||||
* @param {Function} callback 回调
|
||||
* @return void(0)
|
||||
*/
|
||||
update: function (page, comments, list, callback) {
|
||||
var perNavPageMaxSize = 5;
|
||||
var html = '';
|
||||
var htmlList = [];
|
||||
var pageList = [];
|
||||
var allPages = Math.ceil(comments / constants.PER_PAGE);
|
||||
if (comments === 0) {
|
||||
html = '<div class="text-center">暂无评论</div>';
|
||||
} else {
|
||||
var item = '';
|
||||
var pageItem = '';
|
||||
for (var i = 0, len = list.length; i < len; i++) {
|
||||
item = [
|
||||
'<li class="item">',
|
||||
'<div class="user-avatar">',
|
||||
'<a target="_blank" href="' + list[i].user.html_url + '">',
|
||||
'<img src="' + list[i].user.avatar_url + '" alt="user-avatar">',
|
||||
'</a>',
|
||||
'</div>',
|
||||
'<div class="user-comment">',
|
||||
'<div class="user-comment-header" id="JELON__comment_' + list[i].id + '_reactions">',
|
||||
'<span class="post-name">' + list[i].user.login + '</span>',
|
||||
'<span class="post-time">' + formatDate('yyyy-MM-dd hh:mm', new Date(list[i].created_at)) + '</span>',
|
||||
'<span class="like" onclick="JELON.Actions.like(' + list[i].id + ')">点赞</span>',
|
||||
'<span class="like-num">' + list[i].reactions.heart + '</span>',
|
||||
'<span class="reply" onclick="JELON.Actions.reply(\'' + list[i].user.login + '\', \'' + (list[i].body_html || list[i].body).replace(/<[^>]+>|\s|[\r\n]/g, ' ') + '\')">回复</span>',
|
||||
'</div>',
|
||||
'<div class="user-comment-body">' + (list[i].body_html || list[i].body) + '</div>',
|
||||
'</div>',
|
||||
'</li>'
|
||||
].join('');
|
||||
htmlList.push(item);
|
||||
}
|
||||
if (allPages === 1) {
|
||||
pageItem = '<a href="javascript: void(0);" class="item current">' + page + '</a>';
|
||||
pageList.push(pageItem);
|
||||
} else if (allPages <= perNavPageMaxSize) {
|
||||
for (var i = 1; i <= allPages; i++) {
|
||||
if (i === page) {
|
||||
pageItem = '<a href="javascript: void(0);" class="item current">' + page + '</a>';
|
||||
} else {
|
||||
pageItem = '<a href="javascript: JELON.Actions.pageJump(' + i + ');" class="item">' + i + '</a>';
|
||||
}
|
||||
pageList.push(pageItem);
|
||||
}
|
||||
if (page !== 1) {
|
||||
pageList.unshift('<a href="javascript: JELON.Actions.pageJump(' + (page - 1) + ');" class="item">上页</a>');
|
||||
}
|
||||
if (page !== allPages) {
|
||||
pageList.push('<a href="javascript: JELON.Actions.pageJump(' + (page + 1) + ');" class="item">下页</a>');
|
||||
}
|
||||
} else if (allPages > perNavPageMaxSize) {
|
||||
if (page <= perNavPageMaxSize) {
|
||||
for (var i = 1; i <= perNavPageMaxSize; i++) {
|
||||
if (i === page) {
|
||||
pageItem = '<a href="javascript: void(0);" class="item current">' + page + '</a>';
|
||||
} else {
|
||||
pageItem = '<a href="javascript: JELON.Actions.pageJump(' + i + ');" class="item">' + i + '</a>';
|
||||
}
|
||||
pageList.push(pageItem);
|
||||
}
|
||||
if (page !== 1) {
|
||||
pageList.unshift('<a href="javascript: JELON.Actions.pageJump(' + (page - 1) + ');" class="item">上页</a>');
|
||||
}
|
||||
pageList.push('<span class="more">...</span>');
|
||||
pageList.push('<a href="javascript: JELON.Actions.pageJump(' + (page + 1) + ');" class="item">下页</a>');
|
||||
pageList.push('<a href="javascript: JELON.Actions.pageJump(' + allPages + ');" class="item">末页</a>');
|
||||
} else if (page > perNavPageMaxSize && page <= allPages - perNavPageMaxSize) {
|
||||
var mod = page % perNavPageMaxSize;
|
||||
var start = Math.floor(page / perNavPageMaxSize) * perNavPageMaxSize + 1;
|
||||
var end = Math.ceil(page / perNavPageMaxSize) * perNavPageMaxSize;
|
||||
pageList.push('<a href="javascript: JELON.Actions.pageJump(1);" class="item">首页</a>');
|
||||
pageList.push('<a href="javascript: JELON.Actions.pageJump(' + (page - 1) + ');" class="item">上页</a>');
|
||||
for (var i = start; i <= end; i++) {
|
||||
if (i === page) {
|
||||
pageItem = '<a href="javascript: void(0);" class="item current">' + page + '</a>';
|
||||
} else {
|
||||
pageItem = '<a href="javascript: JELON.Actions.pageJump(' + i + ');" class="item">' + i + '</a>';
|
||||
}
|
||||
pageList.push(pageItem);
|
||||
}
|
||||
|
||||
pageList.push('<span class="more">...</span>');
|
||||
pageList.push('<a href="javascript: JELON.Actions.pageJump(' + (page + 1) + ');" class="item">下页</a>');
|
||||
pageList.push('<a href="javascript: JELON.Actions.pageJump(' + allPages + ');" class="item">末页</a>');
|
||||
} else if (page > perNavPageMaxSize && page > allPages - perNavPageMaxSize) {
|
||||
var start = allPages - perNavPageMaxSize + 1;
|
||||
var end = allPages;
|
||||
pageList.push('<a href="javascript: JELON.Actions.pageJump(1);" class="item">首页</a>');
|
||||
pageList.push('<a href="javascript: JELON.Actions.pageJump(' + (page - 1) + ');" class="item">上页</a>');
|
||||
for (var i = start; i <= end; i++) {
|
||||
if (i === page) {
|
||||
pageItem = '<a href="javascript: void(0);" class="item current">' + page + '</a>';
|
||||
} else {
|
||||
pageItem = '<a href="javascript: JELON.Actions.pageJump(' + i + ');" class="item">' + i + '</a>';
|
||||
}
|
||||
pageList.push(pageItem);
|
||||
}
|
||||
if (page !== allPages) {
|
||||
pageList.push('<a href="javascript: JELON.Actions.pageJump(' + (page + 1) + ');" class="item">下页</a>');
|
||||
}
|
||||
}
|
||||
}
|
||||
html = [
|
||||
'<header class="list-header">总共 <span class="comments-num" id="JELON__commentsNum">' + JL.issueComments + '</span> 条评论</header>',
|
||||
'<ul class="list">',
|
||||
htmlList.join(''),
|
||||
'</ul>',
|
||||
'<div class="page-nav">',
|
||||
pageList.join(''),
|
||||
'</div>'
|
||||
].join('');
|
||||
}
|
||||
$('JELON__commentList').innerHTML = html;
|
||||
if (localStorage.getItem(constants.USER_INFO_KEY)) {
|
||||
callback && callback();
|
||||
}
|
||||
},
|
||||
reactionUpdate: function (commentId, reactions) {
|
||||
var userInfo = localStorage.getItem(constants.USER_INFO_KEY);
|
||||
if (userInfo) {
|
||||
userInfo = JSON.parse(userInfo);
|
||||
} else {
|
||||
return;
|
||||
}
|
||||
var userId = userInfo.id;
|
||||
for (var i = 0, len = reactions.length; i < len; i++) {
|
||||
if (userId === reactions[i].user.id) {
|
||||
console.log(userId, reactions[i].user.id);
|
||||
addClass($('JELON__comment_' + commentId + '_reactions').getElementsByClassName('like')[0], 'liked');
|
||||
$('JELON__comment_' + commentId + '_reactions').getElementsByClassName('like')[0].innerHTML = '已赞';
|
||||
break;
|
||||
}
|
||||
}
|
||||
},
|
||||
addOne: function (data) {
|
||||
var oLi = document.createElement('li');
|
||||
oLi.className = 'item';
|
||||
var item = [
|
||||
'<div class="user-avatar">',
|
||||
'<a target="_blank" href="' + data.user.html_url + '">',
|
||||
'<img src="' + data.user.avatar_url + '" alt="user-avatar">',
|
||||
'</a>',
|
||||
'</div>',
|
||||
'<div class="user-comment">',
|
||||
'<div class="user-comment-header" id="JELON__comment_' + data.id + '_reactions">',
|
||||
'<span class="post-name">' + data.user.login + '</span>',
|
||||
'<span class="post-time">' + formatDate('yyyy-MM-dd hh:mm', new Date(data.created_at)) + '</span>',
|
||||
'<span class="like" onclick="JELON.Actions.like(' + data.reactions.heart + ')">点赞</span>',
|
||||
'<span class="like-num">' + data.reactions.heart + '</span>',
|
||||
'<span class="reply" onclick="JELON.Actions.reply(\'' + data.user.login + '\', \'' + (data.body_html || data.body).replace(/<[^>]+>|\s|[\r\n]/g, ' ') + '\')">回复</span>',
|
||||
'</div>',
|
||||
'<div class="user-comment-body">' + (data.body_html || data.body) + '</div>',
|
||||
'</div>'
|
||||
].join('');
|
||||
oLi.innerHTML = item;
|
||||
var oUl = $('JELON__commentList').getElementsByTagName('ul')[0];
|
||||
if (oUl) {
|
||||
oUl.insertBefore(oLi, oUl.firstChild);
|
||||
$('JELON__commentsNum').innerHTML = JL.issueComments + 1;
|
||||
} else {
|
||||
$('JELON__commentList').innerHTML = [
|
||||
'<header class="list-header">总共 <span class="comments-num" id="JELON__commentsNum">' + (JL.issueComments + 1) + '</span> 条评论</header>',
|
||||
'<ul class="list">',
|
||||
'<li class="item">',
|
||||
item,
|
||||
'</li>',
|
||||
'</ul>'
|
||||
].join('');
|
||||
}
|
||||
}
|
||||
},
|
||||
signBar: {
|
||||
tpl: [
|
||||
'<div class="sign-bar" id="JELON__commentSignBar">',
|
||||
'</div>'
|
||||
].join(''),
|
||||
update: function () {
|
||||
var token = localStorage.getItem(constants.ACCESS_TOKEN_KEY);
|
||||
var userInfo = localStorage.getItem(constants.USER_INFO_KEY);
|
||||
var html = '';
|
||||
if (token && userInfo) {
|
||||
userInfo = JSON.parse(userInfo);
|
||||
html = [
|
||||
'<span class="sign-txt" title="' + userInfo.login + '">GitHub 已登录!</span>',
|
||||
'<span class="sign-link" onclick="JELON.Actions.signOut()">退出</span>'
|
||||
].join('');
|
||||
} else {
|
||||
html = [
|
||||
'<span class="sign-txt">GitHub 未登录?</span>',
|
||||
'<a href="https://github.com/login/oauth/authorize?scope=public_repo&redirect_uri=',
|
||||
location.href.indexOf('?') !== -1 ? encodeURIComponent(location.href.substring(0, location.href.indexOf('?'))) : encodeURIComponent(location.href),
|
||||
'&client_id=' + JL.options.clientId + '&client_secret=' + JL.options.clientSecret + '" class="sign-link">',
|
||||
'登录',
|
||||
'</a>'
|
||||
].join('');
|
||||
}
|
||||
$('JELON__commentSignBar').innerHTML = html;
|
||||
}
|
||||
},
|
||||
tips: {
|
||||
tpl: '<section class="tips clearfix" id="JELON__comment_tips">注：评论支持 markdown 语法！</section>',
|
||||
update: function () {
|
||||
var userInfo = localStorage.getItem(constants.USER_INFO_KEY);
|
||||
var handler = '';
|
||||
// 如果文章还没关联 issue 并且登录账号是自己时
|
||||
if (userInfo && JSON.parse(userInfo).login === JL.options.owner && JL.issueNumber === 0) {
|
||||
handler = '<a href="javascript: JELON.Actions.createIssue();" class="init" title="文章关联 issue">初始化评论</a>';
|
||||
}
|
||||
$('JELON__comment_tips').innerHTML = handler + '注：评论支持 markdown 语法！';
|
||||
}
|
||||
},
|
||||
flashTitle: function (title) {
|
||||
var counter = 0;
|
||||
document.title = title + '...';
|
||||
var timer = setInterval(function () {
|
||||
counter++;
|
||||
if (counter % 3 === 0) {
|
||||
document.title = title + '...';
|
||||
} else if (counter % 3 === 1) {
|
||||
document.title = title + '..';
|
||||
} else if (counter % 3 === 2) {
|
||||
document.title = title + '.';
|
||||
}
|
||||
}, 100);
|
||||
},
|
||||
loading: {
|
||||
create: function (oParent) {
|
||||
oParent = oParent || document.body;
|
||||
var oLoading = document.createElement('div');
|
||||
oLoading.className = 'loading-mask';
|
||||
oLoading.id = 'JELON__loadingMask';
|
||||
oLoading.innerHTML = '<div class="loading-icon"><img src="/img/loading.gif" width="50" height="50" alt="加载中" ></div>';
|
||||
oParent.appendChild(oLoading);
|
||||
},
|
||||
remove: function () {
|
||||
var oLoading = $('JELON__loadingMask');
|
||||
oLoading.parentNode.removeChild(oLoading);
|
||||
}
|
||||
}
|
||||
};
|
||||
JL.Actions = {
|
||||
init: function () {
|
||||
var code = queryUrl('code');
|
||||
JL.Renders.signBar.update();
|
||||
JL.Renders.box.update();
|
||||
// if code，继续GitHub 授权
|
||||
if (code) {
|
||||
JL.Renders.loading.create();
|
||||
JL.Renders.flashTitle('登录中');
|
||||
JL.Requests.getAccessToken({
|
||||
client_id: JL.options.clientId,
|
||||
client_secret: JL.options.clientSecret,
|
||||
code: code
|
||||
}, function (res) {
|
||||
if (res.access_token || res.data) {
|
||||
if (res.data) {
|
||||
res.access_token = res.data.access_token;
|
||||
}
|
||||
localStorage.setItem(constants.ACCESS_TOKEN_KEY, res.access_token); // 保存 access_token 至 localStorage
|
||||
JL.Requests.getUserInfo({ access_token: res.access_token }, function (res) {
|
||||
if (res.login) {
|
||||
localStorage.setItem(constants.USER_INFO_KEY, JSON.stringify(res)); // 保存用户信息到 localStorage
|
||||
location.href = location.href.substring(0, location.href.indexOf('?'));
|
||||
JL.Renders.loading.remove();
|
||||
}
|
||||
});
|
||||
} else {
|
||||
// 登录失败
|
||||
location.href = location.href.substring(0, location.href.indexOf('?'));
|
||||
JL.Renders.loading.remove();
|
||||
}
|
||||
});
|
||||
} else {
|
||||
JL.Requests.getIssueNumberByLabel(JL.options.label, function (res) {
|
||||
if (res.length > 0) {
|
||||
var number = res[0].number;
|
||||
var comments = res[0].comments; // 该 issue 下所有评论数
|
||||
JL.issueNumber = number;
|
||||
JL.issueComments = comments;
|
||||
JL.Requests.getCommentListByIssueNumber(number, {
|
||||
page: 1,
|
||||
per_page: constants.PER_PAGE
|
||||
}, function (list) {
|
||||
JL.Renders.list.update(1, comments, list, function () {
|
||||
for (var i = 0, len = list.length; i < len; i++) {
|
||||
(function (commentId) {
|
||||
JL.Requests.getReactionsByCommentId(commentId, { content: 'heart' }, function (reactions) {
|
||||
JL.Renders.list.reactionUpdate(commentId, reactions);
|
||||
});
|
||||
}(list[i].id));
|
||||
}
|
||||
});
|
||||
});
|
||||
} else {
|
||||
// 授权码失效
|
||||
if (typeof res !== 'object') {
|
||||
localStorage.removeItem(constants.ACCESS_TOKEN_KEY);
|
||||
localStorage.removeItem(constants.USER_INFO_KEY);
|
||||
JL.Renders.signBar.update();
|
||||
JL.Renders.box.update();
|
||||
console.warn('登录失败，请稍后刷新再试');
|
||||
} else {
|
||||
JL.Renders.list.update(1, 0, []);
|
||||
JL.Renders.tips.update();
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
signOut: function () {
|
||||
localStorage.removeItem(constants.ACCESS_TOKEN_KEY);
|
||||
localStorage.removeItem(constants.USER_INFO_KEY);
|
||||
JL.Renders.signBar.update();
|
||||
JL.Renders.box.update();
|
||||
},
|
||||
pageJump: function (page) {
|
||||
JL.Requests.getCommentListByIssueNumber(JL.issueNumber, {
|
||||
page: Number(page),
|
||||
per_page: constants.PER_PAGE
|
||||
}, function (list) {
|
||||
JL.Renders.list.update(page, JL.issueComments, list, function () {
|
||||
for (var i = 0, len = list.length; i < len; i++) {
|
||||
(function (commentId) {
|
||||
JL.Requests.getReactionsByCommentId(commentId, { content: 'heart' }, function (reactions) {
|
||||
JL.Renders.list.reactionUpdate(commentId, reactions);
|
||||
});
|
||||
}(list[i].id));
|
||||
}
|
||||
});
|
||||
});
|
||||
},
|
||||
editPreviewSwitch: function (flag) {
|
||||
if (flag === 'edit') {
|
||||
removeClass('JELON__previewSwitcher', 'on');
|
||||
addClass('JELON__editSwitcher', 'on');
|
||||
removeClass('JELON__previewBox', 'show');
|
||||
addClass('JELON__editBox', 'show');
|
||||
} else {
|
||||
removeClass('JELON__editSwitcher', 'on');
|
||||
addClass('JELON__previewSwitcher', 'on');
|
||||
removeClass('JELON__editBox', 'show');
|
||||
addClass('JELON__previewBox', 'show');
|
||||
var text = $('JELON__editBox').value.trim();
|
||||
// 安全转义
|
||||
text = htmlEncode(text);
|
||||
if (text) {
|
||||
JL.Requests.markdown({
|
||||
text: text,
|
||||
mode: 'markdown',
|
||||
context: 'github/gollum'
|
||||
}, function (res) {
|
||||
$('JELON__previewBox').innerHTML = res;
|
||||
});
|
||||
} else {
|
||||
$('JELON__previewBox').innerHTML = '';
|
||||
}
|
||||
}
|
||||
},
|
||||
postComment: function () {
|
||||
var accessToken = localStorage.getItem(constants.ACCESS_TOKEN_KEY);
|
||||
var userInfo = localStorage.getItem(constants.USER_INFO_KEY);
|
||||
if (!accessToken || !userInfo) {
|
||||
alert('请先登录哦..!^_^');
|
||||
return;
|
||||
}
|
||||
var body = $('JELON__editBox').value.trim();
|
||||
// 安全转义
|
||||
body = htmlEncode(body);
|
||||
if (body) {
|
||||
JL.Renders.loading.create();
|
||||
if (JL.issueNumber !== 0) {
|
||||
JL.Requests.createComment(JL.issueNumber, {
|
||||
body: body
|
||||
}, function (res) {
|
||||
if (res.id) {
|
||||
JL.Renders.list.addOne(res);
|
||||
JL.issueComments++;
|
||||
$('JELON__editBox').value = '';
|
||||
$('JELON__previewBox').innerHTML = '';
|
||||
}
|
||||
JL.Renders.loading.remove();
|
||||
});
|
||||
} else {
|
||||
// 如果还没有创建 issue，先创建 issue
|
||||
JL.Requests.createIssue({
|
||||
title: document.title,
|
||||
body: location.href,
|
||||
labels: [ (JL.options.label || location.href) ]
|
||||
}, function (res) {
|
||||
if (res.number) {
|
||||
JL.issueNumber = res.number
|
||||
JL.Requests.createComment(JL.issueNumber, {
|
||||
body: body
|
||||
}, function (json) {
|
||||
if (res.id) {
|
||||
JL.Renders.list.addOne(json);
|
||||
JL.issueComments++;
|
||||
$('JELON__editBox').value = '';
|
||||
$('JELON__previewBox').innerHTML = '';
|
||||
}
|
||||
JL.Renders.loading.remove();
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
},
|
||||
like: function (commentId) {
|
||||
var oLiked = $('JELON__comment_' + commentId + '_reactions').getElementsByClassName('liked');
|
||||
var oLike = $('JELON__comment_' + commentId + '_reactions').getElementsByClassName('like')[0];
|
||||
var oNum = $('JELON__comment_' + commentId + '_reactions').getElementsByClassName('like-num')[0];
|
||||
var accessToken = localStorage.getItem(constants.ACCESS_TOKEN_KEY);
|
||||
var userInfo = localStorage.getItem(constants.USER_INFO_KEY);
|
||||
if (oLiked.length) {
|
||||
return false;
|
||||
} else {
|
||||
if (accessToken && userInfo) {
|
||||
JL.Requests.createReaction(commentId, { content: 'heart' }, function (res) {
|
||||
if (res.content === 'heart') {
|
||||
addClass(oLike, 'liked');
|
||||
oLike.innerHTML = '已赞';
|
||||
oNum.innerHTML = Number(oNum.innerHTML) + 1;
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
},
|
||||
createIssue: function () {
|
||||
JL.Renders.loading.create();
|
||||
JL.Requests.createIssue({
|
||||
title: document.title,
|
||||
body: location.href,
|
||||
labels: [ (JL.options.label || location.href) ]
|
||||
}, function (json) {
|
||||
if (json.number) {
|
||||
JL.issueNumber = json.number;
|
||||
JL.Renders.tips.update();
|
||||
}
|
||||
JL.Renders.loading.remove();
|
||||
});
|
||||
},
|
||||
reply: function (people, content) {
|
||||
var accessToken = localStorage.getItem(constants.ACCESS_TOKEN_KEY);
|
||||
var userInfo = localStorage.getItem(constants.USER_INFO_KEY);
|
||||
if (!accessToken || !userInfo) {
|
||||
return;
|
||||
}
|
||||
JL.Actions.editPreviewSwitch('edit');
|
||||
$('JELON__editBox').value = '';
|
||||
$('JELON__editBox').focus();
|
||||
$('JELON__editBox').value = [
|
||||
'@' + people + '\n',
|
||||
'> ' + content + '\n',
|
||||
'\n'
|
||||
].join('');
|
||||
$('JELON__previewBox').innerHTML = '';
|
||||
}
|
||||
};
|
||||
JL.Requests = {
|
||||
getIssueNumberByLabel: function (label, callback) {
|
||||
ajax({
|
||||
url: constants.API_HOST + '/repos/' + JL.options.owner + '/' + JL.options.repo + '/issues',
|
||||
method: 'GET',
|
||||
data: {
|
||||
labels: [ label ],
|
||||
rnd: Math.random()
|
||||
},
|
||||
success: function (res) {
|
||||
if (typeof res === 'string') {
|
||||
if (window.JSON) {
|
||||
res = JSON.parse(res);
|
||||
} else {
|
||||
res = eval('(' + res + ')');
|
||||
}
|
||||
}
|
||||
callback && callback(res);
|
||||
},
|
||||
fail: function (err) {
|
||||
callback && callback(err);
|
||||
}
|
||||
});
|
||||
},
|
||||
createIssue: function (data, callback) {
|
||||
ajax({
|
||||
url: constants.API_HOST + '/repos/' + JL.options.owner + '/' + JL.options.repo + '/issues',
|
||||
method: 'POST',
|
||||
data: data,
|
||||
success: function (res) {
|
||||
if (typeof res === 'string') {
|
||||
if (window.JSON) {
|
||||
res = JSON.parse(res);
|
||||
} else {
|
||||
res = eval('(' + res + ')');
|
||||
}
|
||||
}
|
||||
callback && callback(res);
|
||||
},
|
||||
fail: function (err) {
|
||||
callback && callback(err);
|
||||
}
|
||||
});
|
||||
},
|
||||
getCommentListByIssueNumber: function (number, data, callback) {
|
||||
ajax({
|
||||
url: constants.API_HOST + '/repos/' + JL.options.owner + '/' + JL.options.repo + '/issues/' + number + '/comments',
|
||||
method: 'GET',
|
||||
data: data,
|
||||
success: function (res) {
|
||||
if (typeof res === 'string') {
|
||||
if (window.JSON) {
|
||||
res = JSON.parse(res);
|
||||
} else {
|
||||
res = eval('(' + res + ')');
|
||||
}
|
||||
}
|
||||
callback && callback(res);
|
||||
},
|
||||
fail: function (err) {
|
||||
callback && callback(err);
|
||||
}
|
||||
});
|
||||
},
|
||||
getReactionsByCommentId: function (id, data, callback) {
|
||||
if (typeof data === 'object' && !data.rnd) {
|
||||
data.rnd = Math.random();
|
||||
}
|
||||
ajax({
|
||||
url: constants.API_HOST + '/repos/' + JL.options.owner + '/' + JL.options.repo + '/issues/comments/' + id + '/reactions',
|
||||
method: 'GET',
|
||||
data: data,
|
||||
success: function (res) {
|
||||
if (typeof res === 'string') {
|
||||
if (window.JSON) {
|
||||
res = JSON.parse(res);
|
||||
} else {
|
||||
res = eval('(' + res + ')');
|
||||
}
|
||||
}
|
||||
callback && callback(res);
|
||||
},
|
||||
fail: function (err) {
|
||||
callback && callback(err);
|
||||
}
|
||||
});
|
||||
},
|
||||
editIssue: function (number, data, callback) {
|
||||
ajax({
|
||||
url: constants.API_HOST + '/repos/' + JL.options.owner + '/' + JL.options.owner + '/issues/' + number,
|
||||
method: 'POST',
|
||||
data: data,
|
||||
success: function (res) {
|
||||
if (typeof res === 'string') {
|
||||
if (window.JSON) {
|
||||
res = JSON.parse(res);
|
||||
} else {
|
||||
res = eval('(' + res + ')');
|
||||
}
|
||||
}
|
||||
callback && callback(res);
|
||||
},
|
||||
fail: function (err) {
|
||||
callback && callback(err);
|
||||
}
|
||||
});
|
||||
},
|
||||
markdown: function (data, callback) {
|
||||
ajax({
|
||||
url: constants.API_HOST + '/markdown',
|
||||
method: 'POST',
|
||||
data: data,
|
||||
success: function (res) {
|
||||
callback && callback(res);
|
||||
},
|
||||
fail: function (err) {
|
||||
callback && callback(err);
|
||||
}
|
||||
});
|
||||
},
|
||||
getAccessToken: function (data, callback) {
|
||||
ajax({
|
||||
// url: 'https://gh-oauth.imsun.net/',
|
||||
url: 'https://cors-anywhere.herokuapp.com/https://github.com/login/oauth/access_token',
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Accept': 'application/json'
|
||||
},
|
||||
data: data,
|
||||
success: function (res) {
|
||||
if (typeof res === 'string') {
|
||||
if (window.JSON) {
|
||||
res = JSON.parse(res);
|
||||
} else {
|
||||
res = eval('(' + res + ')');
|
||||
}
|
||||
}
|
||||
callback && callback(res);
|
||||
},
|
||||
fail: function (err) {
|
||||
callback && callback(err);
|
||||
}
|
||||
});
|
||||
},
|
||||
getUserInfo: function (data, callback) {
|
||||
ajax({
|
||||
url: constants.API_HOST + '/user',
|
||||
method: 'GET',
|
||||
data: data,
|
||||
success: function (res) {
|
||||
if (typeof res === 'string') {
|
||||
if (window.JSON) {
|
||||
res = JSON.parse(res);
|
||||
} else {
|
||||
res = eval('(' + res + ')');
|
||||
}
|
||||
}
|
||||
callback && callback(res);
|
||||
},
|
||||
fail: function (err) {
|
||||
callback && callback(err);
|
||||
}
|
||||
});
|
||||
},
|
||||
createComment: function (number, data, callback) {
|
||||
ajax({
|
||||
url: constants.API_HOST + '/repos/' + JL.options.owner + '/' + JL.options.repo + '/issues/' + number + '/comments',
|
||||
method: 'POST',
|
||||
data: data,
|
||||
success: function (res) {
|
||||
if (typeof res === 'string') {
|
||||
if (window.JSON) {
|
||||
res = JSON.parse(res);
|
||||
} else {
|
||||
res = eval('(' + res + ')');
|
||||
}
|
||||
}
|
||||
callback && callback(res);
|
||||
},
|
||||
fail: function (err) {
|
||||
callback && callback(err);
|
||||
}
|
||||
});
|
||||
},
|
||||
createReaction: function (commentId, data, callback) {
|
||||
ajax({
|
||||
url: constants.API_HOST + '/repos/' + JL.options.owner + '/' + JL.options.repo + '/issues/comments/' + commentId + '/reactions',
|
||||
method: 'POST',
|
||||
data: data,
|
||||
success: function (res) {
|
||||
if (typeof res === 'string') {
|
||||
if (window.JSON) {
|
||||
res = JSON.parse(res);
|
||||
} else {
|
||||
res = eval('(' + res + ')');
|
||||
}
|
||||
}
|
||||
callback && callback(res);
|
||||
},
|
||||
fail: function (err) {
|
||||
callback && callback(err);
|
||||
}
|
||||
});
|
||||
}
|
||||
};
|
||||
JL.Comment = function (options) {
|
||||
JL.options = options || {};
|
||||
var $container = $('comments');
|
||||
if (options.container) {
|
||||
if (typeof options.container === 'object') {
|
||||
$container = options.container;
|
||||
} else if (typeof options.container === 'string') {
|
||||
if (/^#/.test(options.container)) {
|
||||
$container = $(options.container.replace(/^#/, ''));
|
||||
} else {
|
||||
$container = $(options.container);
|
||||
}
|
||||
} else {
|
||||
$container = $('comments');
|
||||
}
|
||||
}
|
||||
$container.innerHTML = [
|
||||
this.Renders.signBar.tpl,
|
||||
this.Renders.box.tpl,
|
||||
this.Renders.tips.tpl,
|
||||
this.Renders.list.tpl
|
||||
].join('');
|
||||
JL.Actions.init();
|
||||
};
|
||||
})(JELON);
|
||||
@@ -0,0 +1 @@
|
||||
(function(a,b){function h(a,b){var c=a.createElement("p"),d=a.getElementsByTagName("head")[0]||a.documentElement;return c.innerHTML="x<style>"+b+"</style>",d.insertBefore(c.lastChild,d.firstChild)}function i(){var a=l.elements;return typeof a=="string"?a.split(" "):a}function j(a){var b={},c=a.createElement,f=a.createDocumentFragment,g=f();a.createElement=function(a){if(!l.shivMethods)return c(a);var f;return b[a]?f=b[a].cloneNode():e.test(a)?f=(b[a]=c(a)).cloneNode():f=c(a),f.canHaveChildren&&!d.test(a)?g.appendChild(f):f},a.createDocumentFragment=Function("h,f","return function(){var n=f.cloneNode(),c=n.createElement;h.shivMethods&&("+i().join().replace(/\w+/g,function(a){return c(a),g.createElement(a),'c("'+a+'")'})+");return n}")(l,g)}function k(a){var b;return a.documentShived?a:(l.shivCSS&&!f&&(b=!!h(a,"article,aside,details,figcaption,figure,footer,header,hgroup,nav,section{display:block}audio{display:none}canvas,video{display:inline-block;*display:inline;*zoom:1}[hidden]{display:none}audio[controls]{display:inline-block;*display:inline;*zoom:1}mark{background:#FF0;color:#000}")),g||(b=!j(a)),b&&(a.documentShived=b),a)}var c=a.html5||{},d=/^<|^(?:button|form|map|select|textarea|object|iframe|option|optgroup)$/i,e=/^<|^(?:a|b|button|code|div|fieldset|form|h1|h2|h3|h4|h5|h6|i|iframe|img|input|label|li|link|ol|option|p|param|q|script|select|span|strong|style|table|tbody|td|textarea|tfoot|th|thead|tr|ul)$/i,f,g;(function(){var c=b.createElement("a");c.innerHTML="<xyz></xyz>",f="hidden"in c,f&&typeof injectElementWithStyles=="function"&&injectElementWithStyles("#modernizr{}",function(b){b.hidden=!0,f=(a.getComputedStyle?getComputedStyle(b,null):b.currentStyle).display=="none"}),g=c.childNodes.length==1||function(){try{b.createElement("a")}catch(a){return!0}var c=b.createDocumentFragment();return typeof c.cloneNode=="undefined"||typeof c.createDocumentFragment=="undefined"||typeof c.createElement=="undefined"}()})();var l={elements:c.elements||"abbr article aside audio bdi canvas data datalist details figcaption figure footer header hgroup mark meter nav output progress section summary time video",shivCSS:c.shivCSS!==!1,shivMethods:c.shivMethods!==!1,type:"default",shivDocument:k};a.html5=l,k(b)})(this,document)
|
||||
@@ -0,0 +1,210 @@
|
||||
/*! echo-js v1.7.3 | (c) 2016 @toddmotto | https://github.com/toddmotto/echo */
|
||||
(function(root, factory) {
|
||||
if (typeof define === 'function' && define.amd) {
|
||||
define(function() {
|
||||
return factory(root);
|
||||
});
|
||||
} else if (typeof exports === 'object') {
|
||||
module.exports = factory;
|
||||
} else {
|
||||
root.echo = factory(root);
|
||||
}
|
||||
})(this, function(root) {
|
||||
|
||||
'use strict';
|
||||
|
||||
var echo = {};
|
||||
|
||||
var callback = function() {};
|
||||
|
||||
var offset, poll, delay, useDebounce, unload;
|
||||
|
||||
var isHidden = function(element) {
|
||||
return (element.offsetParent === null);
|
||||
};
|
||||
|
||||
var inView = function(element, view) {
|
||||
if (isHidden(element)) {
|
||||
return false;
|
||||
}
|
||||
|
||||
var box = element.getBoundingClientRect();
|
||||
return (box.right >= view.l && box.bottom >= view.t && box.left <= view.r && box.top <= view.b);
|
||||
};
|
||||
|
||||
var debounceOrThrottle = function() {
|
||||
if (!useDebounce && !!poll) {
|
||||
return;
|
||||
}
|
||||
clearTimeout(poll);
|
||||
poll = setTimeout(function() {
|
||||
echo.render();
|
||||
poll = null;
|
||||
}, delay);
|
||||
};
|
||||
|
||||
echo.init = function(opts) {
|
||||
opts = opts || {};
|
||||
var offsetAll = opts.offset || 0;
|
||||
var offsetVertical = opts.offsetVertical || offsetAll;
|
||||
var offsetHorizontal = opts.offsetHorizontal || offsetAll;
|
||||
var optionToInt = function(opt, fallback) {
|
||||
return parseInt(opt || fallback, 10);
|
||||
};
|
||||
offset = {
|
||||
t: optionToInt(opts.offsetTop, offsetVertical),
|
||||
b: optionToInt(opts.offsetBottom, offsetVertical),
|
||||
l: optionToInt(opts.offsetLeft, offsetHorizontal),
|
||||
r: optionToInt(opts.offsetRight, offsetHorizontal)
|
||||
};
|
||||
delay = optionToInt(opts.throttle, 250);
|
||||
useDebounce = opts.debounce !== false;
|
||||
unload = !!opts.unload;
|
||||
callback = opts.callback || callback;
|
||||
echo.render();
|
||||
if (document.addEventListener) {
|
||||
root.addEventListener('scroll', debounceOrThrottle, false);
|
||||
root.addEventListener('load', debounceOrThrottle, false);
|
||||
} else {
|
||||
root.attachEvent('onscroll', debounceOrThrottle);
|
||||
root.attachEvent('onload', debounceOrThrottle);
|
||||
}
|
||||
};
|
||||
|
||||
echo.render = function() {
|
||||
var nodes = document.querySelectorAll('img[data-echo], [data-echo-background]');
|
||||
var length = nodes.length;
|
||||
var src, elem;
|
||||
var view = {
|
||||
l: 0 - offset.l,
|
||||
t: 0 - offset.t,
|
||||
b: (root.innerHeight || document.documentElement.clientHeight) + offset.b,
|
||||
r: (root.innerWidth || document.documentElement.clientWidth) + offset.r
|
||||
};
|
||||
for (var i = 0; i < length; i++) {
|
||||
elem = nodes[i];
|
||||
if (inView(elem, view)) {
|
||||
|
||||
if (unload) {
|
||||
elem.setAttribute('data-echo-placeholder', elem.src);
|
||||
}
|
||||
|
||||
if (elem.getAttribute('data-echo-background') !== null) {
|
||||
elem.style.backgroundImage = "url(" + elem.getAttribute('data-echo-background') + ")";
|
||||
} else {
|
||||
elem.src = elem.getAttribute('data-echo');
|
||||
}
|
||||
|
||||
if (!unload) {
|
||||
elem.removeAttribute('data-echo');
|
||||
elem.removeAttribute('data-echo-background');
|
||||
}
|
||||
|
||||
callback(elem, 'load');
|
||||
} else if (unload && !!(src = elem.getAttribute('data-echo-placeholder'))) {
|
||||
|
||||
if (elem.getAttribute('data-echo-background') !== null) {
|
||||
elem.style.backgroundImage = "url(" + src + ")";
|
||||
} else {
|
||||
elem.src = src;
|
||||
}
|
||||
|
||||
elem.removeAttribute('data-echo-placeholder');
|
||||
callback(elem, 'unload');
|
||||
}
|
||||
}
|
||||
if (!length) {
|
||||
echo.detach();
|
||||
}
|
||||
};
|
||||
|
||||
echo.detach = function() {
|
||||
if (document.removeEventListener) {
|
||||
root.removeEventListener('scroll', debounceOrThrottle);
|
||||
} else {
|
||||
root.detachEvent('onscroll', debounceOrThrottle);
|
||||
}
|
||||
clearTimeout(poll);
|
||||
};
|
||||
|
||||
return echo;
|
||||
|
||||
});
|
||||
function deepCopy(c, p) {
|
||||
var c = c || {};
|
||||
for (var i in p) {
|
||||
if (typeof p[i] === 'object') {
|
||||
c[i] = (p[i].constructor === Array) ? [] : {};
|
||||
deepCopy(p[i], c[i]);
|
||||
} else {
|
||||
c[i] = p[i];
|
||||
}
|
||||
}
|
||||
return c;
|
||||
}
|
||||
/**
|
||||
* 网站js
|
||||
* @author Jelon
|
||||
* @type {{init, toggleMenu}}
|
||||
*/
|
||||
var JELON = window.JELON || {};
|
||||
JELON = deepCopy(JELON, {
|
||||
name: 'JELON',
|
||||
version: '0.0.2',
|
||||
init: function() {
|
||||
this.toggleMenu();
|
||||
this.backToTop();
|
||||
|
||||
echo.init({
|
||||
offset: 50,
|
||||
throttle: 250,
|
||||
unload: false,
|
||||
callback: function(element, op) {
|
||||
console.log(element, 'has been', op + 'ed')
|
||||
}
|
||||
});
|
||||
},
|
||||
$: function(str) {
|
||||
return /^(\[object HTML)[a-zA-Z]*(Element\])$/.test(Object.prototype.toString.call(str)) ? str : document.getElementById(str);
|
||||
},
|
||||
toggleMenu: function() {
|
||||
var _this = this,
|
||||
$menu = _this.$(_this.name + '__menu');
|
||||
_this.$(_this.name + '__btnDropNav').onclick = function() {
|
||||
if ($menu.className.indexOf('hidden') === -1) {
|
||||
$menu.className += ' hidden';
|
||||
} else {
|
||||
$menu.className = $menu.className.replace(/\s*hidden\s*/, '');
|
||||
}
|
||||
|
||||
};
|
||||
},
|
||||
backToTop: function() {
|
||||
var _this = this;
|
||||
if (typeof _this.$(_this.name + '__backToTop') === 'undefined') return;
|
||||
window.onscroll = window.onresize = function() {
|
||||
if (document.documentElement.scrollTop + document.body.scrollTop > 0) {
|
||||
_this.$(_this.name + '__backToTop').style.display = 'block';
|
||||
} else {
|
||||
_this.$(_this.name + '__backToTop').style.display = 'none';
|
||||
}
|
||||
};
|
||||
_this.$(_this.name + '__backToTop').onclick = function() {
|
||||
var Timer = setInterval(GoTop, 10);
|
||||
|
||||
function GoTop() {
|
||||
if (document.documentElement.scrollTop + document.body.scrollTop < 1) {
|
||||
clearInterval(Timer)
|
||||
} else {
|
||||
document.documentElement.scrollTop /= 1.1;
|
||||
document.body.scrollTop /= 1.1
|
||||
}
|
||||
}
|
||||
};
|
||||
}
|
||||
});
|
||||
|
||||
/**
|
||||
* 程序入口
|
||||
*/
|
||||
JELON.init();
|
||||
Reference in New Issue
Block a user