新主题
This commit is contained in:
结发受长生
parent
de8e1887a6
commit
c77caf259f
26
_config.yml
26
_config.yml
@ -78,7 +78,7 @@ pagination_dir: page
|
||||
# Extensions
|
||||
## Plugins: https://hexo.io/plugins/
|
||||
## Themes: https://hexo.io/themes/
|
||||
theme: raytaylorism
|
||||
theme: yilia
|
||||
|
||||
#----------------------------
|
||||
# 搜索
|
||||
@ -94,9 +94,21 @@ deploy:
|
||||
repo: https://git.coding.net/sookie2010/sookie2010.coding.me.git
|
||||
branch: master
|
||||
|
||||
archive_generator:
|
||||
per_page: 0
|
||||
tag_generator:
|
||||
per_page: 0
|
||||
category_generator:
|
||||
per_page: 0
|
||||
jsonContent:
|
||||
meta: false
|
||||
pages: false
|
||||
posts:
|
||||
title: true
|
||||
date: true
|
||||
path: true
|
||||
text: false
|
||||
raw: false
|
||||
content: false
|
||||
slug: false
|
||||
updated: false
|
||||
comments: false
|
||||
link: false
|
||||
permalink: false
|
||||
excerpt: false
|
||||
categories: true
|
||||
tags: true
|
||||
2697
package-lock.json
generated
Normal file
2697
package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
@ -11,6 +11,7 @@
|
||||
"hexo-generator-category": "^0.1.3",
|
||||
"hexo-generator-feed": "^1.2.2",
|
||||
"hexo-generator-index": "^0.2.0",
|
||||
"hexo-generator-json-content": "^3.0.1",
|
||||
"hexo-generator-search": "^2.2.5",
|
||||
"hexo-generator-tag": "^0.2.0",
|
||||
"hexo-renderer-ejs": "^0.3.0",
|
||||
|
||||
7
themes/yilia/.babelrc
Normal file
7
themes/yilia/.babelrc
Normal file
@ -0,0 +1,7 @@
|
||||
{
|
||||
"presets": ["es2015", "stage-2"],
|
||||
"plugins": [
|
||||
"transform-class-properties",
|
||||
"transform-runtime"
|
||||
]
|
||||
}
|
||||
9
themes/yilia/.editorconfig
Normal file
9
themes/yilia/.editorconfig
Normal file
@ -0,0 +1,9 @@
|
||||
root = true
|
||||
|
||||
[*]
|
||||
charset = utf-8
|
||||
indent_style = space
|
||||
indent_size = 2
|
||||
end_of_line = lf
|
||||
insert_final_newline = true
|
||||
trim_trailing_whitespace = true
|
||||
2
themes/yilia/.eslintignore
Normal file
2
themes/yilia/.eslintignore
Normal file
@ -0,0 +1,2 @@
|
||||
build/*.js
|
||||
config/*.js
|
||||
39
themes/yilia/.eslintrc.js
Normal file
39
themes/yilia/.eslintrc.js
Normal file
@ -0,0 +1,39 @@
|
||||
module.exports = {
|
||||
extends: ['eslint-config-airbnb'],
|
||||
env: {
|
||||
browser: true,
|
||||
node: true,
|
||||
mocha: true,
|
||||
jest: true,
|
||||
es6: true
|
||||
},
|
||||
parser: 'babel-eslint',
|
||||
parserOptions: {
|
||||
ecmaVersion: 6,
|
||||
ecmaFeatures: {
|
||||
jsx: true,
|
||||
experimentalObjectRestSpread: true
|
||||
}
|
||||
},
|
||||
plugins: [
|
||||
'react',
|
||||
'babel'
|
||||
],
|
||||
rules: {
|
||||
'curly': [2, 'all'],
|
||||
'func-names': 0,
|
||||
'prefer-const': 0,
|
||||
'arrow-body-style': 0,
|
||||
'react/sort-comp': 0,
|
||||
'react/prop-types': 0,
|
||||
'react/jsx-first-prop-new-line': 0,
|
||||
'import/no-unresolved': 0,
|
||||
'no-param-reassign': 0,
|
||||
'no-return-assign': 0,
|
||||
'max-len': [2, {
|
||||
'code': 120
|
||||
}],
|
||||
'consistent-return': 0,
|
||||
'comma-dangle': 0
|
||||
}
|
||||
}
|
||||
5
themes/yilia/.gitattributes
vendored
Normal file
5
themes/yilia/.gitattributes
vendored
Normal file
@ -0,0 +1,5 @@
|
||||
*.js linguist-language=JavaScript
|
||||
*.css linguist-language=JavaScript
|
||||
*.scss linguist-language=JavaScript
|
||||
*.ejs linguist-language=JavaScript
|
||||
*.html linguist-language=JavaScript
|
||||
8
themes/yilia/.gitignore
vendored
Normal file
8
themes/yilia/.gitignore
vendored
Normal file
@ -0,0 +1,8 @@
|
||||
.DS_Store
|
||||
node_modules/
|
||||
dist/
|
||||
npm-debug.log
|
||||
selenium-debug.log
|
||||
test/unit/coverage
|
||||
test/e2e/reports
|
||||
source/assets/
|
||||
215
themes/yilia/README.md
Normal file
215
themes/yilia/README.md
Normal file
@ -0,0 +1,215 @@
|
||||
hexo-theme-yilia
|
||||
================
|
||||
|
||||
Yilia 是为 [hexo](https://github.com/tommy351/hexo) 2.4+制作的主题。
|
||||
崇尚简约优雅，以及极致的性能。 你可以点击 [我的博客](http://litten.me/) 查看效果。
|
||||
|
||||
如果想体验手机浏览效果，可以扫一下二维码：
|
||||
|
||||
|
||||
|
||||
—————————————————————
|
||||
|
||||
**关于主题：**
|
||||
|
||||
1. 崇尚简约
|
||||
2. 追求移动端体验
|
||||
3. 希望把加载速度做到极致（努力中）
|
||||
4. 让大家把注意力放到内容上。这是本主题设计初衷
|
||||
5. 主题不支持IE6，7，8。以后也不会
|
||||
|
||||
**近期更新（2017.07.09）：**
|
||||
|
||||
2017.07.09
|
||||
1. 返回顶部
|
||||
2. TOC目录
|
||||
|
||||
2016.12.04
|
||||
1. 打赏
|
||||
2. 搜索
|
||||
3. “更好的”标签云
|
||||
4. “更好的”分享
|
||||
5. 一些动画
|
||||
|
||||
**计划中：**
|
||||
|
||||
1. 移动端优化
|
||||
|
||||
## 一、外观
|
||||
|
||||
####**常规**
|
||||
|
||||
|
||||
|
||||
####**手机**
|
||||
|
||||
|
||||
|
||||
####**ipad横竖屏切换**
|
||||
|
||||
|
||||
|
||||
## 二、开发者
|
||||
|
||||
为了性能和开发工程化考虑，Yilia需要使用webpack进行构建生成。
|
||||
|
||||
如果您对主题有一些定制化的需求，请参考wiki[《Yilia源码目录结构及构建须知》](https://github.com/litten/hexo-theme-yilia/wiki/Yilia%E6%BA%90%E7%A0%81%E7%9B%AE%E5%BD%95%E7%BB%93%E6%9E%84%E5%8F%8A%E6%9E%84%E5%BB%BA%E9%A1%BB%E7%9F%A5)
|
||||
|
||||
## 三、使用
|
||||
|
||||
#### 安装
|
||||
|
||||
``` bash
|
||||
$ git clone https://github.com/litten/hexo-theme-yilia.git themes/yilia
|
||||
```
|
||||
|
||||
#### 配置
|
||||
|
||||
修改hexo根目录下的 `_config.yml` ： `theme: yilia`
|
||||
|
||||
#### 更新
|
||||
|
||||
``` bash
|
||||
cd themes/yilia
|
||||
git pull
|
||||
```
|
||||
|
||||
## 四、配置
|
||||
|
||||
主题配置文件在主目录下的`_config.yml`，请根据自己需要修改使用。
|
||||
完整配置例子，可以参考[我的博客备份](https://github.com/litten/BlogBackup)
|
||||
|
||||
```
|
||||
# Header
|
||||
|
||||
menu:
|
||||
主页: /
|
||||
随笔: /tags/随笔/
|
||||
|
||||
# SubNav
|
||||
subnav:
|
||||
github: "#"
|
||||
weibo: "#"
|
||||
rss: "#"
|
||||
zhihu: "#"
|
||||
#qq: "#"
|
||||
#weixin: "#"
|
||||
#jianshu: "#"
|
||||
#douban: "#"
|
||||
#segmentfault: "#"
|
||||
#bilibili: "#"
|
||||
#acfun: "#"
|
||||
#mail: "mailto:litten225@qq.com"
|
||||
#facebook: "#"
|
||||
#google: "#"
|
||||
#twitter: "#"
|
||||
#linkedin: "#"
|
||||
|
||||
rss: /atom.xml
|
||||
|
||||
# 是否需要修改 root 路径
|
||||
# 如果您的网站存放在子目录中，例如 http://yoursite.com/blog，
|
||||
# 请将您的 url 设为 http://yoursite.com/blog 并把 root 设为 /blog/。
|
||||
root:
|
||||
|
||||
# Content
|
||||
|
||||
# 文章太长，截断按钮文字
|
||||
excerpt_link: more
|
||||
# 文章卡片右下角常驻链接，不需要请设置为false
|
||||
show_all_link: '展开全文'
|
||||
# 数学公式
|
||||
mathjax: false
|
||||
# 是否在新窗口打开链接
|
||||
open_in_new: false
|
||||
|
||||
# 打赏
|
||||
# 打赏type设定：0-关闭打赏； 1-文章对应的md文件里有reward:true属性，才有打赏； 2-所有文章均有打赏
|
||||
reward_type: 2
|
||||
# 打赏wording
|
||||
reward_wording: '谢谢你请我吃糖果'
|
||||
# 支付宝二维码图片地址，跟你设置头像的方式一样。比如：/assets/img/alipay.jpg
|
||||
alipay:
|
||||
# 微信二维码图片地址
|
||||
weixin:
|
||||
|
||||
# 目录
|
||||
# 目录设定：0-不显示目录； 1-文章对应的md文件里有toc:true属性，才有目录； 2-所有文章均显示目录
|
||||
toc: 1
|
||||
# 根据自己的习惯来设置，如果你的目录标题习惯有标号，置为true即可隐藏hexo重复的序号；否则置为false
|
||||
toc_hide_index: true
|
||||
# 目录为空时的提示
|
||||
toc_empty_wording: '目录，不存在的…'
|
||||
|
||||
# 是否有快速回到顶部的按钮
|
||||
top: true
|
||||
|
||||
# Miscellaneous
|
||||
baidu_analytics: ''
|
||||
google_analytics: ''
|
||||
favicon: /favicon.png
|
||||
|
||||
#你的头像url
|
||||
avatar:
|
||||
|
||||
#是否开启分享
|
||||
share_jia: true
|
||||
|
||||
#评论：1、多说；2、网易云跟帖；3、畅言；4、Disqus；5、Gitment
|
||||
#不需要使用某项，直接设置值为false，或注释掉
|
||||
#具体请参考wiki：https://github.com/litten/hexo-theme-yilia/wiki/
|
||||
|
||||
#1、多说
|
||||
duoshuo: false
|
||||
|
||||
#2、网易云跟帖
|
||||
wangyiyun: false
|
||||
|
||||
#3、畅言
|
||||
changyan_appid: false
|
||||
changyan_conf: false
|
||||
|
||||
#4、Disqus 在hexo根目录的config里也有disqus_shortname字段，优先使用yilia的
|
||||
disqus: false
|
||||
|
||||
#5、Gitment
|
||||
gitment_owner: false #你的 GitHub ID
|
||||
gitment_repo: '' #存储评论的 repo
|
||||
gitment_oauth:
|
||||
client_id: '' #client ID
|
||||
client_secret: '' #client secret
|
||||
|
||||
# 样式定制 - 一般不需要修改，除非有很强的定制欲望…
|
||||
style:
|
||||
# 头像上面的背景颜色
|
||||
header: '#4d4d4d'
|
||||
# 右滑板块背景
|
||||
slider: 'linear-gradient(200deg,#a0cfe4,#e8c37e)'
|
||||
|
||||
# slider的设置
|
||||
slider:
|
||||
# 是否默认展开tags板块
|
||||
showTags: false
|
||||
|
||||
# 智能菜单
|
||||
# 如不需要，将该对应项置为false
|
||||
# 比如
|
||||
#smart_menu:
|
||||
# friends: false
|
||||
smart_menu:
|
||||
innerArchive: '所有文章'
|
||||
friends: '友链'
|
||||
aboutme: '关于我'
|
||||
|
||||
friends:
|
||||
友情链接1: http://localhost:4000/
|
||||
友情链接2: http://localhost:4000/
|
||||
友情链接3: http://localhost:4000/
|
||||
友情链接4: http://localhost:4000/
|
||||
友情链接5: http://localhost:4000/
|
||||
友情链接6: http://localhost:4000/
|
||||
|
||||
aboutme: 很惭愧<br><br>只做了一点微小的工作<br>谢谢大家
|
||||
```
|
||||
|
||||
|
||||
128
themes/yilia/_config.yml
Normal file
128
themes/yilia/_config.yml
Normal file
@ -0,0 +1,128 @@
|
||||
# Header
|
||||
|
||||
menu:
|
||||
主页: /
|
||||
随笔: /tags/随笔/
|
||||
|
||||
# SubNav
|
||||
subnav:
|
||||
github: "https://github.com/sookie2010"
|
||||
weibo: "https://weibo.com/2633013641"
|
||||
rss: "/atom.xml"
|
||||
#zhihu: "#"
|
||||
#qq: "#"
|
||||
#weixin: "#"
|
||||
#jianshu: "#"
|
||||
#douban: "#"
|
||||
#segmentfault: "#"
|
||||
#bilibili: "#"
|
||||
#acfun: "#"
|
||||
#mail: "mailto:litten225@qq.com"
|
||||
#facebook: "#"
|
||||
#google: "#"
|
||||
#twitter: "#"
|
||||
#linkedin: "#"
|
||||
|
||||
rss: /atom.xml
|
||||
|
||||
# 是否需要修改 root 路径
|
||||
# 如果您的网站存放在子目录中，例如 http://yoursite.com/blog，
|
||||
# 请将您的 url 设为 http://yoursite.com/blog 并把 root 设为 /blog/。
|
||||
root: /
|
||||
|
||||
# Content
|
||||
|
||||
# 文章太长，截断按钮文字
|
||||
excerpt_link: more
|
||||
# 文章卡片右下角常驻链接，不需要请设置为false
|
||||
show_all_link: '展开全文'
|
||||
# 是否在新窗口打开链接
|
||||
open_in_new: false
|
||||
|
||||
# 打赏
|
||||
# 打赏type设定：0-关闭打赏； 1-文章对应的md文件里有reward:true属性，才有打赏； 2-所有文章均有打赏
|
||||
reward_type: 1
|
||||
# 打赏wording
|
||||
reward_wording: '谢谢你请我吃糖果'
|
||||
# 支付宝二维码图片地址，跟你设置头像的方式一样。比如：/assets/img/alipay.jpg
|
||||
alipay:
|
||||
# 微信二维码图片地址
|
||||
weixin:
|
||||
|
||||
# 目录
|
||||
# 目录设定：0-不显示目录； 1-文章对应的md文件里有toc:true属性，才有目录； 2-所有文章均显示目录
|
||||
toc: 1
|
||||
# 根据自己的习惯来设置，如果你的目录标题习惯有标号，置为true即可隐藏hexo重复的序号；否则置为false
|
||||
toc_hide_index: true
|
||||
# 目录为空时的提示
|
||||
toc_empty_wording: '目录，不存在的…'
|
||||
|
||||
# 是否有快速回到顶部的按钮
|
||||
top: true
|
||||
|
||||
# Miscellaneous
|
||||
baidu_analytics: ''
|
||||
google_analytics: ''
|
||||
favicon: /favicon.ico
|
||||
|
||||
#你的头像url
|
||||
avatar: https://i.loli.net/2018/05/04/5aeb37415a0dc.jpg
|
||||
|
||||
#是否开启分享
|
||||
share_jia: true
|
||||
|
||||
#评论：1、多说；2、网易云跟帖；3、畅言；4、Disqus；5、Gitment
|
||||
#不需要使用某项，直接设置值为false，或注释掉
|
||||
#具体请参考wiki：https://github.com/litten/hexo-theme-yilia/wiki/
|
||||
|
||||
#1、多说
|
||||
duoshuo: false
|
||||
|
||||
#2、网易云跟帖
|
||||
wangyiyun: false
|
||||
|
||||
#3、畅言
|
||||
changyan_appid: false
|
||||
changyan_conf: false
|
||||
|
||||
#4、Disqus 在hexo根目录的config里也有disqus_shortname字段，优先使用yilia的
|
||||
disqus: false
|
||||
|
||||
#5、Gitment
|
||||
gitment_owner: sookie2010 #你的 GitHub ID
|
||||
gitment_repo: hexo_blog #存储评论的 repo
|
||||
gitment_oauth:
|
||||
client_id: 90e8f648da2a669f7975
|
||||
client_secret: 7d2b602616387748ef0df10f7a8a626bdfd1034c
|
||||
|
||||
# 样式定制 - 一般不需要修改，除非有很强的定制欲望…
|
||||
style:
|
||||
# 头像上面的背景颜色
|
||||
header: '#4d4d4d'
|
||||
# 右滑板块背景
|
||||
slider: 'linear-gradient(200deg,#a0cfe4,#e8c37e)'
|
||||
|
||||
# slider的设置
|
||||
slider:
|
||||
# 是否默认展开tags板块
|
||||
showTags: false
|
||||
|
||||
# 智能菜单
|
||||
# 如不需要，将该对应项置为false
|
||||
# 比如
|
||||
#smart_menu:
|
||||
# friends: false
|
||||
smart_menu:
|
||||
innerArchive: '所有文章'
|
||||
friends: '友链'
|
||||
aboutme: '关于我'
|
||||
|
||||
friends:
|
||||
友情链接1: http://localhost:4000/
|
||||
友情链接2: http://localhost:4000/
|
||||
友情链接3: http://localhost:4000/
|
||||
友情链接4: http://localhost:4000/
|
||||
友情链接5: http://localhost:4000/
|
||||
友情链接6: http://localhost:4000/
|
||||
|
||||
aboutme: 很惭愧<br><br>只做了一点微小的工作<br>谢谢大家
|
||||
19
themes/yilia/languages/default.yml
Normal file
19
themes/yilia/languages/default.yml
Normal file
@ -0,0 +1,19 @@
|
||||
categories: Categories
|
||||
search: Search
|
||||
tags: Tags
|
||||
tagcloud: Tag Cloud
|
||||
tweets: Tweets
|
||||
prev: Prev
|
||||
next: Next
|
||||
comment: Comments
|
||||
archive_a: Archives
|
||||
archive_b: "Archives: %s"
|
||||
page: Page %d
|
||||
recent_posts: Recent Posts
|
||||
newer: Newer
|
||||
older: Older
|
||||
share: Share
|
||||
powered_by: Powered by
|
||||
rss_feed: RSS Feed
|
||||
category: Category
|
||||
tag: Tag
|
||||
19
themes/yilia/languages/fr.yml
Normal file
19
themes/yilia/languages/fr.yml
Normal file
@ -0,0 +1,19 @@
|
||||
categories: Catégories
|
||||
search: Rechercher
|
||||
tags: Mot-clés
|
||||
tagcloud: Nuage de mot-clés
|
||||
tweets: Tweets
|
||||
prev: Précédent
|
||||
next: Suivant
|
||||
comment: Commentaires
|
||||
archive_a: Archives
|
||||
archive_b: "Archives: %s"
|
||||
page: Page %d
|
||||
recent_posts: Articles récents
|
||||
newer: Récent
|
||||
older: Ancien
|
||||
share: Partager
|
||||
powered_by: Propulsé by
|
||||
rss_feed: Flux RSS
|
||||
category: Catégorie
|
||||
tag: Mot-clé
|
||||
20
themes/yilia/languages/nl.yml
Normal file
20
themes/yilia/languages/nl.yml
Normal file
@ -0,0 +1,20 @@
|
||||
|
||||
categories: Categorieën
|
||||
search: Zoeken
|
||||
tags: Labels
|
||||
tagcloud: Tag Cloud
|
||||
tweets: Tweets
|
||||
prev: Vorige
|
||||
next: Volgende
|
||||
comment: Commentaren
|
||||
archive_a: Archieven
|
||||
archive_b: "Archieven: %s"
|
||||
page: Pagina %d
|
||||
recent_posts: Recente berichten
|
||||
newer: Nieuwer
|
||||
older: Ouder
|
||||
share: Delen
|
||||
powered_by: Powered by
|
||||
rss_feed: RSS Feed
|
||||
category: Categorie
|
||||
tag: Label
|
||||
19
themes/yilia/languages/no.yml
Normal file
19
themes/yilia/languages/no.yml
Normal file
@ -0,0 +1,19 @@
|
||||
categories: Kategorier
|
||||
search: Søk
|
||||
tags: Tags
|
||||
tagcloud: Tag Cloud
|
||||
tweets: Tweets
|
||||
prev: Forrige
|
||||
next: Neste
|
||||
comment: Kommentarer
|
||||
archive_a: Arkiv
|
||||
archive_b: "Arkiv: %s"
|
||||
page: Side %d
|
||||
recent_posts: Siste innlegg
|
||||
newer: Newer
|
||||
older: Older
|
||||
share: Share
|
||||
powered_by: Powered by
|
||||
rss_feed: RSS Feed
|
||||
category: Category
|
||||
tag: Tag
|
||||
19
themes/yilia/languages/ru.yml
Normal file
19
themes/yilia/languages/ru.yml
Normal file
@ -0,0 +1,19 @@
|
||||
categories: Категории
|
||||
search: Поиск
|
||||
tags: Метки
|
||||
tagcloud: Облако меток
|
||||
tweets: Твиты
|
||||
prev: Назад
|
||||
next: Вперед
|
||||
comment: Комментарии
|
||||
archive_a: Архив
|
||||
archive_b: "Архив: %s"
|
||||
page: Страница %d
|
||||
recent_posts: Недавние записи
|
||||
newer: Следующий
|
||||
older: Предыдущий
|
||||
share: Поделиться
|
||||
powered_by: Создано с помощью
|
||||
rss_feed: RSS-каналы
|
||||
category: Категория
|
||||
tag: Метка
|
||||
19
themes/yilia/languages/zh-CN.yml
Normal file
19
themes/yilia/languages/zh-CN.yml
Normal file
@ -0,0 +1,19 @@
|
||||
categories: 分类
|
||||
search: 搜索
|
||||
tags: 标签
|
||||
tagcloud: 标签云
|
||||
tweets: 推文
|
||||
prev: 上一页
|
||||
next: 下一页
|
||||
comment: 留言
|
||||
archive_a: 归档
|
||||
archive_b: 归档：%s
|
||||
page: 第 %d 页
|
||||
recent_posts: 最新文章
|
||||
newer: Newer
|
||||
older: Older
|
||||
share: Share
|
||||
powered_by: Powered by
|
||||
rss_feed: RSS Feed
|
||||
category: Category
|
||||
tag: Tag
|
||||
19
themes/yilia/languages/zh-tw.yml
Normal file
19
themes/yilia/languages/zh-tw.yml
Normal file
@ -0,0 +1,19 @@
|
||||
categories: 分類
|
||||
search: 搜尋
|
||||
tags: 標籤
|
||||
tagcloud: 標籤雲
|
||||
tweets: 推文
|
||||
prev: 上一頁
|
||||
next: 下一頁
|
||||
comment: 留言
|
||||
archive_a: 彙整
|
||||
archive_b: 彙整：%s
|
||||
page: 第 %d 頁
|
||||
recent_posts: 最新文章
|
||||
newer: Newer
|
||||
older: Older
|
||||
share: Share
|
||||
powered_by: Powered by
|
||||
rss_feed: RSS Feed
|
||||
category: Category
|
||||
tag: Tag
|
||||
14
themes/yilia/layout/_partial/after-footer.ejs
Normal file
14
themes/yilia/layout/_partial/after-footer.ejs
Normal file
@ -0,0 +1,14 @@
|
||||
<script>
|
||||
var yiliaConfig = {
|
||||
isHome: <%=is_home()%>,
|
||||
isPost: <%=is_post()%>,
|
||||
isArchive: <%=is_archive()%>,
|
||||
isTag: <%=is_tag()%>,
|
||||
isCategory: <%=is_category()%>,
|
||||
open_in_new: <%=theme.open_in_new%>,
|
||||
toc_hide_index: <%=theme.toc_hide_index%>,
|
||||
root: "<%=config.root%>",
|
||||
showTags: <%=(theme.slider && theme.slider.showTags) ? true : false%>
|
||||
}
|
||||
</script>
|
||||
<%- partial('script') %>
|
||||
15
themes/yilia/layout/_partial/archive-post.ejs
Normal file
15
themes/yilia/layout/_partial/archive-post.ejs
Normal file
@ -0,0 +1,15 @@
|
||||
<article class="archive-article archive-type-<%= post.layout %>">
|
||||
<div class="archive-article-inner">
|
||||
<header class="archive-article-header">
|
||||
<div class="article-meta">
|
||||
<%- partial('post/date', {class_name: 'archive-article-date', date_format: null}) %>
|
||||
</div>
|
||||
<%- partial('post/title', {class_name: 'archive-article-title'}) %>
|
||||
<div class="article-info info-on-right">
|
||||
<%- partial('post/tag') %>
|
||||
<%- partial('post/category') %>
|
||||
</div>
|
||||
<div class="clearfix"></div>
|
||||
</header>
|
||||
</div>
|
||||
</article>
|
||||
43
themes/yilia/layout/_partial/archive.ejs
Normal file
43
themes/yilia/layout/_partial/archive.ejs
Normal file
@ -0,0 +1,43 @@
|
||||
<% if (pagination == 2){ %>
|
||||
<% page.posts.each(function(post){ %>
|
||||
<%- partial('article', {post: post, index: true}) %>
|
||||
<% }) %>
|
||||
<% if (page.total > 1){ %>
|
||||
<nav id="page-nav">
|
||||
<%- paginator({
|
||||
prev_text: '« Prev',
|
||||
next_text: 'Next »'
|
||||
}) %>
|
||||
</nav>
|
||||
<% } %>
|
||||
<% } else { %>
|
||||
<% var last; %>
|
||||
<% page.posts.each(function(post, i){ %>
|
||||
<% var year = post.date.year(); %>
|
||||
<% if (last != year){ %>
|
||||
<% if (last != null){ %>
|
||||
</div></section>
|
||||
<% } %>
|
||||
<% last = year; %>
|
||||
<section class="archives-wrap">
|
||||
<div class="archive-year-wrap">
|
||||
<a href="<%- url_for('archives/' + year) %>" class="archive-year"><%= year %></a>
|
||||
</div>
|
||||
<div class="archives">
|
||||
<% } %>
|
||||
<%- partial('archive-post', {post: post, even: i % 2 == 0}) %>
|
||||
<% }) %>
|
||||
<% if (page.posts.length){ %>
|
||||
</div></section>
|
||||
<% } %>
|
||||
|
||||
<% if (page.total > 1){ %>
|
||||
<nav id="page-nav">
|
||||
<%- paginator({
|
||||
prev_text: '« Prev',
|
||||
next_text: 'Next »'
|
||||
}) %>
|
||||
</nav>
|
||||
<% } %>
|
||||
|
||||
<% } %>
|
||||
132
themes/yilia/layout/_partial/article.ejs
Normal file
132
themes/yilia/layout/_partial/article.ejs
Normal file
@ -0,0 +1,132 @@
|
||||
<article id="<%= post.layout %>-<%= post.slug %>" class="article article-type-<%= post.layout %> <%if(index){%> article-index<%}%>" itemscope itemprop="blogPost">
|
||||
<div class="article-inner">
|
||||
<% if (post.link || post.title){ %>
|
||||
<header class="article-header">
|
||||
<%- partial('post/title', {class_name: 'article-title'}) %>
|
||||
<% if (!post.noDate){ %>
|
||||
<%- partial('post/date', {class_name: 'archive-article-date', date_format: null}) %>
|
||||
<% } %>
|
||||
</header>
|
||||
<% } %>
|
||||
<div class="article-entry" itemprop="articleBody">
|
||||
<% if (post.excerpt && index){ %>
|
||||
<%- post.excerpt %>
|
||||
<% if (theme.excerpt_link) { %>
|
||||
<a class="article-more-a" href="<%- url_for(post.path) %>#more"><%= theme.excerpt_link %> >></a>
|
||||
<% } %>
|
||||
<% } else { %>
|
||||
<%- post.content %>
|
||||
<% } %>
|
||||
|
||||
<% if ((theme.reward_type === 2 || (theme.reward_type === 1 && post.reward)) && !index){ %>
|
||||
<div class="page-reward">
|
||||
<a href="javascript:;" class="page-reward-btn tooltip-top">
|
||||
<div class="tooltip tooltip-east">
|
||||
<span class="tooltip-item">
|
||||
赏
|
||||
</span>
|
||||
<span class="tooltip-content">
|
||||
<span class="tooltip-text">
|
||||
<span class="tooltip-inner">
|
||||
<p class="reward-p"><i class="icon icon-quo-left"></i><%= theme.reward_wording%><i class="icon icon-quo-right"></i></p>
|
||||
<div class="reward-box">
|
||||
<% if(theme.alipay) {%>
|
||||
<div class="reward-box-item">
|
||||
<img class="reward-img" src="<%= theme.alipay%>">
|
||||
<span class="reward-type">支付宝</span>
|
||||
</div>
|
||||
<% } %>
|
||||
<% if(theme.weixin) {%>
|
||||
<div class="reward-box-item">
|
||||
<img class="reward-img" src="<%= theme.weixin%>">
|
||||
<span class="reward-type">微信</span>
|
||||
</div>
|
||||
<% } %>
|
||||
</div>
|
||||
</span>
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<% } %>
|
||||
</div>
|
||||
<div class="article-info article-info-index">
|
||||
<%if(post.top){%>
|
||||
<div class="article-pop-out tagcloud">
|
||||
<i class="icon-tuding"></i>
|
||||
<a class="article-tag-list-link color3">置顶</a>
|
||||
</div>
|
||||
<% } %>
|
||||
<%- partial('post/tag') %>
|
||||
<%- partial('post/category') %>
|
||||
<% if (index && theme.show_all_link){ %>
|
||||
<p class="article-more-link">
|
||||
<a class="article-more-a" href="<%- url_for(post.path) %>"><%= theme.show_all_link %> >></a>
|
||||
</p>
|
||||
<% } %>
|
||||
|
||||
<% if (!index && theme.share_jia){ %>
|
||||
<%- partial('post/share') %>
|
||||
<% } %>
|
||||
<div class="clearfix"></div>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
<% if (!index){ %>
|
||||
<%- partial('post/nav') %>
|
||||
<% } %>
|
||||
<%- partial('_partial/aside') %>
|
||||
|
||||
|
||||
<% if (!index && post.comments){ %>
|
||||
<% if (theme.duoshuo){ %>
|
||||
<%- partial('post/duoshuo', {
|
||||
key: post.slug,
|
||||
title: post.title,
|
||||
url: config.url+url_for(post.path)
|
||||
}) %>
|
||||
<% } %>
|
||||
|
||||
<% if (theme.wangyiyun){ %>
|
||||
<%- partial('post/wangyiyun', {
|
||||
key: post.slug,
|
||||
title: post.title,
|
||||
url: config.url+url_for(post.path)
|
||||
}) %>
|
||||
<% } %>
|
||||
|
||||
<% if (theme.changyan_appid && theme.changyan_conf){ %>
|
||||
<%- partial('post/changyan', {
|
||||
key: post.slug,
|
||||
title: post.title,
|
||||
url: config.url+url_for(post.path)
|
||||
}) %>
|
||||
<% } %>
|
||||
|
||||
<% if (theme.disqus || config.disqus_shortname){ %>
|
||||
<section id="comments">
|
||||
<div id="disqus_thread"></div>
|
||||
<script type="text/javascript">
|
||||
/* * * CONFIGURATION VARIABLES: EDIT BEFORE PASTING INTO YOUR WEBPAGE * * */
|
||||
var disqus_shortname = '<%= theme.disqus || config.disqus_shortname %>'; // required: replace example with your forum shortname
|
||||
|
||||
/* * * DON'T EDIT BELOW THIS LINE * * */
|
||||
(function() {
|
||||
var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
|
||||
dsq.src = '//' + disqus_shortname + '.disqus.com/embed.js';
|
||||
(document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
|
||||
})();
|
||||
</script>
|
||||
<noscript>Please enable JavaScript to view the <a href="https://disqus.com/?ref_noscript">comments powered by Disqus.</a></noscript>
|
||||
</section>
|
||||
<% } %>
|
||||
|
||||
<% if (theme.gitment_owner && theme.gitment_repo &&theme.gitment_oauth && theme.gitment_oauth.client_id && theme.gitment_oauth.client_secret){ %>
|
||||
<%- partial('post/gitment', {
|
||||
key: post.slug,
|
||||
title: post.title,
|
||||
url: config.url+url_for(post.path)
|
||||
}) %>
|
||||
<% } %>
|
||||
<% } %>
|
||||
28
themes/yilia/layout/_partial/aside.ejs
Normal file
28
themes/yilia/layout/_partial/aside.ejs
Normal file
@ -0,0 +1,28 @@
|
||||
<aside class="wrap-side-operation">
|
||||
<div class="mod-side-operation">
|
||||
<% if (theme.top){ %>
|
||||
<div class="jump-container" id="js-jump-container" style="display:none;">
|
||||
<a href="javascript:void(0)" class="mod-side-operation__jump-to-top">
|
||||
<i class="icon-font icon-back"></i>
|
||||
</a>
|
||||
<div id="js-jump-plan-container" class="jump-plan-container" style="top: -11px;">
|
||||
<i class="icon-font icon-plane jump-plane"></i>
|
||||
</div>
|
||||
</div>
|
||||
<% } %>
|
||||
<% if (!index && ((theme.toc === 1 && post.toc) || theme.toc === 2)){ %>
|
||||
<div class="toc-container tooltip-left">
|
||||
<i class="icon-font icon-category"></i>
|
||||
<div class="tooltip tooltip-east">
|
||||
<span class="tooltip-item">
|
||||
</span>
|
||||
<span class="tooltip-content">
|
||||
<div class="toc-article">
|
||||
<%- toc(post.content) || theme.toc_empty_wording %>
|
||||
</div>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<% } %>
|
||||
</div>
|
||||
</aside>
|
||||
11
themes/yilia/layout/_partial/baidu-analytics.ejs
Normal file
11
themes/yilia/layout/_partial/baidu-analytics.ejs
Normal file
@ -0,0 +1,11 @@
|
||||
<% if (theme.baidu_analytics){ %>
|
||||
<script>
|
||||
var _hmt = _hmt || [];
|
||||
(function() {
|
||||
var hm = document.createElement("script");
|
||||
hm.src = "https://hm.baidu.com/hm.js?<%= theme.baidu_analytics %>";
|
||||
var s = document.getElementsByTagName("script")[0];
|
||||
s.parentNode.insertBefore(hm, s);
|
||||
})();
|
||||
</script>
|
||||
<% } %>
|
||||
12
themes/yilia/layout/_partial/footer.ejs
Normal file
12
themes/yilia/layout/_partial/footer.ejs
Normal file
@ -0,0 +1,12 @@
|
||||
<footer id="footer">
|
||||
<div class="outer">
|
||||
<div id="footer-info">
|
||||
<div class="footer-left">
|
||||
© <%= date(new Date(), 'YYYY') %> <%= config.author || config.title %>
|
||||
</div>
|
||||
<div class="footer-right">
|
||||
<a href="http://hexo.io/" target="_blank">Hexo</a> Theme <a href="https://github.com/litten/hexo-theme-yilia" target="_blank">Yilia</a> by Litten
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
14
themes/yilia/layout/_partial/google-analytics.ejs
Normal file
14
themes/yilia/layout/_partial/google-analytics.ejs
Normal file
@ -0,0 +1,14 @@
|
||||
<% if (theme.google_analytics){ %>
|
||||
<!-- Google Analytics -->
|
||||
<script type="text/javascript">
|
||||
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
|
||||
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
|
||||
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
|
||||
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
|
||||
|
||||
ga('create', '<%= theme.google_analytics %>', 'auto');
|
||||
ga('send', 'pageview');
|
||||
|
||||
</script>
|
||||
<!-- End Google Analytics -->
|
||||
<% } %>
|
||||
43
themes/yilia/layout/_partial/head.ejs
Normal file
43
themes/yilia/layout/_partial/head.ejs
Normal file
@ -0,0 +1,43 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<%
|
||||
var title = page.title;
|
||||
|
||||
if (is_archive()){
|
||||
title = 'Archives';
|
||||
|
||||
if (is_month()){
|
||||
title += ': ' + page.year + '/' + page.month;
|
||||
} else if (is_year()){
|
||||
title += ': ' + page.year;
|
||||
}
|
||||
} else if (is_category()){
|
||||
title = 'Category: ' + page.category;
|
||||
} else if (is_tag()){
|
||||
title = 'Tag: ' + page.tag;
|
||||
}
|
||||
%>
|
||||
<meta name="renderer" content="webkit">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge" >
|
||||
<link rel="dns-prefetch" href="<%= config.url %>">
|
||||
<title><% if (title){ %><%= title %> | <% } %><%= config.title %></title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
|
||||
<%- open_graph({twitter_id: theme.twitter, google_plus: theme.google_plus, fb_admins: theme.fb_admins, fb_app_id: theme.fb_app_id}) %>
|
||||
<% if (theme.rss){ %>
|
||||
<link rel="alternative" href="<%- theme.rss %>" title="<%= config.title %>" type="application/atom+xml">
|
||||
<% } %>
|
||||
<% if (theme.favicon){ %>
|
||||
<link rel="icon" href="<%- theme.favicon %>">
|
||||
<% } %>
|
||||
<link rel="stylesheet" type="text/css" href="<%= config.root %>style.css">
|
||||
<style type="text/css">
|
||||
<% var defaultCtnBg = 'linear-gradient(200deg,#a0cfe4,#e8c37e)' %>
|
||||
#container.show {
|
||||
background: <%= theme.style && theme.style.slider ? theme.style.slider : defaultCtnBg %>;
|
||||
}
|
||||
</style>
|
||||
<%- partial('google-analytics') %>
|
||||
<%- partial('baidu-analytics') %>
|
||||
</head>
|
||||
32
themes/yilia/layout/_partial/header.ejs
Normal file
32
themes/yilia/layout/_partial/header.ejs
Normal file
@ -0,0 +1,32 @@
|
||||
<header id="header">
|
||||
<div id="banner"></div>
|
||||
<div id="header-outer" class="outer">
|
||||
<div id="header-title" class="inner">
|
||||
<h1 id="logo-wrap">
|
||||
<a href="<%- url_for() %>" id="logo"><%= config.title %></a>
|
||||
</h1>
|
||||
<% if (theme.subtitle){ %>
|
||||
<h2 id="subtitle-wrap">
|
||||
<a href="<%- url_for() %>" id="subtitle"><%= theme.subtitle %></a>
|
||||
</h2>
|
||||
<% } %>
|
||||
</div>
|
||||
<div id="header-inner" class="inner">
|
||||
<nav id="main-nav">
|
||||
<a id="main-nav-toggle" class="nav-icon"></a>
|
||||
<% for (var i in theme.menu){ %>
|
||||
<a class="main-nav-link" href="<%- url_for(theme.menu[i]) %>"><%= i %></a>
|
||||
<% } %>
|
||||
</nav>
|
||||
<nav id="sub-nav">
|
||||
<% if (theme.rss){ %>
|
||||
<a id="nav-rss-link" class="nav-icon" href="<%- theme.rss %>" title="RSS Feed"></a>
|
||||
<% } %>
|
||||
<a id="nav-search-btn" class="nav-icon" title="Search"></a>
|
||||
</nav>
|
||||
<div id="search-form-wrap">
|
||||
<%- search_form({button: ''}) %>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
37
themes/yilia/layout/_partial/left-col.ejs
Normal file
37
themes/yilia/layout/_partial/left-col.ejs
Normal file
@ -0,0 +1,37 @@
|
||||
<% var defaultBg = '#4d4d4d'; %>
|
||||
<div class="overlay" style="background: <%= theme.style && theme.style.header ? theme.style.header : defaultBg %>"></div>
|
||||
<div class="intrude-less">
|
||||
<header id="header" class="inner">
|
||||
<a href="<%=theme.root%>" class="profilepic">
|
||||
<img src="<%=theme.avatar%>" class="js-avatar">
|
||||
</a>
|
||||
<hgroup>
|
||||
<h1 class="header-author"><a href="<%=theme.root%>"><%=theme.author%></a></h1>
|
||||
</hgroup>
|
||||
<% if (theme.subtitle){ %>
|
||||
<p class="header-subtitle"><%=theme.subtitle%></p>
|
||||
<%}%>
|
||||
|
||||
<nav class="header-menu">
|
||||
<ul>
|
||||
<% for (var i in theme.menu){ %>
|
||||
<li><a href="<%- url_for(theme.menu[i]) %>"><%= i %></a></li>
|
||||
<%}%>
|
||||
</ul>
|
||||
</nav>
|
||||
<nav class="header-smart-menu">
|
||||
<% for (var i in theme.smart_menu){ %>
|
||||
<% if(theme.smart_menu[i]){ %>
|
||||
<a @click="openSlider($event, '<%-i%>')" href="javascript:void(0)"><%= theme.smart_menu[i] %></a>
|
||||
<% } %>
|
||||
<% } %>
|
||||
</nav>
|
||||
<nav class="header-nav">
|
||||
<div class="social">
|
||||
<% for (var i in theme.subnav){ %>
|
||||
<a class="<%= i %>" target="_blank" href="<%- url_for(theme.subnav[i]) %>" title="<%= i %>"><i class="icon-<%= i %>"></i></a>
|
||||
<%}%>
|
||||
</div>
|
||||
</nav>
|
||||
</header>
|
||||
</div>
|
||||
43
themes/yilia/layout/_partial/mobile-nav.ejs
Normal file
43
themes/yilia/layout/_partial/mobile-nav.ejs
Normal file
@ -0,0 +1,43 @@
|
||||
<% var defaultBg = '#4d4d4d'; %>
|
||||
<nav id="mobile-nav">
|
||||
<div class="overlay js-overlay" style="background: <%= theme.style && theme.style.header ? theme.style.header : defaultBg %>"></div>
|
||||
<div class="btnctn js-mobile-btnctn">
|
||||
<div class="slider-trigger list" @click="openSlider($event, 'innerArchive')"><i class="icon icon-sort"></i></div>
|
||||
</div>
|
||||
<div class="intrude-less">
|
||||
<header id="header" class="inner">
|
||||
<div class="profilepic">
|
||||
<img src="<%=theme.avatar%>" class="js-avatar">
|
||||
</div>
|
||||
<hgroup>
|
||||
<h1 class="header-author js-header-author"><%=theme.author%></h1>
|
||||
</hgroup>
|
||||
<% if (theme.subtitle){ %>
|
||||
<p class="header-subtitle"><i class="icon icon-quo-left"></i><%=theme.subtitle%><i class="icon icon-quo-right"></i></p>
|
||||
<% } %>
|
||||
<% var count = 0%>
|
||||
<% for (var i in theme.menu){ %>
|
||||
<% count++ %>
|
||||
<% } %>
|
||||
<% var ulWidth = count > 2 ? '70%' : '50%' %>
|
||||
|
||||
<nav class="header-nav">
|
||||
<div class="social">
|
||||
<% for (var i in theme.subnav){ %>
|
||||
<a class="<%= i %>" target="_blank" href="<%- url_for(theme.subnav[i]) %>" title="<%= i %>"><i class="icon-<%= i %>"></i></a>
|
||||
<%}%>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<nav class="header-menu js-header-menu">
|
||||
<ul style="width: <%= ulWidth %>">
|
||||
<% var divide = 100 / count + '%' %>
|
||||
<% for (var i in theme.menu){ %>
|
||||
<li style="width: <%= divide %>"><a href="<%- url_for(theme.menu[i]) %>"><%= i %></a></li>
|
||||
<%}%>
|
||||
</ul>
|
||||
</nav>
|
||||
</header>
|
||||
</div>
|
||||
<div class="mobile-mask" style="display:none" q-show="isShow"></div>
|
||||
</nav>
|
||||
12
themes/yilia/layout/_partial/post/category.ejs
Normal file
12
themes/yilia/layout/_partial/post/category.ejs
Normal file
@ -0,0 +1,12 @@
|
||||
<% if (post.categories && post.categories.length){ %>
|
||||
<div class="article-category tagcloud">
|
||||
<i class="icon-book icon"></i>
|
||||
<ul class="article-tag-list">
|
||||
<% post.categories.forEach(function(category, i){ %>
|
||||
<li class="article-tag-list-item">
|
||||
<a href="javascript:void(0);" class="js-tag article-tag-list-link color<%= category.name.length % 5 + 1 %>"><%-category.name%></a>
|
||||
</li>
|
||||
<% }) %>
|
||||
</ul>
|
||||
</div>
|
||||
<% } %>
|
||||
9
themes/yilia/layout/_partial/post/changyan.ejs
Normal file
9
themes/yilia/layout/_partial/post/changyan.ejs
Normal file
@ -0,0 +1,9 @@
|
||||
<div id="SOHUCS" sid="<%=key%>" ></div>
|
||||
<script charset="utf-8" type="text/javascript" src="//changyan.sohu.com/upload/changyan.js" ></script>
|
||||
<script type="text/javascript">
|
||||
window.changyan.api.config({
|
||||
appid: "<%=theme.changyan_appid%>",
|
||||
conf: "<%=theme.changyan_conf%>"
|
||||
});
|
||||
</script>
|
||||
</script>
|
||||
3
themes/yilia/layout/_partial/post/date.ejs
Normal file
3
themes/yilia/layout/_partial/post/date.ejs
Normal file
@ -0,0 +1,3 @@
|
||||
<a href="<%- url_for(post.path) %>" class="<%= class_name %>">
|
||||
<time datetime="<%= date_xml(post.date) %>" itemprop="datePublished"><i class="icon-calendar icon"></i><%= date(post.date, date_format) %></time>
|
||||
</a>
|
||||
18
themes/yilia/layout/_partial/post/duoshuo.ejs
Normal file
18
themes/yilia/layout/_partial/post/duoshuo.ejs
Normal file
@ -0,0 +1,18 @@
|
||||
<div class="duoshuo">
|
||||
<!-- 多说评论框 start -->
|
||||
<div class="ds-thread" data-thread-key="<%=key%>" data-title="<%=title%>" data-url="<%=url%>"></div>
|
||||
<!-- 多说评论框 end -->
|
||||
<!-- 多说公共JS代码 start (一个网页只需插入一次) -->
|
||||
<script type="text/javascript">
|
||||
var duoshuoQuery = {short_name:"<%=theme.duoshuo%>"};
|
||||
(function() {
|
||||
var ds = document.createElement('script');
|
||||
ds.type = 'text/javascript';ds.async = true;
|
||||
ds.src = (document.location.protocol == 'https:' ? 'https:' : 'http:') + '//static.duoshuo.com/embed.js';
|
||||
ds.charset = 'UTF-8';
|
||||
(document.getElementsByTagName('head')[0]
|
||||
|| document.getElementsByTagName('body')[0]).appendChild(ds);
|
||||
})();
|
||||
</script>
|
||||
<!-- 多说公共JS代码 end -->
|
||||
</div>
|
||||
16
themes/yilia/layout/_partial/post/gitment.ejs
Normal file
16
themes/yilia/layout/_partial/post/gitment.ejs
Normal file
@ -0,0 +1,16 @@
|
||||
<div id="gitment-ctn"></div>
|
||||
<link rel="stylesheet" href="//imsun.github.io/gitment/style/default.css">
|
||||
<script src="//imsun.github.io/gitment/dist/gitment.browser.js"></script>
|
||||
<script>
|
||||
(function(){
|
||||
new Gitment({
|
||||
id: "<%=url%>",
|
||||
owner: '<%=theme.gitment_owner%>',
|
||||
repo: '<%=theme.gitment_repo%>',
|
||||
oauth: {
|
||||
client_id: '<%=theme.gitment_oauth.client_id%>',
|
||||
client_secret: '<%=theme.gitment_oauth.client_secret%>'
|
||||
}
|
||||
}).render('gitment-ctn')
|
||||
})()
|
||||
</script>
|
||||
22
themes/yilia/layout/_partial/post/nav.ejs
Normal file
22
themes/yilia/layout/_partial/post/nav.ejs
Normal file
@ -0,0 +1,22 @@
|
||||
<% if (post.prev || post.next){ %>
|
||||
<nav id="article-nav">
|
||||
<% if (post.prev){ %>
|
||||
<a href="<%- url_for(post.prev.path) %>" id="article-nav-newer" class="article-nav-link-wrap">
|
||||
<i class="icon-circle-left"></i>
|
||||
<div class="article-nav-title">
|
||||
<% if (post.prev.title){ %>
|
||||
<%= post.prev.title %>
|
||||
<% } else { %>
|
||||
(no title)
|
||||
<% } %>
|
||||
</div>
|
||||
</a>
|
||||
<% } %>
|
||||
<% if (post.next){ %>
|
||||
<a href="<%- url_for(post.next.path) %>" id="article-nav-older" class="article-nav-link-wrap">
|
||||
<div class="article-nav-title"><%= post.next.title %></div>
|
||||
<i class="icon-circle-right"></i>
|
||||
</a>
|
||||
<% } %>
|
||||
</nav>
|
||||
<% } %>
|
||||
53
themes/yilia/layout/_partial/post/share.ejs
Normal file
53
themes/yilia/layout/_partial/post/share.ejs
Normal file
@ -0,0 +1,53 @@
|
||||
<%
|
||||
var sUrl = url.replace(/index\.html$/, '');
|
||||
sUrl = /^(http:|https:)\/\//.test(sUrl) ? sUrl : 'http:' + sUrl;
|
||||
%>
|
||||
<div class="share-btn share-icons tooltip-left">
|
||||
<div class="tooltip tooltip-east">
|
||||
<span class="tooltip-item">
|
||||
<a href="javascript:;" class="share-sns share-outer">
|
||||
<i class="icon icon-share"></i>
|
||||
</a>
|
||||
</span>
|
||||
<span class="tooltip-content">
|
||||
<div class="share-wrap">
|
||||
<div class="share-icons">
|
||||
<a class="weibo share-sns" href="javascript:;" data-type="weibo">
|
||||
<i class="icon icon-weibo"></i>
|
||||
</a>
|
||||
<a class="weixin share-sns wxFab" href="javascript:;" data-type="weixin">
|
||||
<i class="icon icon-weixin"></i>
|
||||
</a>
|
||||
<a class="qq share-sns" href="javascript:;" data-type="qq">
|
||||
<i class="icon icon-qq"></i>
|
||||
</a>
|
||||
<a class="douban share-sns" href="javascript:;" data-type="douban">
|
||||
<i class="icon icon-douban"></i>
|
||||
</a>
|
||||
<a class="qzone share-sns" href="javascript:;" data-type="qzone">
|
||||
<i class="icon icon-qzone"></i>
|
||||
</a>
|
||||
<a class="facebook share-sns" href="javascript:;" data-type="facebook">
|
||||
<i class="icon icon-facebook"></i>
|
||||
</a>
|
||||
<a class="twitter share-sns" href="javascript:;" data-type="twitter">
|
||||
<i class="icon icon-twitter"></i>
|
||||
</a>
|
||||
<a class="google share-sns" href="javascript:;" data-type="google">
|
||||
<i class="icon icon-google"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="page-modal wx-share js-wx-box">
|
||||
<a class="close js-modal-close" href="javascript:;"><i class="icon icon-close"></i></a>
|
||||
<p>扫一扫，分享到微信</p>
|
||||
<div class="wx-qrcode">
|
||||
<img src="<%- 'qrcode' in locals ? qrcode(sUrl) : '//pan.baidu.com/share/qrcode?url=' + sUrl %>" alt="微信分享二维码">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mask js-mask"></div>
|
||||
12
themes/yilia/layout/_partial/post/tag.ejs
Normal file
12
themes/yilia/layout/_partial/post/tag.ejs
Normal file
@ -0,0 +1,12 @@
|
||||
<% if (post.tags && post.tags.length){ %>
|
||||
<div class="article-tag tagcloud">
|
||||
<i class="icon-price-tags icon"></i>
|
||||
<ul class="article-tag-list">
|
||||
<% post.tags.forEach(function(tag, i){ %>
|
||||
<li class="article-tag-list-item">
|
||||
<a href="javascript:void(0)" class="js-tag article-tag-list-link color<%= tag.name.length % 5 + 1 %>"><%-tag.name%></a>
|
||||
</li>
|
||||
<% }) %>
|
||||
</ul>
|
||||
</div>
|
||||
<% } %>
|
||||
15
themes/yilia/layout/_partial/post/title.ejs
Normal file
15
themes/yilia/layout/_partial/post/title.ejs
Normal file
@ -0,0 +1,15 @@
|
||||
<% if (post.link){ %>
|
||||
<h1 itemprop="name">
|
||||
<a class="<%= class_name %>" href="<%- url_for(post.link) %>" target="_blank" itemprop="url"><%= post.title %></a>
|
||||
</h1>
|
||||
<% } else if (post.title){ %>
|
||||
<% if (index){ %>
|
||||
<h1 itemprop="name">
|
||||
<a class="<%= class_name %>" href="<%- url_for(post.path) %>"><%= post.title %></a>
|
||||
</h1>
|
||||
<% } else { %>
|
||||
<h1 class="<%= class_name %>" itemprop="name">
|
||||
<%= post.title %>
|
||||
</h1>
|
||||
<% } %>
|
||||
<% } %>
|
||||
10
themes/yilia/layout/_partial/post/wangyiyun.ejs
Normal file
10
themes/yilia/layout/_partial/post/wangyiyun.ejs
Normal file
@ -0,0 +1,10 @@
|
||||
<div id="cloud-tie-wrapper" class="cloud-tie-wrapper"></div>
|
||||
<script>
|
||||
var cloudTieConfig = {
|
||||
url: "<%=url%>",
|
||||
sourceId: "<%=key%>",
|
||||
productKey: "<%=theme.wangyiyun%>",
|
||||
target: "cloud-tie-wrapper"
|
||||
};
|
||||
</script>
|
||||
<script src="//img1.cache.netease.com/f2e/tie/yun/sdk/loader.js"></script>
|
||||
1
themes/yilia/layout/_partial/script.ejs
Normal file
1
themes/yilia/layout/_partial/script.ejs
Normal file
@ -0,0 +1 @@
|
||||
<%- js('js/mobile.bc3ac97a4b2208729e1e.js') %> <%- js('js/slider.aa150152ad0b4e146925.js') %> <%- js('js/main.f26f0d0b8a2e2ae348ae.js') %>
|
||||
128
themes/yilia/layout/_partial/tools.ejs
Normal file
128
themes/yilia/layout/_partial/tools.ejs
Normal file
@ -0,0 +1,128 @@
|
||||
<%
|
||||
var hasInnerArchive = theme.smart_menu.innerArchive
|
||||
var hasFriends = theme.smart_menu.friends
|
||||
var hasAboutme = theme.smart_menu.aboutme
|
||||
%>
|
||||
<div class="tools-col" :class="{show:isShow,hide:!isShow}" @click="stop">
|
||||
<div class="tools-nav header-menu">
|
||||
<%
|
||||
var count = 0
|
||||
for(let menu_name in theme.smart_menu) {
|
||||
if(theme.smart_menu[menu_name]) count++
|
||||
}
|
||||
%>
|
||||
<ul style="width:70%">
|
||||
<% var divide = 100 / count + '%' %>
|
||||
<% for (let menu_name in theme.smart_menu){ %>
|
||||
<% if(theme.smart_menu[menu_name]){ %>
|
||||
<li style="width: <%= divide %>" @click="openSlider($event, '<%-menu_name%>')"><a href="javascript:void(0)" :class="{active:<%-menu_name%>}"><%= theme.smart_menu[menu_name] %></a></li>
|
||||
<% } %>
|
||||
<% } %>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="tools-wrap">
|
||||
<%if(hasInnerArchive){%>
|
||||
<section class="tools-section tools-section-all" v-show="innerArchive">
|
||||
<div class="search-wrap">
|
||||
<input class="search-ipt" v-model="search" type="text" placeholder="文章搜索…">
|
||||
<i class="icon-search icon" v-show="!search"></i>
|
||||
<i class="icon-close icon" v-show="search" @click="clearChose"></i>
|
||||
</div>
|
||||
<div class="widget tagcloud search-tag">
|
||||
<div>
|
||||
<label class="search-tag-wording">标签:</label>
|
||||
<label class="search-switch">
|
||||
<input type="checkbox" @click="showTags=!showTags" >
|
||||
</label>
|
||||
<label class="search-tag-wording">分类:</label>
|
||||
<label class="search-switch">
|
||||
<input type="checkbox" @click="showCategories=!showCategories" >
|
||||
</label>
|
||||
</div>
|
||||
<ul class="article-tag-list" v-show="showTags">
|
||||
<% site.tags.forEach(function(tag, i){ %>
|
||||
<li class="article-tag-list-item">
|
||||
<a href="javascript:void(0)" @click="chose('<%-tag.name%>','#')" class="js-tag color<%= tag.name.length % 5 + 1 %>"><%-tag.name%></a>
|
||||
</li>
|
||||
<% }) %>
|
||||
<div class="clearfix"></div>
|
||||
</ul>
|
||||
<ul class="article-tag-list" v-show="showCategories">
|
||||
<% site.categories.forEach(function(category, i){ %>
|
||||
<li class="article-tag-list-item">
|
||||
<a href="javascript:void(0)" @click="chose('<%-category.name%>','$')" class="js-tag color<%= category.name.length % 5 + 1 %>"><%-category.name%></a>
|
||||
</li>
|
||||
<% }) %>
|
||||
<div class="clearfix"></div>
|
||||
</ul>
|
||||
</div>
|
||||
<ul class="search-ul">
|
||||
<p v-if="jsonFail" style="padding: 20px; font-size: 12px;">
|
||||
缺失模块。<br/>1、请确保node版本大于6.2<br/>2、在博客根目录（注意不是yilia根目录）执行以下命令：<br/> npm i hexo-generator-json-content --save<br/><br/>
|
||||
3、在根目录_config.yml里添加配置：
|
||||
<pre style="font-size: 12px;" v-if="jsonFail">
|
||||
jsonContent:
|
||||
meta: false
|
||||
pages: false
|
||||
posts:
|
||||
title: true
|
||||
date: true
|
||||
path: true
|
||||
text: false
|
||||
raw: false
|
||||
content: false
|
||||
slug: false
|
||||
updated: false
|
||||
comments: false
|
||||
link: false
|
||||
permalink: false
|
||||
excerpt: false
|
||||
categories: false
|
||||
tags: true
|
||||
</pre>
|
||||
</p>
|
||||
<li class="search-li" v-for="item in items" v-show="!item.isHide">
|
||||
<a :href="item.path|urlformat" class="search-title"><i class="icon-quo-left icon"></i>
|
||||
<span>{{item.title}}</span>
|
||||
</a>
|
||||
<p class="search-time">
|
||||
<i class="icon-calendar icon"></i>
|
||||
<span >{{item.date|dateformat}}</span>
|
||||
</p>
|
||||
<p class="search-category">
|
||||
<i class="icon-book icon"></i>
|
||||
<span v-for="category in item.categories" @click="chose(category.name, '$')" >{{'$'+category.name}}</span>
|
||||
</p>
|
||||
<p class="search-tag">
|
||||
<i class="icon-price-tags icon"></i>
|
||||
<span v-for="tag in item.tags" @click="chose(tag.name, '#')" >{{'#'+tag.name}}</span>
|
||||
</p>
|
||||
</li>
|
||||
</ul>
|
||||
</section>
|
||||
<%}%>
|
||||
|
||||
<%if(hasFriends){%>
|
||||
<section class="tools-section tools-section-friends" v-show="friends">
|
||||
<%if(theme.friends && theme.friends.length != 0){%>
|
||||
<ul class="search-ul">
|
||||
<% for (var i in theme.friends){ %>
|
||||
<li class="search-li">
|
||||
<a href="<%- url_for(theme.friends[i]) %>" target="_blank" class="search-title"><i class="icon-quo-left icon"></i><%= i %></a>
|
||||
</li>
|
||||
<% } %>
|
||||
</ul>
|
||||
<%}%>
|
||||
</section>
|
||||
<%}%>
|
||||
|
||||
<%if(hasAboutme){%>
|
||||
<section class="tools-section tools-section-me" v-show="aboutme">
|
||||
<%if(theme.aboutme){%>
|
||||
<div class="aboutme-wrap" id="js-aboutme"><%=theme.aboutme%></div>
|
||||
<%}%>
|
||||
</section>
|
||||
<%}%>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
66
themes/yilia/layout/_partial/viewer.ejs
Normal file
66
themes/yilia/layout/_partial/viewer.ejs
Normal file
@ -0,0 +1,66 @@
|
||||
<!-- Root element of PhotoSwipe. Must have class pswp. -->
|
||||
<div class="pswp" tabindex="-1" role="dialog" aria-hidden="true">
|
||||
|
||||
<!-- Background of PhotoSwipe.
|
||||
It's a separate element as animating opacity is faster than rgba(). -->
|
||||
<div class="pswp__bg"></div>
|
||||
|
||||
<!-- Slides wrapper with overflow:hidden. -->
|
||||
<div class="pswp__scroll-wrap">
|
||||
|
||||
<!-- Container that holds slides.
|
||||
PhotoSwipe keeps only 3 of them in the DOM to save memory.
|
||||
Don't modify these 3 pswp__item elements, data is added later on. -->
|
||||
<div class="pswp__container">
|
||||
<div class="pswp__item"></div>
|
||||
<div class="pswp__item"></div>
|
||||
<div class="pswp__item"></div>
|
||||
</div>
|
||||
|
||||
<!-- Default (PhotoSwipeUI_Default) interface on top of sliding area. Can be changed. -->
|
||||
<div class="pswp__ui pswp__ui--hidden">
|
||||
|
||||
<div class="pswp__top-bar">
|
||||
|
||||
<!-- Controls are self-explanatory. Order can be changed. -->
|
||||
|
||||
<div class="pswp__counter"></div>
|
||||
|
||||
<button class="pswp__button pswp__button--close" title="Close (Esc)"></button>
|
||||
|
||||
<button class="pswp__button pswp__button--share" style="display:none" title="Share"></button>
|
||||
|
||||
<button class="pswp__button pswp__button--fs" title="Toggle fullscreen"></button>
|
||||
|
||||
<button class="pswp__button pswp__button--zoom" title="Zoom in/out"></button>
|
||||
|
||||
<!-- Preloader demo http://codepen.io/dimsemenov/pen/yyBWoR -->
|
||||
<!-- element will get class pswp__preloader--active when preloader is running -->
|
||||
<div class="pswp__preloader">
|
||||
<div class="pswp__preloader__icn">
|
||||
<div class="pswp__preloader__cut">
|
||||
<div class="pswp__preloader__donut"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="pswp__share-modal pswp__share-modal--hidden pswp__single-tap">
|
||||
<div class="pswp__share-tooltip"></div>
|
||||
</div>
|
||||
|
||||
<button class="pswp__button pswp__button--arrow--left" title="Previous (arrow left)">
|
||||
</button>
|
||||
|
||||
<button class="pswp__button pswp__button--arrow--right" title="Next (arrow right)">
|
||||
</button>
|
||||
|
||||
<div class="pswp__caption">
|
||||
<div class="pswp__caption__center"></div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
1
themes/yilia/layout/archive.ejs
Normal file
1
themes/yilia/layout/archive.ejs
Normal file
@ -0,0 +1 @@
|
||||
<%- partial('_partial/archive', {pagination: config.archive, index: true}) %>
|
||||
1
themes/yilia/layout/category.ejs
Normal file
1
themes/yilia/layout/category.ejs
Normal file
@ -0,0 +1 @@
|
||||
<%- partial('_partial/archive', {pagination: config.category, index: true}) %>
|
||||
1
themes/yilia/layout/index.ejs
Normal file
1
themes/yilia/layout/index.ejs
Normal file
@ -0,0 +1 @@
|
||||
<%- partial('_partial/archive', {pagination: 2, index: true}) %>
|
||||
27
themes/yilia/layout/layout.ejs
Normal file
27
themes/yilia/layout/layout.ejs
Normal file
@ -0,0 +1,27 @@
|
||||
<%- partial('_partial/head') %>
|
||||
<body>
|
||||
<div id="container" :class="{show:isCtnShow}" @click="hideSlider">
|
||||
<canvas id="anm-canvas" class="anm-canvas"></canvas>
|
||||
<div class="left-col" :class="{show:isShow}">
|
||||
<%- partial('_partial/left-col', null, {cache: !config.relative_link}) %>
|
||||
</div>
|
||||
<div class="mid-col" :class="{show:isShow,hide:!isShow}">
|
||||
<%- partial('_partial/mobile-nav', null, {cache: !config.relative_link}) %>
|
||||
<div id="wrapper" class="body-wrap">
|
||||
<div class="menu-l">
|
||||
<div class="canvas-wrap">
|
||||
<canvas data-colors="#eaeaea" data-sectionHeight="100" data-contentId="js-content" id="myCanvas1" class="anm-canvas"></canvas>
|
||||
</div>
|
||||
<div id="js-content" class="content-ll">
|
||||
<%- body %>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<%- partial('_partial/footer') %>
|
||||
</div>
|
||||
<%- partial('_partial/tools') %>
|
||||
<%- partial('_partial/viewer') %>
|
||||
</div>
|
||||
<%- partial('_partial/after-footer') %>
|
||||
</body>
|
||||
</html>
|
||||
1
themes/yilia/layout/page.ejs
Normal file
1
themes/yilia/layout/page.ejs
Normal file
@ -0,0 +1 @@
|
||||
<%- partial('_partial/article', {post: page, index: false}) %>
|
||||
1
themes/yilia/layout/post.ejs
Normal file
1
themes/yilia/layout/post.ejs
Normal file
@ -0,0 +1 @@
|
||||
<%- partial('_partial/article', {post: page, index: false}) %>
|
||||
1
themes/yilia/layout/tag.ejs
Normal file
1
themes/yilia/layout/tag.ejs
Normal file
@ -0,0 +1 @@
|
||||
<%- partial('_partial/archive', {pagination: config.tag, index: true}) %>
|
||||
7869
themes/yilia/package-lock.json
generated
Normal file
7869
themes/yilia/package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
56
themes/yilia/package.json
Normal file
56
themes/yilia/package.json
Normal file
@ -0,0 +1,56 @@
|
||||
{
|
||||
"name": "yilia",
|
||||
"version": "4.0.0",
|
||||
"description": "a theme for hexo",
|
||||
"scripts": {
|
||||
"dev": "webpack",
|
||||
"dist": "webpack -p"
|
||||
},
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git+https://github.com/litten/hexo-theme-yilia.git"
|
||||
},
|
||||
"keywords": [
|
||||
"hexo",
|
||||
"theme",
|
||||
"blog"
|
||||
],
|
||||
"author": "litten",
|
||||
"license": "ISC",
|
||||
"devDependencies": {
|
||||
"autoprefixer": "^6.5.1",
|
||||
"clean-webpack-plugin": "^0.1.15",
|
||||
"cross-env": "^1.0.6",
|
||||
"css-loader": "^0.28.11",
|
||||
"dom101": "^1.3.0",
|
||||
"extract-text-webpack-plugin": "^3.0.2",
|
||||
"html-webpack-plugin": "^2.24.1",
|
||||
"node-sass": "^4.9.0",
|
||||
"postcss-loader": "^2.1.5",
|
||||
"sass-loader": "^7.0.2",
|
||||
"style-loader": "^0.21.0",
|
||||
"url-loader": "^1.0.1",
|
||||
"webpack": "^3.11.0"
|
||||
},
|
||||
"dependencies": {
|
||||
"axios": "^0.18.0",
|
||||
"babel-core": "6.24.0",
|
||||
"babel-loader": "7.1.4",
|
||||
"babel-plugin-transform-runtime": "6.23.0",
|
||||
"babel-polyfill": "^6.23.0",
|
||||
"babel-preset-es2015": "6.24.0",
|
||||
"babel-preset-react": "6.23.0",
|
||||
"babel-preset-stage-2": "6.22.0",
|
||||
"badjs-report": "^1.2.2",
|
||||
"es6-promise": "^4.0.5",
|
||||
"file-loader": "^0.9.0",
|
||||
"js-cookie": "^2.1.3",
|
||||
"photoswipe": "^4.1.1",
|
||||
"vue": "^2.5.16"
|
||||
},
|
||||
"config": {
|
||||
"commitizen": {
|
||||
"path": "cz-simple-log"
|
||||
}
|
||||
}
|
||||
}
|
||||
7
themes/yilia/postcss.config.js
Normal file
7
themes/yilia/postcss.config.js
Normal file
@ -0,0 +1,7 @@
|
||||
module.exports = {
|
||||
plugins: [
|
||||
// require('postcss-smart-import')({ /* ...options */ }),
|
||||
// require('precss')({ /* ...options */ }),
|
||||
require('autoprefixer')({ /* ...options */ })
|
||||
]
|
||||
}
|
||||
19
themes/yilia/source-src/css/_core.scss
Normal file
19
themes/yilia/source-src/css/_core.scss
Normal file
@ -0,0 +1,19 @@
|
||||
@charset "UTF-8";
|
||||
//-----------------------------------------------------
|
||||
// core scss
|
||||
// 提供所有的基础功能包括：变量设置，@media，基础mixin，animation，reset样式
|
||||
// 默认会输出reset样式一份
|
||||
//-----------------------------------------------------
|
||||
|
||||
//-----------------------------------------------------
|
||||
// author: 结一 (http://weibo.com/marvin1023)
|
||||
// version: 3.2.0
|
||||
// time: 2016-04-11
|
||||
// url: https://github.com/marvin1023/sandal/
|
||||
//-----------------------------------------------------
|
||||
|
||||
|
||||
// 导入core中的基础文件
|
||||
//-----------------------------------------------------
|
||||
@import "function";
|
||||
@import "core/reset";
|
||||
21
themes/yilia/source-src/css/_function.scss
Normal file
21
themes/yilia/source-src/css/_function.scss
Normal file
@ -0,0 +1,21 @@
|
||||
@charset "UTF-8";
|
||||
//-----------------------------------------------------
|
||||
// function scss
|
||||
// 提供所有的基础功能包括：变量设置，@media，基础mixin，animation
|
||||
// 默认不会解析出任何样式
|
||||
//-----------------------------------------------------
|
||||
|
||||
//-----------------------------------------------------
|
||||
// author: 结一 (http://weibo.com/marvin1023)
|
||||
// version: 3.2.0
|
||||
// time: 2016-04-11
|
||||
// url: https://github.com/marvin1023/sandal/
|
||||
//-----------------------------------------------------
|
||||
|
||||
|
||||
// 导入所有功能类相关文件
|
||||
//-----------------------------------------------------
|
||||
@import "core/variables";
|
||||
@import "core/media-queries";
|
||||
@import "core/mixin";
|
||||
@import "core/animation";
|
||||
139
themes/yilia/source-src/css/archive.scss
Normal file
139
themes/yilia/source-src/css/archive.scss
Normal file
@ -0,0 +1,139 @@
|
||||
.archives-wrap{
|
||||
position: relative;
|
||||
margin: 0 30px;
|
||||
padding-right: 60px;
|
||||
border-bottom: 1px solid #eee;
|
||||
background: #fff;
|
||||
&:first-child{
|
||||
margin-top: 30px;
|
||||
}
|
||||
&:last-child{
|
||||
margin-bottom: 80px;
|
||||
}
|
||||
.archive-year-wrap{
|
||||
line-height: 35px;
|
||||
width: 200px;
|
||||
position: absolute;
|
||||
padding-top: 15px;
|
||||
font-size: 1.8em;
|
||||
z-index: 1;
|
||||
}
|
||||
.archive-year-wrap a{
|
||||
color: #666;
|
||||
font-weight: bold;
|
||||
padding-left: 48px;
|
||||
}
|
||||
}
|
||||
|
||||
.archives {
|
||||
position:relative;
|
||||
.article-info{
|
||||
border: none;
|
||||
}
|
||||
.archive-article {
|
||||
margin-left:200px;
|
||||
padding:20px 0;
|
||||
border-bottom: 1px solid #eee;
|
||||
border-top: 1px solid #fff;
|
||||
position: relative;
|
||||
&:first-child{
|
||||
border-top: none;
|
||||
}
|
||||
&:last-child{
|
||||
border-bottom: none;
|
||||
}
|
||||
}
|
||||
|
||||
.archive-article-title {
|
||||
font-size: 16px;
|
||||
color: #333;
|
||||
transition: color 0.3s;
|
||||
&:hover{
|
||||
color: #657b83;
|
||||
}
|
||||
span{
|
||||
display: block;
|
||||
color: #a8a8a8;
|
||||
font-size: 12px;
|
||||
line-height: 14px;
|
||||
height: 7px;
|
||||
padding-left: 2px;
|
||||
&:before{
|
||||
display: inline-block;
|
||||
content: "“";
|
||||
font-family: serif;
|
||||
font-size: 30px;
|
||||
float: left;
|
||||
margin: 4px 4px 0 -12px;
|
||||
color: #c8c8c8;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.archive-article-inner{
|
||||
.icon-clock {
|
||||
margin-right: 5px;
|
||||
}
|
||||
.archive-article-header{
|
||||
position: relative;
|
||||
min-height: 36px;
|
||||
}
|
||||
.article-meta{
|
||||
position: relative;
|
||||
float: right;
|
||||
margin-top: -10px;
|
||||
color: #555;
|
||||
background: none;
|
||||
text-align: right;
|
||||
width: auto;
|
||||
.article-date{
|
||||
time{
|
||||
color: #aaa;
|
||||
}
|
||||
}
|
||||
.archive-article-date, .article-tag-list{
|
||||
margin-right: 30px;
|
||||
display: -moz-inline-stack;
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
zoom: 1;
|
||||
color: #666;
|
||||
font-size: 14px;
|
||||
}
|
||||
.archive-article-date{
|
||||
cursor: default;
|
||||
font-size: 12px;
|
||||
margin-bottom: 5px;
|
||||
margin-top: -10px;
|
||||
margin-right: 0;
|
||||
time{
|
||||
}
|
||||
}
|
||||
.article-category{
|
||||
&:before{
|
||||
float: left;
|
||||
margin-top: 1px;
|
||||
left: 15px;
|
||||
}
|
||||
.article-category-link{
|
||||
width: auto;
|
||||
max-width: 83px;
|
||||
padding-left: 10px;
|
||||
}
|
||||
}
|
||||
.article-tag-list{
|
||||
margin-top: 0px;
|
||||
&:before{
|
||||
left: 15px;
|
||||
}
|
||||
.article-tag-list-item{
|
||||
display: inline-block;
|
||||
width: auto;
|
||||
max-width: 83px;
|
||||
padding-left: 8px;
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
227
themes/yilia/source-src/css/article-inner.scss
Normal file
227
themes/yilia/source-src/css/article-inner.scss
Normal file
@ -0,0 +1,227 @@
|
||||
.article-inner {
|
||||
p {
|
||||
margin: 0 0 1.75em;
|
||||
}
|
||||
}
|
||||
|
||||
.article-inner {
|
||||
border-color: #d1d1d1;
|
||||
}
|
||||
|
||||
.article-inner h1 {
|
||||
font-size: 28px;
|
||||
font-size: 1.75rem;
|
||||
line-height: 1.25;
|
||||
margin-top: 2em;
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
|
||||
.article-inner h2 {
|
||||
font-size: 23px;
|
||||
font-size: 1.4375rem;
|
||||
line-height: 1.2173913043;
|
||||
margin-top: 2.4347826087em;
|
||||
margin-bottom: 1.2173913043em;
|
||||
}
|
||||
|
||||
.article-inner h3 {
|
||||
font-size: 19px;
|
||||
font-size: 1.1875rem;
|
||||
line-height: 1.1052631579;
|
||||
margin-top: 2.9473684211em;
|
||||
margin-bottom: 1.4736842105em;
|
||||
}
|
||||
|
||||
.article-inner h4,
|
||||
.article-inner h5,
|
||||
.article-inner h6 {
|
||||
font-size: 16px;
|
||||
font-size: 1rem;
|
||||
line-height: 1.3125;
|
||||
margin-top: 3.5em;
|
||||
margin-bottom: 1.75em;
|
||||
}
|
||||
|
||||
.article-inner h4 {
|
||||
letter-spacing: 0.140625em;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.article-inner h6 {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.article-inner h1,
|
||||
.article-inner h2,
|
||||
.article-inner h3,
|
||||
.article-inner h4,
|
||||
.article-inner h5,
|
||||
.article-inner h6 {
|
||||
font-weight: 900;
|
||||
}
|
||||
|
||||
.article-inner h1:first-child,
|
||||
.article-inner h2:first-child,
|
||||
.article-inner h3:first-child,
|
||||
.article-inner h4:first-child,
|
||||
.article-inner h5:first-child,
|
||||
.article-inner h6:first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.article-inner h1:first-child{
|
||||
margin-bottom: 10px;
|
||||
display: inline;
|
||||
}
|
||||
.article-entry{
|
||||
line-height: 1.8em;
|
||||
padding-right: 7.6923%;
|
||||
padding-left: 7.6923%;
|
||||
p{
|
||||
margin-top: 10px;
|
||||
}
|
||||
p code,li code{
|
||||
padding: 1px 3px;
|
||||
margin: 0 3px;
|
||||
background: #ddd;
|
||||
border: 1px solid #ccc;
|
||||
font-family: Menlo,Monaco,"Andale Mono","lucida console","Courier New",monospace;
|
||||
word-wrap: break-word;
|
||||
font-size: 14px;
|
||||
}
|
||||
blockquote {
|
||||
background: #ddd;
|
||||
border-left: 5px solid #ccc;
|
||||
padding: 15px 20px;
|
||||
margin-top: 10px;
|
||||
border-left: 5px solid #657b83;
|
||||
background: #f6f6f6;
|
||||
p{
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
em {
|
||||
font-style: italic;
|
||||
}
|
||||
ul {
|
||||
li:before{
|
||||
content: "";
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border: 1px solid #999;
|
||||
border-radius: 10px;
|
||||
background: #aaa;
|
||||
display: inline-block;
|
||||
margin-right: 10px;
|
||||
float: left;
|
||||
margin-top: 10px;
|
||||
}
|
||||
}
|
||||
ol {
|
||||
counter-reset: item;
|
||||
li:before{
|
||||
counter-increment: item;
|
||||
content: counter(item)".";
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
ul,ol{
|
||||
font-size: 14px;
|
||||
margin: 10px 0px;
|
||||
}
|
||||
li{
|
||||
ul,ol{
|
||||
margin-left: 30px;
|
||||
li:before{
|
||||
content: "";
|
||||
background: #dedede;
|
||||
}
|
||||
}
|
||||
}
|
||||
h1{
|
||||
margin-top: 30px;
|
||||
}
|
||||
h2{
|
||||
margin-top: 20px;
|
||||
font-weight: bold;
|
||||
color: #574C4C;
|
||||
padding-bottom: 5px;
|
||||
border-bottom: 1px solid #ddd;
|
||||
}
|
||||
h3,h4,h5,h6{
|
||||
margin-top: 20px;
|
||||
font-weight: bold;
|
||||
color: #574C4C;
|
||||
padding-bottom: 5px;
|
||||
border-bottom: 1px solid #ddd;
|
||||
}
|
||||
video{
|
||||
max-width: 100%;
|
||||
}
|
||||
strong {
|
||||
font-weight: bold;
|
||||
}
|
||||
.caption{
|
||||
display: block;
|
||||
font-size: 0.8em;
|
||||
color: #aaa;
|
||||
}
|
||||
hr{
|
||||
height: 0;
|
||||
margin-top: 20px;
|
||||
margin-bottom: 20px;
|
||||
border-left: 0;
|
||||
border-right: 0;
|
||||
border-top: 1px solid #DDD;
|
||||
border-bottom: 1px solid #FFF;
|
||||
}
|
||||
pre {
|
||||
line-height: 1.5;
|
||||
margin-top: 10px;
|
||||
padding: 5px 15px;
|
||||
overflow-x: auto;
|
||||
color: #657b83;
|
||||
border: 1px solid #ccc;
|
||||
text-shadow: 0 1px #444;
|
||||
font-family: Menlo,Monaco,"Andale Mono","lucida console","Courier New",monospace;
|
||||
code{
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
table{
|
||||
width:100%;
|
||||
border: 1px solid #dedede;
|
||||
margin: 15px 0;
|
||||
border-collapse:collapse;
|
||||
tr,td{
|
||||
height:35px;
|
||||
}
|
||||
thead{
|
||||
tr {
|
||||
background: #f8f8f8;
|
||||
}
|
||||
}
|
||||
tbody{
|
||||
tr:hover{
|
||||
background: #efefef;
|
||||
}
|
||||
}
|
||||
td,th{
|
||||
border: 1px solid #dedede;
|
||||
padding: 0 10px;
|
||||
}
|
||||
}
|
||||
figure{
|
||||
table {
|
||||
border: none;
|
||||
width: auto;
|
||||
margin: 0;
|
||||
tbody{
|
||||
tr:hover{
|
||||
background: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
152
themes/yilia/source-src/css/article-main.scss
Normal file
152
themes/yilia/source-src/css/article-main.scss
Normal file
@ -0,0 +1,152 @@
|
||||
.body-wrap > article {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
@-webkit-keyframes cd-bounce-1 {
|
||||
0% {
|
||||
opacity: 0;
|
||||
-webkit-transform: scale(1);
|
||||
}
|
||||
60% {
|
||||
opacity: 1;
|
||||
-webkit-transform: scale(1.01);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: scale(1);
|
||||
}
|
||||
}
|
||||
@-moz-keyframes cd-bounce-1 {
|
||||
0% {
|
||||
opacity: 0;
|
||||
-moz-transform: scale(1);
|
||||
}
|
||||
60% {
|
||||
opacity: 1;
|
||||
-moz-transform: scale(1.01);
|
||||
}
|
||||
100% {
|
||||
-moz-transform: scale(1);
|
||||
}
|
||||
}
|
||||
@keyframes cd-bounce-1 {
|
||||
0% {
|
||||
opacity: 0;
|
||||
-webkit-transform: scale(1);
|
||||
-moz-transform: scale(1);
|
||||
-ms-transform: scale(1);
|
||||
-o-transform: scale(1);
|
||||
transform: scale(1);
|
||||
}
|
||||
60% {
|
||||
opacity: 1;
|
||||
-webkit-transform: scale(1.01);
|
||||
-moz-transform: scale(1.01);
|
||||
-ms-transform: scale(1.01);
|
||||
-o-transform: scale(1.01);
|
||||
transform: scale(1.01);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: scale(1);
|
||||
-moz-transform: scale(1);
|
||||
-ms-transform: scale(1);
|
||||
-o-transform: scale(1);
|
||||
transform: scale(1);
|
||||
}
|
||||
}
|
||||
|
||||
.article {
|
||||
margin: 30px;
|
||||
position: relative;
|
||||
border: 1px solid #ddd;
|
||||
border-top: 1px solid #fff;
|
||||
border-bottom: 1px solid #fff;
|
||||
background: #fff;
|
||||
transition: all 0.2s ease-in;
|
||||
/* &.show{
|
||||
visibility: visible;
|
||||
-webkit-animation: cd-bounce-1 0.6s;
|
||||
-moz-animation: cd-bounce-1 0.6s;
|
||||
animation: cd-bounce-1 0.6s;
|
||||
}
|
||||
&.hidden{
|
||||
visibility: hidden;
|
||||
} */
|
||||
img{
|
||||
max-width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.article-inner h1.article-title, .article-title {
|
||||
color: #696969;
|
||||
margin-left: 0px;
|
||||
font-weight: 300;
|
||||
line-height: 35px;
|
||||
margin-bottom: 20px;
|
||||
font-size: 26px;
|
||||
-webkit-transition: color 0.3s;
|
||||
-moz-transition: color 0.3s;
|
||||
-o-transition: color 0.3s;
|
||||
transition: color 0.3s;
|
||||
}
|
||||
|
||||
.article-header{
|
||||
border-left: 5px solid #4d4d4d;
|
||||
padding: 30px 0px 15px 25px;
|
||||
padding-left: 7.6923%;
|
||||
}
|
||||
|
||||
.article-meta{
|
||||
width: 150px;
|
||||
font-size: 14;
|
||||
text-align: right;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 23px;
|
||||
text-align: center;
|
||||
z-index: 1;
|
||||
time{
|
||||
color: #aaa;
|
||||
.icon-clock {
|
||||
margin-right: 8px;
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.article-more-link{
|
||||
margin-top: 0;
|
||||
text-align: left;
|
||||
float: right;
|
||||
a{
|
||||
background: #4d4d4d;
|
||||
color: #fff;
|
||||
font-size: 12px;
|
||||
padding: 5px 8px 5px;
|
||||
line-height: 16px;
|
||||
-webkit-border-radius: 2px;
|
||||
-moz-border-radius: 2px;
|
||||
border-radius: 2px;
|
||||
transition: background 0.3s;
|
||||
&:hover{
|
||||
background: #3c3c3c;
|
||||
}
|
||||
&.hidden{
|
||||
visibility: hidden;
|
||||
}
|
||||
}
|
||||
}
|
||||
.article-info.info-on-right{
|
||||
margin: 10px 0 0 0;
|
||||
float: right;
|
||||
}
|
||||
.article-info-index.article-info{
|
||||
padding-top: 20px;
|
||||
margin: 30px $articlePadding 0 $articlePadding;
|
||||
min-height: 72px;
|
||||
border-top: 1px solid #ddd;
|
||||
}
|
||||
.article-info-post.article-info{
|
||||
padding: 0;
|
||||
border: none;
|
||||
margin: -30px 0 20px $articlePadding;
|
||||
}
|
||||
22
themes/yilia/source-src/css/article-nav.scss
Normal file
22
themes/yilia/source-src/css/article-nav.scss
Normal file
@ -0,0 +1,22 @@
|
||||
#article-nav {
|
||||
margin: 0 0 20px 0;
|
||||
padding: 0 32px 10px;
|
||||
min-height: 30px;
|
||||
}
|
||||
#article-nav .article-nav-link-wrap {
|
||||
font-size: 14px;
|
||||
}
|
||||
#article-nav .article-nav-link-wrap .article-nav-title {
|
||||
display: inline-block;
|
||||
font-size: 16px;
|
||||
transition: color 0.3s;
|
||||
}
|
||||
#article-nav .article-nav-link-wrap:hover i {
|
||||
color: #4d4d4d;
|
||||
}
|
||||
#article-nav .article-nav-link-wrap:hover .article-nav-title {
|
||||
color: #4d4d4d;
|
||||
}
|
||||
#article-nav #article-nav-older {
|
||||
float: right;
|
||||
}
|
||||
330
themes/yilia/source-src/css/article.scss
Normal file
330
themes/yilia/source-src/css/article.scss
Normal file
@ -0,0 +1,330 @@
|
||||
.body-wrap{
|
||||
margin-bottom: 80px;
|
||||
}
|
||||
.article {
|
||||
margin: 30px;
|
||||
position: relative;
|
||||
background: #fff;
|
||||
-webkit-transition: all 0.2s ease-in;
|
||||
&.show{
|
||||
visibility: visible;
|
||||
-webkit-animation: cd-bounce-1 0.6s;
|
||||
-moz-animation: cd-bounce-1 0.6s;
|
||||
animation: cd-bounce-1 0.6s;
|
||||
}
|
||||
&.hidden{
|
||||
visibility: hidden;
|
||||
}
|
||||
img{
|
||||
max-width: 100%;
|
||||
}
|
||||
}
|
||||
@-webkit-keyframes cd-bounce-1 {
|
||||
0% {
|
||||
opacity: 0;
|
||||
-webkit-transform: scale(1);
|
||||
}
|
||||
60% {
|
||||
opacity: 1;
|
||||
-webkit-transform: scale(1.01);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: scale(1);
|
||||
}
|
||||
}
|
||||
@-moz-keyframes cd-bounce-1 {
|
||||
0% {
|
||||
opacity: 0;
|
||||
-moz-transform: scale(1);
|
||||
}
|
||||
60% {
|
||||
opacity: 1;
|
||||
-moz-transform: scale(1.01);
|
||||
}
|
||||
100% {
|
||||
-moz-transform: scale(1);
|
||||
}
|
||||
}
|
||||
@keyframes cd-bounce-1 {
|
||||
0% {
|
||||
opacity: 0;
|
||||
-webkit-transform: scale(1);
|
||||
-moz-transform: scale(1);
|
||||
-ms-transform: scale(1);
|
||||
-o-transform: scale(1);
|
||||
transform: scale(1);
|
||||
}
|
||||
60% {
|
||||
opacity: 1;
|
||||
-webkit-transform: scale(1.01);
|
||||
-moz-transform: scale(1.01);
|
||||
-ms-transform: scale(1.01);
|
||||
-o-transform: scale(1.01);
|
||||
transform: scale(1.01);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: scale(1);
|
||||
-moz-transform: scale(1);
|
||||
-ms-transform: scale(1);
|
||||
-o-transform: scale(1);
|
||||
transform: scale(1);
|
||||
}
|
||||
}
|
||||
.article-index{
|
||||
margin-left: 200px;
|
||||
padding: 15px 0;
|
||||
margin-right: 75px;
|
||||
.brief{
|
||||
display: block;
|
||||
color: #a8a8a8;
|
||||
font-size: 12px;
|
||||
line-height: 14px;
|
||||
height: 7px;
|
||||
padding-left: 2px;
|
||||
&:before{
|
||||
display: inline-block;
|
||||
content: "“";
|
||||
font-family: serif;
|
||||
font-size: 30px;
|
||||
float: left;
|
||||
margin: 4px 4px 0 -12px;
|
||||
color: #c8c8c8;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.article-title {
|
||||
color: #696969;
|
||||
margin-left: 0px;
|
||||
font-weight: 300;
|
||||
line-height: 35px;
|
||||
margin-bottom: 20px;
|
||||
font-size: 26px;
|
||||
-webkit-transition: color 0.3s;
|
||||
-moz-transition: color 0.3s;
|
||||
-o-transition: color 0.3s;
|
||||
transition: color 0.3s;
|
||||
&:hover{
|
||||
color: #B0A0AA;
|
||||
}
|
||||
}
|
||||
|
||||
.article-inner{
|
||||
position: relative;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.article-header{
|
||||
border-left: 5px solid #4d4d4d;
|
||||
padding: 15px 0px 15px 25px;
|
||||
}
|
||||
|
||||
.article-info.info-on-right{
|
||||
margin: 10px 0 0 0;
|
||||
float: right;
|
||||
}
|
||||
.article-info-index.article-info{
|
||||
padding-top: 20px;
|
||||
margin: 30px 30px 0 30px;
|
||||
border-top: 1px solid #ddd;
|
||||
}
|
||||
.article-info-post.article-info{
|
||||
padding: 0;
|
||||
border: none;
|
||||
margin: -30px 0 20px 30px;
|
||||
}
|
||||
.article-entry{
|
||||
line-height: 1.8em;
|
||||
padding-right: 30px;
|
||||
padding-left: 30px;
|
||||
p{
|
||||
margin-top: 10px;
|
||||
}
|
||||
p code,li code{
|
||||
padding: 1px 3px;
|
||||
margin: 0 3px;
|
||||
background: #ddd;
|
||||
border: 1px solid #ccc;
|
||||
font-family: Menlo,Monaco,"Andale Mono","lucida console","Courier New",monospace;
|
||||
word-wrap: break-word;
|
||||
font-size: 14px;
|
||||
}
|
||||
blockquote {
|
||||
background: #ddd;
|
||||
border-left: 5px solid #ccc;
|
||||
padding: 15px 20px;
|
||||
margin-top: 10px;
|
||||
border-left: 5px solid #657b83;
|
||||
background: #f6f6f6;
|
||||
p{
|
||||
margin-top: 0;
|
||||
}
|
||||
}
|
||||
em {
|
||||
font-style: italic;
|
||||
}
|
||||
ul{
|
||||
li:before{
|
||||
content: "";
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border: 1px solid #999;
|
||||
border-radius: 10px;
|
||||
background: #aaa;
|
||||
display: inline-block;
|
||||
margin-right: 10px;
|
||||
float: left;
|
||||
margin-top: 12px;
|
||||
}
|
||||
}
|
||||
ul,ol{
|
||||
font-size: 14px;
|
||||
margin: 10px 0px;
|
||||
}
|
||||
li{
|
||||
ul,ol{
|
||||
margin-left: 30px;
|
||||
li:before{
|
||||
content: "";
|
||||
background: #dedede;
|
||||
}
|
||||
}
|
||||
}
|
||||
h1{
|
||||
margin-top: 30px;
|
||||
}
|
||||
h2{
|
||||
margin-top: 20px;
|
||||
font-weight: 300;
|
||||
color: #574C4C;
|
||||
padding-bottom: 5px;
|
||||
border-bottom: 1px solid #ddd;
|
||||
}
|
||||
h3,h4,h5,h6{
|
||||
margin-top: 20px;
|
||||
font-weight: 300;
|
||||
color: #574C4C;
|
||||
padding-bottom: 5px;
|
||||
border-bottom: 1px solid #ddd;
|
||||
}
|
||||
video{
|
||||
max-width: 100%;
|
||||
}
|
||||
strong {
|
||||
font-weight: bold;
|
||||
}
|
||||
.caption{
|
||||
display: block;
|
||||
font-size: 0.8em;
|
||||
color: #aaa;
|
||||
}
|
||||
hr{
|
||||
height: 0;
|
||||
margin-top: 20px;
|
||||
margin-bottom: 20px;
|
||||
border-left: 0;
|
||||
border-right: 0;
|
||||
border-top: 1px solid #DDD;
|
||||
border-bottom: 1px solid #FFF;
|
||||
}
|
||||
pre {
|
||||
font-size: 1 / 0.9em;
|
||||
line-height: 1.5;
|
||||
margin-top: 10px;
|
||||
padding: 5px 15px;
|
||||
overflow-x: auto;
|
||||
color: #657b83;
|
||||
font-size: 10px;
|
||||
border: 1px solid #ccc;
|
||||
text-shadow: 0 1px #444;
|
||||
font-family: Menlo,Monaco,"Andale Mono","lucida console","Courier New",monospace;
|
||||
code{
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
table{
|
||||
width:100%;
|
||||
border: 1px solid #dedede;
|
||||
margin: 15px 0;
|
||||
border-collapse:collapse;
|
||||
tr,td{
|
||||
height:35px;
|
||||
}
|
||||
thead{
|
||||
tr {
|
||||
background: #f8f8f8;
|
||||
}
|
||||
}
|
||||
tbody{
|
||||
tr:hover{
|
||||
background: #efefef;
|
||||
}
|
||||
}
|
||||
td,th{
|
||||
border: 1px solid #dedede;
|
||||
padding: 0 10px;
|
||||
}
|
||||
}
|
||||
figure{
|
||||
table {
|
||||
border: none;
|
||||
width: auto;
|
||||
margin: 0;
|
||||
tbody{
|
||||
tr:hover{
|
||||
background: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.article-meta{
|
||||
width: 150px;
|
||||
font-size: 14;
|
||||
text-align: right;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 23px;
|
||||
text-align: center;
|
||||
z-index: 1;
|
||||
time{
|
||||
color: #aaa;
|
||||
}
|
||||
}
|
||||
|
||||
#article-nav{
|
||||
margin: 80px 0 30px 0;
|
||||
padding-bottom: 10px;
|
||||
.article-nav-link-wrap{
|
||||
margin: 0px 30px 0px 30px;
|
||||
font-size: 14px;
|
||||
color: #333;
|
||||
.article-nav-title{
|
||||
display: inline-block;
|
||||
font-size: 12px;
|
||||
color: #aaa;
|
||||
transition: color 0.3s;
|
||||
}
|
||||
strong{
|
||||
background: #ddd;
|
||||
color: #fff;
|
||||
border-radius: 100%;
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
display: inline-block;
|
||||
text-align: center;
|
||||
transition: background 0.3s;
|
||||
}
|
||||
&:hover{
|
||||
strong{
|
||||
background: #4d4d4d;
|
||||
}
|
||||
.article-nav-title{
|
||||
color: #4d4d4d;
|
||||
}
|
||||
}
|
||||
}
|
||||
#article-nav-older{
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
123
themes/yilia/source-src/css/aside.scss
Normal file
123
themes/yilia/source-src/css/aside.scss
Normal file
@ -0,0 +1,123 @@
|
||||
.wrap-side-operation {
|
||||
position: fixed;
|
||||
right: 40px;
|
||||
bottom: 50px;
|
||||
z-index: 999;
|
||||
font-size: 14px;
|
||||
.icon-plane {
|
||||
color: #fff;
|
||||
text-shadow: 1px 1px 1px #509eb7;
|
||||
opacity: 0.7;
|
||||
font-size: 52px;
|
||||
line-height: 40px;
|
||||
width: 40px;
|
||||
text-align: center;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
.mod-side-operation {
|
||||
width: 40px;
|
||||
text-align: center;
|
||||
}
|
||||
.jump-container {
|
||||
&:hover {
|
||||
.icon-back {
|
||||
background: rgba(36, 193, 246, 0.9);
|
||||
}
|
||||
}
|
||||
}
|
||||
.jump-container, .toc-container {
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
opacity: .8;
|
||||
}
|
||||
.jump-plan-container {
|
||||
position: absolute;
|
||||
top: -11px;
|
||||
left: -4px;
|
||||
width: 50px;
|
||||
height: 61px;
|
||||
overflow: hidden;
|
||||
.jump-plane {
|
||||
display: block;
|
||||
position: absolute;
|
||||
width: 42px;
|
||||
height: 66px;
|
||||
transform: translateY(68px);
|
||||
left: -2px;
|
||||
}
|
||||
}
|
||||
.mod-side-operation__jump-to-top {
|
||||
.icon-back {
|
||||
transition: 0.3s;
|
||||
color: #fff;
|
||||
background: #ccc;
|
||||
transform: rotate(90deg);
|
||||
font-size: 32px;
|
||||
line-height: 40px;
|
||||
width: 40px;
|
||||
text-align: center;
|
||||
display: block;
|
||||
&:hover {
|
||||
background: #24c1f6;
|
||||
color: #24c1f6;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.toc-container.tooltip-left{
|
||||
background: #ccc;
|
||||
margin-top: 10px;
|
||||
transition: 0.3s;
|
||||
&:hover {
|
||||
background: rgba(36, 193, 246, 0.9);
|
||||
}
|
||||
.icon-font {
|
||||
font-size: 22px;
|
||||
line-height: 40px;
|
||||
color: #fff;
|
||||
}
|
||||
.tooltip {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
.tooltip-east .tooltip-content {
|
||||
min-height: 100px;
|
||||
text-align: left;
|
||||
padding: 5px 0 5px 20px;
|
||||
right: 4.7em;
|
||||
min-width: 200px;
|
||||
width: initial;
|
||||
font-size: 14px;
|
||||
text-shadow: 1px 1px 1px #398199;
|
||||
bottom: -10px;
|
||||
transform-origin: 100% 100%;
|
||||
transform: translate3d(0, -10px, 0) rotate3d(1, 1, 1, -30deg);
|
||||
a {
|
||||
color: #fff;
|
||||
}
|
||||
&::after {
|
||||
top: initial;
|
||||
bottom: 23px;
|
||||
}
|
||||
.toc-article {
|
||||
max-height: 500px;
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
}
|
||||
.toc-article li ol, .toc-article li ul {
|
||||
margin-left: 30px;
|
||||
}
|
||||
.toc-article li {
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
.tooltip:hover .tooltip-content {
|
||||
bottom: -10px;
|
||||
transform: translate(0);
|
||||
}
|
||||
}
|
||||
10
themes/yilia/source-src/css/comment.scss
Normal file
10
themes/yilia/source-src/css/comment.scss
Normal file
@ -0,0 +1,10 @@
|
||||
#disqus_thread, .duoshuo, .cloud-tie-wrapper, #SOHUCS, #gitment-ctn {
|
||||
padding: 0 30px !important;
|
||||
min-height: 20px;
|
||||
}
|
||||
|
||||
#SOHUCS {
|
||||
#SOHU_MAIN .module-cmt-list .block-cont-gw {
|
||||
border-bottom: 1px dashed #c8c8c8 !important;
|
||||
}
|
||||
}
|
||||
378
themes/yilia/source-src/css/core/_animation.scss
Normal file
378
themes/yilia/source-src/css/core/_animation.scss
Normal file
@ -0,0 +1,378 @@
|
||||
@charset "UTF-8";
|
||||
|
||||
//-----------------------------------------------------
|
||||
// animate.scss
|
||||
// 提供6组动画 fade-in/out, shrink-in/out, up-in/out, down-in/out, left-in/out, right-in/out
|
||||
//-----------------------------------------------------
|
||||
|
||||
%animation-basic {
|
||||
animation-duration: 0.3s;
|
||||
animation-fill-mode: both;
|
||||
}
|
||||
|
||||
// fade in/out
|
||||
//-----------------------------------------------------
|
||||
|
||||
@mixin animation-fade-in($className: fade, $from: 0) {
|
||||
$name: str-insert(In, $className, 0);
|
||||
|
||||
.#{$className}-in {
|
||||
animation-name: $name;
|
||||
@extend %animation-basic;
|
||||
}
|
||||
@include animation-fade($name: $name, $from: $from);
|
||||
}
|
||||
|
||||
@mixin animation-fade-out($className: fade, $to: 0) {
|
||||
$name: str-insert(Out, $className, 0);
|
||||
|
||||
.#{$className}-out {
|
||||
animation-name: $name;
|
||||
@extend %animation-basic;
|
||||
}
|
||||
|
||||
@include animation-fade($name: $name, $from: 1, $to: $to);
|
||||
}
|
||||
|
||||
// shrink in/out
|
||||
//-----------------------------------------------------
|
||||
|
||||
@mixin animation-shrink-in($className: shrink, $from: 0.815) {
|
||||
$name: str-insert(In, $className, 0);
|
||||
|
||||
.#{$className}-in {
|
||||
animation-name: $name;
|
||||
@extend %animation-basic;
|
||||
}
|
||||
@keyframes #{$name} {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: scale($from);
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: scale(1);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@mixin animation-shrink-out($className: shrink, $to: 1.185) {
|
||||
$name: str-insert(Out, $className, 0);
|
||||
|
||||
.#{$className}-out {
|
||||
animation-name: $name;
|
||||
@extend %animation-basic;
|
||||
}
|
||||
|
||||
@keyframes #{$name} {
|
||||
0% {
|
||||
opacity: 1;
|
||||
transform: scale(1);
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
transform: scale($to);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// down in/out
|
||||
//-----------------------------------------------------
|
||||
|
||||
@mixin animation-down-in($className: down, $value: 100%) {
|
||||
$name: str-insert(In, $className, 0);
|
||||
|
||||
.#{$className}-in {
|
||||
animation-name: $name;
|
||||
@extend %animation-basic;
|
||||
}
|
||||
|
||||
@keyframes #{$name} {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: translate(0, $value);
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: translate(0, 0);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@mixin animation-down-out($className: down, $value: 100%) {
|
||||
$name: str-insert(Out, $className, 0);
|
||||
|
||||
.#{$className}-out {
|
||||
animation-name: $name;
|
||||
@extend %animation-basic;
|
||||
}
|
||||
|
||||
@keyframes #{$name} {
|
||||
0% {
|
||||
opacity: 1;
|
||||
transform: translate(0, 0);
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
transform: translate(0, $value);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// up in/out
|
||||
//-----------------------------------------------------
|
||||
|
||||
@mixin animation-up-in($className: up, $value: -100%) {
|
||||
$name: str-insert(In, $className, 0);
|
||||
|
||||
.#{$className}-in {
|
||||
animation-name: $name;
|
||||
@extend %animation-basic;
|
||||
}
|
||||
|
||||
@keyframes #{$name} {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: translate(0, $value);
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: translate(0, 0);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@mixin animation-up-out($className: up, $value: -100%) {
|
||||
$name: str-insert(Out, $className, 0);
|
||||
|
||||
.#{$className}-out {
|
||||
animation-name: $name;
|
||||
@extend %animation-basic;
|
||||
}
|
||||
|
||||
@keyframes #{$name} {
|
||||
0% {
|
||||
opacity: 1;
|
||||
transform: translate(0, 0);
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
transform: translate(0, $value);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// left in/out
|
||||
//-----------------------------------------------------
|
||||
|
||||
@mixin animation-left-in($className: left, $value: -100%) {
|
||||
$name: str-insert(In, $className, 0);
|
||||
|
||||
.#{$className}-in {
|
||||
animation-name: $name;
|
||||
@extend %animation-basic;
|
||||
}
|
||||
|
||||
@keyframes #{$name} {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: translate($value, 0);
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: translate(0, 0);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@mixin animation-left-out($className: left, $value: -100%) {
|
||||
$name: str-insert(Out, $className, 0);
|
||||
|
||||
.#{$className}-out {
|
||||
animation-name: $name;
|
||||
@extend %animation-basic;
|
||||
}
|
||||
|
||||
@keyframes #{$name} {
|
||||
0% {
|
||||
opacity: 1;
|
||||
transform: translate(0, 0);
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
transform: translate($value, 0);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// right in/out
|
||||
//-----------------------------------------------------
|
||||
|
||||
@mixin animation-right-in($className: right, $value: 100%) {
|
||||
$name: str-insert(In, $className, 0);
|
||||
|
||||
.#{$className}-in {
|
||||
animation-name: $name;
|
||||
@extend %animation-basic;
|
||||
}
|
||||
|
||||
@keyframes #{$name} {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: translate($value, 0);
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: translate(0, 0);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@mixin animation-right-out($className: right, $value: 100%) {
|
||||
$name: str-insert(Out, $className, 0);
|
||||
|
||||
.#{$className}-out {
|
||||
animation-name: $name;
|
||||
@extend %animation-basic;
|
||||
}
|
||||
|
||||
@keyframes #{$name} {
|
||||
0% {
|
||||
opacity: 1;
|
||||
transform: translate(0, 0);
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
transform: translate($value, 0);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/*弹性动画*/
|
||||
@keyframes leftIn {
|
||||
from, 60%, 75%, 90%, to {
|
||||
animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
|
||||
}
|
||||
|
||||
0% {
|
||||
transform: translate3d(0, 0, 0);
|
||||
}
|
||||
|
||||
60% {
|
||||
transform: translate3d(358px, 0, 0);
|
||||
}
|
||||
|
||||
75% {
|
||||
transform: translate3d(323px, 0, 0);
|
||||
}
|
||||
|
||||
90% {
|
||||
transform: translate3d(338px, 0, 0);
|
||||
}
|
||||
|
||||
to {
|
||||
transform: translate3d(333px, 0, 0);
|
||||
}
|
||||
}
|
||||
|
||||
%anmLeftIn {
|
||||
animation-duration: .8s;
|
||||
animation-fill-mode: both;
|
||||
animation-name: leftIn;
|
||||
}
|
||||
|
||||
@keyframes leftOut {
|
||||
from, 60%, 75%, 90%, to {
|
||||
animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
|
||||
}
|
||||
|
||||
0% {
|
||||
transform: translate3d(333px, 0, 0);
|
||||
}
|
||||
|
||||
60% {
|
||||
transform: translate3d(-25px, 0, 0);
|
||||
}
|
||||
|
||||
75% {
|
||||
transform: translate3d(10px, 0, 0);
|
||||
}
|
||||
|
||||
90% {
|
||||
transform: translate3d(-5px, 0, 0);
|
||||
}
|
||||
|
||||
to {
|
||||
transform: translate3d(0, 0, 0);
|
||||
}
|
||||
}
|
||||
|
||||
%anmLeftOut {
|
||||
animation-duration: .8s;
|
||||
animation-name: leftOut;
|
||||
}
|
||||
|
||||
@keyframes smallLeftIn {
|
||||
from, 60%, 75%, 90%, to {
|
||||
animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
|
||||
}
|
||||
|
||||
0% {
|
||||
transform: translate3d(0, 0, 0);
|
||||
}
|
||||
|
||||
60% {
|
||||
transform: translate3d(325px, 0, 0);
|
||||
}
|
||||
|
||||
75% {
|
||||
transform: translate3d(290px, 0, 0);
|
||||
}
|
||||
|
||||
90% {
|
||||
transform: translate3d(305px, 0, 0);
|
||||
}
|
||||
|
||||
to {
|
||||
transform: translate3d(300px, 0, 0);
|
||||
}
|
||||
}
|
||||
|
||||
%anmSmallLeftIn {
|
||||
animation-duration: .8s;
|
||||
animation-fill-mode: both;
|
||||
animation-name: smallLeftIn;
|
||||
}
|
||||
|
||||
@keyframes smallleftOut {
|
||||
from, 60%, 75%, 90%, to {
|
||||
animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
|
||||
}
|
||||
|
||||
0% {
|
||||
transform: translate3d(333px, 0, 0);
|
||||
}
|
||||
|
||||
60% {
|
||||
transform: translate3d(-25px, 0, 0);
|
||||
}
|
||||
|
||||
75% {
|
||||
transform: translate3d(10px, 0, 0);
|
||||
}
|
||||
|
||||
90% {
|
||||
transform: translate3d(-5px, 0, 0);
|
||||
}
|
||||
|
||||
to {
|
||||
transform: translate3d(0, 0, 0);
|
||||
}
|
||||
}
|
||||
|
||||
%anmSmallLeftOut {
|
||||
animation-duration: .8s;
|
||||
animation-fill-mode: both;
|
||||
animation-name: smallleftOut;
|
||||
}
|
||||
247
themes/yilia/source-src/css/core/_media-queries.scss
Normal file
247
themes/yilia/source-src/css/core/_media-queries.scss
Normal file
@ -0,0 +1,247 @@
|
||||
@charset "utf-8";
|
||||
|
||||
//-----------------------------------------------------
|
||||
// media queries scss
|
||||
// author: Rafal Bromirski
|
||||
// github: http://github.com/paranoida/sass-mediaqueries
|
||||
// version: 1.6.1
|
||||
//-----------------------------------------------------
|
||||
|
||||
|
||||
// generator
|
||||
// ----------------------------------------------------
|
||||
|
||||
@mixin mq($args...) {
|
||||
$media-type: 'only screen';
|
||||
$media-type-key: 'media-type';
|
||||
$args: keywords($args);
|
||||
$expr: '';
|
||||
|
||||
@if map-has-key($args, $media-type-key) {
|
||||
$media-type: map-get($args, $media-type-key);
|
||||
$args: map-remove($args, $media-type-key);
|
||||
}
|
||||
|
||||
@each $key, $value in $args {
|
||||
@if $value {
|
||||
$expr: "#{$expr} and (#{$key}: #{$value})";
|
||||
}
|
||||
}
|
||||
|
||||
@media #{$media-type} #{$expr} {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// screen
|
||||
// ----------------------------------------------------
|
||||
|
||||
@mixin screen($min, $max, $orientation: false) {
|
||||
@include mq($min-width: $min, $max-width: $max, $orientation: $orientation) {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
|
||||
@mixin max-screen($max) {
|
||||
@include mq($max-width: $max) {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
|
||||
@mixin min-screen($min) {
|
||||
@include mq($min-width: $min) {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
|
||||
@mixin screen-height($min, $max, $orientation: false) {
|
||||
@include mq($min-height: $min, $max-height: $max, $orientation: $orientation) {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
|
||||
@mixin max-screen-height($max) {
|
||||
@include mq($max-height: $max) {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
|
||||
@mixin min-screen-height($min) {
|
||||
@include mq($min-height: $min) {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// hdpi
|
||||
// ----------------------------------------------------
|
||||
|
||||
@mixin hdpi($ratio: 1.3) {
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: $ratio),
|
||||
screen and (min-resolution: #{round($ratio*96)}dpi) {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// hdtv
|
||||
// ----------------------------------------------------
|
||||
|
||||
@mixin hdtv($standard: '1080') {
|
||||
$min-width: false;
|
||||
$min-height: false;
|
||||
|
||||
$standards: ('720p', 1280px, 720px)
|
||||
('1080', 1920px, 1080px)
|
||||
('2K', 2048px, 1080px)
|
||||
('4K', 4096px, 2160px);
|
||||
|
||||
@each $s in $standards {
|
||||
@if $standard == nth($s, 1) {
|
||||
$min-width: nth($s, 2);
|
||||
$min-height: nth($s, 3);
|
||||
}
|
||||
}
|
||||
|
||||
@include mq(
|
||||
$min-device-width: $min-width,
|
||||
$min-device-height: $min-height,
|
||||
$min-width: $min-width,
|
||||
$min-height: $min-height
|
||||
) {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// iphone 4
|
||||
// ----------------------------------------------------
|
||||
|
||||
@mixin iphone4($orientation: false) {
|
||||
$min: 320px;
|
||||
$max: 480px;
|
||||
$pixel-ratio: 2;
|
||||
$aspect-ratio: '2/3';
|
||||
|
||||
@include mq(
|
||||
$min-device-width: $min,
|
||||
$max-device-width: $max,
|
||||
$orientation: $orientation,
|
||||
$device-aspect-ratio: $aspect-ratio,
|
||||
$-webkit-device-pixel-ratio: $pixel-ratio
|
||||
) {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// iphone 5
|
||||
// ----------------------------------------------------
|
||||
|
||||
@mixin iphone5($orientation: false) {
|
||||
$min: 320px;
|
||||
$max: 568px;
|
||||
$pixel-ratio: 2;
|
||||
$aspect-ratio: '40/71';
|
||||
|
||||
@include mq(
|
||||
$min-device-width: $min,
|
||||
$max-device-width: $max,
|
||||
$orientation: $orientation,
|
||||
$device-aspect-ratio: $aspect-ratio,
|
||||
$-webkit-device-pixel-ratio: $pixel-ratio
|
||||
) {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// iphone 6
|
||||
// ----------------------------------------------------
|
||||
|
||||
@mixin iphone6($orientation: false) {
|
||||
$min: 375px;
|
||||
$max: 667px;
|
||||
$pixel-ratio: 2;
|
||||
|
||||
@include mq(
|
||||
$min-device-width: $min,
|
||||
$max-device-width: $max,
|
||||
$orientation: $orientation,
|
||||
$-webkit-device-pixel-ratio: $pixel-ratio
|
||||
) {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// iphone 6 plus
|
||||
// ----------------------------------------------------
|
||||
|
||||
@mixin iphone6-plus($orientation: false) {
|
||||
$min: 414px;
|
||||
$max: 736px;
|
||||
$pixel-ratio: 3;
|
||||
|
||||
@include mq(
|
||||
$min-device-width: $min,
|
||||
$max-device-width: $max,
|
||||
$orientation: $orientation,
|
||||
$-webkit-device-pixel-ratio: $pixel-ratio
|
||||
) {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// ipad (all)
|
||||
// ----------------------------------------------------
|
||||
|
||||
@mixin ipad($orientation: false) {
|
||||
$min: 768px;
|
||||
$max: 1024px;
|
||||
|
||||
@include mq(
|
||||
$min-device-width: $min,
|
||||
$max-device-width: $max,
|
||||
$orientation: $orientation
|
||||
) {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// ipad-retina
|
||||
// ----------------------------------------------------
|
||||
|
||||
@mixin ipad-retina($orientation: false) {
|
||||
$min: 768px;
|
||||
$max: 1024px;
|
||||
$pixel-ratio: 2;
|
||||
|
||||
@include mq(
|
||||
$min-device-width: $min,
|
||||
$max-device-width: $max,
|
||||
$orientation: $orientation,
|
||||
$-webkit-device-pixel-ratio: $pixel-ratio
|
||||
) {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// orientation
|
||||
// ----------------------------------------------------
|
||||
|
||||
@mixin landscape() {
|
||||
@include mq($orientation: landscape) {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
|
||||
@mixin portrait() {
|
||||
@include mq($orientation: portrait) {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
703
themes/yilia/source-src/css/core/_mixin.scss
Normal file
703
themes/yilia/source-src/css/core/_mixin.scss
Normal file
@ -0,0 +1,703 @@
|
||||
@charset "UTF-8";
|
||||
|
||||
//-----------------------------------------------------
|
||||
// mixin scss
|
||||
// 包括常用的mixin, %, @function 及辅助的btn和背景图片icon
|
||||
// mixin，通过@include调用，样式通过拷贝的方式使用，尤其适用于传递参数
|
||||
// %，通过@extend调用，样式通过组合申明的方式使用，适用于不传参数的代码片段
|
||||
// @function，返回一个值，用于调用
|
||||
//-----------------------------------------------------
|
||||
|
||||
// mixin & %
|
||||
// 既定义了mixin也定义了%，根据需求使用@include或@extend调用
|
||||
//-----------------------------------------------------
|
||||
|
||||
// Center-align a block level element
|
||||
@mixin center-block($extend: true) {
|
||||
@if $extend {
|
||||
@extend %center-block;
|
||||
}
|
||||
@else {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
}
|
||||
|
||||
%center-block {
|
||||
@include center-block(false);
|
||||
}
|
||||
|
||||
// clearfix
|
||||
@mixin clearfix($extend: true) {
|
||||
@if $extend {
|
||||
@extend %clearfix;
|
||||
}
|
||||
@else {
|
||||
&::before,
|
||||
&::after {
|
||||
content: "";
|
||||
display: table;
|
||||
}
|
||||
&::after {
|
||||
clear: both;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
%clearfix {
|
||||
@include clearfix(false);
|
||||
}
|
||||
|
||||
// Hide only visually, but have it available for screenreaders
|
||||
// 只隐藏于视觉，屏幕浏览器可以阅读
|
||||
@mixin hidden-clip($extend: true) {
|
||||
@if $extend {
|
||||
@extend %hidden-clip;
|
||||
}
|
||||
@else {
|
||||
position: absolute;
|
||||
clip: rect(1px, 1px, 1px, 1px);
|
||||
}
|
||||
}
|
||||
|
||||
%hidden-clip {
|
||||
@include hidden-clip(false);
|
||||
}
|
||||
|
||||
// ellipsis
|
||||
@mixin ellipsis($extend: true) {
|
||||
@if $extend {
|
||||
@extend %ellipsis;
|
||||
}
|
||||
@else {
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
}
|
||||
|
||||
%ellipsis {
|
||||
@include ellipsis(false);
|
||||
}
|
||||
|
||||
// ellipsis lines
|
||||
// only old webkit flex box
|
||||
@mixin ellipsis-lines($lines: 2) {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: $lines;
|
||||
-webkit-box-orient: vertical;
|
||||
}
|
||||
|
||||
// word-break
|
||||
@mixin word-break($extend: true) {
|
||||
@if $extend {
|
||||
@extend %word-break;
|
||||
}
|
||||
@else {
|
||||
white-space: normal;
|
||||
word-wrap: break-word;
|
||||
word-break: break-all;
|
||||
}
|
||||
}
|
||||
|
||||
%word-break {
|
||||
@include word-break(false);
|
||||
}
|
||||
|
||||
// disabled
|
||||
// add !important
|
||||
@mixin disabled($colorText: map-get($colorDisabled, text), $colorBg: map-get($colorDisabled, bg), $colorBorder: false) {
|
||||
background-color: $colorBg !important;
|
||||
color: $colorText !important;
|
||||
cursor: default !important;
|
||||
pointer-events: none !important;
|
||||
@if $colorBorder {
|
||||
border: 1px solid map-get($colorDisabled, border);
|
||||
}
|
||||
}
|
||||
|
||||
%disabled {
|
||||
@include disabled;
|
||||
}
|
||||
|
||||
// image replace text
|
||||
@mixin ir($extend: true) {
|
||||
@if $extend {
|
||||
@extend %ir;
|
||||
}
|
||||
@else {
|
||||
font: 0/0 a;
|
||||
text-shadow: none;
|
||||
border: 0 none;
|
||||
color: transparent;
|
||||
}
|
||||
}
|
||||
|
||||
%ir {
|
||||
@include ir(false);
|
||||
}
|
||||
|
||||
// fixed top or bottom or bottom & top
|
||||
@mixin fixed($pos: 0) {
|
||||
position: fixed;
|
||||
left: 0;
|
||||
right: 0;
|
||||
@if $pos == bottom {
|
||||
bottom: 0;
|
||||
} @else if $pos == all {
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
} @else {
|
||||
top: $pos;
|
||||
}
|
||||
}
|
||||
|
||||
%fixed-top {
|
||||
@include fixed;
|
||||
}
|
||||
|
||||
%fixed-bottom {
|
||||
@include fixed(bottom);
|
||||
}
|
||||
|
||||
// justify
|
||||
// 左右对齐
|
||||
@mixin justify($extend: true) {
|
||||
@if $extend {
|
||||
@extend %justify;
|
||||
}
|
||||
@else {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
}
|
||||
|
||||
%justify {
|
||||
@include justify(false);
|
||||
}
|
||||
|
||||
// retina border
|
||||
// 0.5px实现 ios9
|
||||
@mixin retina-one-px() {
|
||||
@supports (border-width: 0.5px) {
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: 2), screen and (-webkit-min-device-pixel-ratio: 3) {
|
||||
border-width: 0.5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// linear-gradient实现
|
||||
// 安卓4.3- 不支持background-size的百分比
|
||||
@mixin retina-one-px-bg($direction: top, $color: $colorBorder) {
|
||||
background-repeat: no-repeat;
|
||||
@if $direction == top {
|
||||
background-image: linear-gradient(to bottom, $color 50%, transparent 50%);
|
||||
background-size: 100% 1px;
|
||||
}
|
||||
@if $direction == bottom {
|
||||
background-image: linear-gradient(to top, $color 50%, transparent 50%);
|
||||
background-size: 100% 1px;
|
||||
background-position: left bottom;
|
||||
}
|
||||
@if $direction == left {
|
||||
background-image: linear-gradient(to right, $color 50%, transparent 50%);
|
||||
background-size: 1px 100%;
|
||||
}
|
||||
@if $direction == right {
|
||||
background-image: linear-gradient(to left, $color 50%, transparent 50%);
|
||||
background-size: 1px 100%;
|
||||
background-position: right top;
|
||||
}
|
||||
@if $direction == v { // 左右两个边框
|
||||
background-image: linear-gradient(to right, $color 50%, transparent 50%),linear-gradient(to left, $color 50%, transparent 50%);
|
||||
background-size: 1px 100%;
|
||||
background-position: left top, right top;
|
||||
}
|
||||
@if $direction == h { // 上下两个边框
|
||||
background-image: linear-gradient(to bottom, $color 50%, transparent 50%), linear-gradient(to top, $color 50%, transparent 50%);
|
||||
background-size: 100% 1px;
|
||||
background-position: left top, left bottom;
|
||||
}
|
||||
@if $direction == all { // 上下左右四个边框
|
||||
background-image: linear-gradient(to bottom, $color 50%, transparent 50%), linear-gradient(to top, $color 50%, transparent 50%), linear-gradient(to right, $color 50%, transparent 50%),linear-gradient(to left, $color 50%, transparent 50%);
|
||||
background-size: 100% 1px, 100% 1px, 1px 100%, 1px 100%;
|
||||
background-position: left top, left bottom, left top, right top;
|
||||
}
|
||||
}
|
||||
|
||||
// border和transform实现
|
||||
// 注意before和after的层级问题
|
||||
@mixin retina-one-px-border($direction: top, $color: $colorBorder) {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
box-sizing: border-box;
|
||||
|
||||
@if $direction == top or $direction == bottom{
|
||||
right: 0;
|
||||
height: 0;
|
||||
transform: scaleY(0.5);
|
||||
border-top: 1px solid $color;
|
||||
}
|
||||
@if $direction == bottom {
|
||||
top: auto;
|
||||
bottom: 0;
|
||||
}
|
||||
@if $direction == right or $direction == left{
|
||||
width: 0;
|
||||
bottom: 0;
|
||||
transform: scaleX(0.5);
|
||||
border-left: 1px solid $color;
|
||||
}
|
||||
@if $direction == right {
|
||||
left: auto;
|
||||
right: 0;
|
||||
}
|
||||
@if $direction == all {
|
||||
width: 200%;
|
||||
height: 200%;
|
||||
transform-origin: left top;
|
||||
transform: scale(0.5);
|
||||
border: 1px solid $color;
|
||||
}
|
||||
}
|
||||
|
||||
// border top & bottom
|
||||
%border-tb {
|
||||
position: relative;
|
||||
&::before {
|
||||
content: "";
|
||||
@include retina-one-px-border(top);
|
||||
z-index: 1;
|
||||
}
|
||||
&::after {
|
||||
content: "";
|
||||
@include retina-one-px-border(bottom);
|
||||
}
|
||||
}
|
||||
|
||||
// border all
|
||||
%border-all {
|
||||
position: relative;
|
||||
&::before {
|
||||
content: "";
|
||||
@include retina-one-px-border(all);
|
||||
z-index: -1;
|
||||
}
|
||||
}
|
||||
|
||||
// mixin
|
||||
// 只定义了mixin，所以只能通过@include来调用
|
||||
//-----------------------------------------------------
|
||||
|
||||
// table 等
|
||||
// $child 参数请使用单引号，因为用于子元素选择器
|
||||
@mixin equal-table($child: 'li') {
|
||||
display: table;
|
||||
table-layout: fixed;
|
||||
width: 100%;
|
||||
|
||||
#{unquote($child)} {
|
||||
display: table-cell;
|
||||
}
|
||||
}
|
||||
|
||||
// flex 等分
|
||||
// $child 参数请使用单引号，因为用于子元素选择器
|
||||
@mixin equal-flex($child: 'li') {
|
||||
display: flex;
|
||||
|
||||
#{unquote($child)} {
|
||||
flex: 1;
|
||||
width: 1%;
|
||||
}
|
||||
}
|
||||
|
||||
// line equal gap
|
||||
// $child 参数请使用单引号，因为用于子元素选择器
|
||||
@mixin line-equal-gap($gap: 10px, $child: 'li', $lr: true) {
|
||||
display: flex;
|
||||
|
||||
@if $lr {
|
||||
padding-left: $gap;
|
||||
padding-right: $gap;
|
||||
}
|
||||
|
||||
#{unquote($child)} {
|
||||
flex: 1;
|
||||
width: 1%;
|
||||
&:not(:first-of-type){
|
||||
margin-left: $gap;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// line equal item
|
||||
@mixin line-equal-item($lr: true) {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
@if $lr {
|
||||
&::before,
|
||||
&::after {
|
||||
content: "";
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// flex center
|
||||
@mixin center-flex($direction: both) {
|
||||
display: flex;
|
||||
@if $direction == both {
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
@else if $direction == x {
|
||||
justify-content: center;
|
||||
}
|
||||
@else if $direction == y {
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
|
||||
// translate center
|
||||
@mixin center-translate($direction: both) {
|
||||
position: absolute;
|
||||
@if $direction == both {
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate3d(-50%, -50%, 0);
|
||||
}
|
||||
@else if $direction == x {
|
||||
left: 50%;
|
||||
transform: translate3d(-50%, 0, 0);
|
||||
}
|
||||
@else if $direction == y {
|
||||
top: 50%;
|
||||
transform: translate3d(0, -50%, 0);
|
||||
}
|
||||
}
|
||||
|
||||
// object wrap
|
||||
// $child 参数请使用单引号，因为用于子元素选择器
|
||||
@mixin object-wrap($percent: 100%, $child: 'img') {
|
||||
position: relative;
|
||||
padding-top: $percent;
|
||||
height: 0;
|
||||
|
||||
#{unquote($child)} {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
// triangle 三角箭头
|
||||
// 可采用空元素或伪元素生成，具体定位这里不涉及
|
||||
%triangle-basic {
|
||||
content: "";
|
||||
height: 0;
|
||||
width: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
@mixin triangle($direction: top, $borderWidth: 6px, $borderColor: $colorC) {
|
||||
@extend %triangle-basic;
|
||||
@if $direction == top {
|
||||
border-bottom: $borderWidth solid $borderColor;
|
||||
border-left: $borderWidth dashed transparent;
|
||||
border-right: $borderWidth dashed transparent;
|
||||
}
|
||||
@else if $direction == right {
|
||||
border-left: $borderWidth solid $borderColor;
|
||||
border-top: $borderWidth dashed transparent;
|
||||
border-bottom: $borderWidth dashed transparent;
|
||||
}
|
||||
@else if $direction == bottom {
|
||||
border-top: $borderWidth solid $borderColor;
|
||||
border-left: $borderWidth dashed transparent;
|
||||
border-right: $borderWidth dashed transparent;
|
||||
}
|
||||
@else if $direction == left {
|
||||
border-right: $borderWidth solid $borderColor;
|
||||
border-top: $borderWidth dashed transparent;
|
||||
border-bottom: $borderWidth dashed transparent;
|
||||
}
|
||||
}
|
||||
|
||||
// v arrow 方向箭头
|
||||
@mixin v-arrow($direction: right, $borderWidth: 2px, $size: 10px) {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
width: $size;
|
||||
height: $size;
|
||||
@if $direction == top {
|
||||
border-top: $borderWidth solid currentColor;
|
||||
border-right: $borderWidth solid currentColor;
|
||||
transform: rotate(-45deg);
|
||||
}
|
||||
@else if $direction == right {
|
||||
border-top: $borderWidth solid currentColor;
|
||||
border-right: $borderWidth solid currentColor;
|
||||
transform: rotate(45deg);
|
||||
}
|
||||
@else if $direction == bottom {
|
||||
border-left: $borderWidth solid currentColor;
|
||||
border-bottom: $borderWidth solid currentColor;
|
||||
transform: rotate(-45deg);
|
||||
}
|
||||
@if $direction == left {
|
||||
border-left: $borderWidth solid currentColor;
|
||||
border-bottom: $borderWidth solid currentColor;
|
||||
transform: rotate(45deg);
|
||||
}
|
||||
}
|
||||
|
||||
// selector
|
||||
// 改变父元素状态，如:hover或.active
|
||||
// 父元素不能有组合选择器，如.a, .b{}
|
||||
// .parent{
|
||||
// .child{
|
||||
// @include parent-state(":hover"){
|
||||
// color: #f00;
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// .parent:hover .child {
|
||||
// color: #f00;
|
||||
// }
|
||||
@mixin parent-state($states...) {
|
||||
$parent: nth(nth(&, 1), (length(nth(&, 1))-1));
|
||||
|
||||
@each $state in $states {
|
||||
@at-root #{selector-replace(&, $parent, str-insert($state, $parent, 0))} {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// animation-fade
|
||||
// @include animation-fade
|
||||
// @include animation-fade($from: false, $to: .5);
|
||||
// @include animation-fade($from: 1, $to: 0);
|
||||
@mixin animation-fade($name: animationFade, $from: 0, $to: false){
|
||||
@keyframes #{animationFade} {
|
||||
@if $from {
|
||||
from {
|
||||
opacity: $from;
|
||||
}
|
||||
}
|
||||
@if $to {
|
||||
to {
|
||||
opacity: $to;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// animation-translate
|
||||
// @include animation-translate
|
||||
// @include animation-translate($from: x -100%);
|
||||
// @include animation-translate($from: xy -50% -50%, $to: y -100%);
|
||||
// @include animation-translate($from: y 100px, $to: y 0px);
|
||||
@mixin animation-translate($name: animationTranslate, $from: y -100%, $to: false) {
|
||||
@keyframes #{$name} {
|
||||
@if $from and length($from) > 1 {
|
||||
from {
|
||||
@if nth($from, 1) == x {
|
||||
transform: translate(nth($from, 2), 0);
|
||||
}
|
||||
@if nth($from, 1) == y {
|
||||
transform: translate(0, nth($from, 2));
|
||||
}
|
||||
@if nth($from, 1) == xy or nth($from, 1) == both {
|
||||
transform: translate(nth($from, 2), nth($from, 3));
|
||||
}
|
||||
}
|
||||
}
|
||||
@if $to andd length($to) > 1 {
|
||||
to {
|
||||
@if nth($to, 1) == x {
|
||||
transform: translate(nth($to, 2), 0);
|
||||
}
|
||||
@if nth($to, 1) == y {
|
||||
transform: translate(0, nth($to, 2));
|
||||
}
|
||||
@if nth($to, 1) == xy or nth($to, 1) == both {
|
||||
transform: translate(nth($to, 2), nth($to, 3));
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// %
|
||||
// 只定义了%，所以只能通过@extend来调用
|
||||
//-----------------------------------------------------
|
||||
|
||||
// bar line
|
||||
%bar-line {
|
||||
line-height: $barHeight - 10px;
|
||||
padding: 5px 10px;
|
||||
position: relative;
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
@if $activeStateSwitch{
|
||||
&:active,
|
||||
&:hover {
|
||||
background-color: darken($colorF, 3%);
|
||||
}
|
||||
}
|
||||
&:not(:first-of-type)::before {
|
||||
content: "";
|
||||
@include retina-one-px-border;
|
||||
}
|
||||
}
|
||||
|
||||
// item arrow, 右侧箭头跳转指向
|
||||
%item-v-right {
|
||||
&::after {
|
||||
content: "";
|
||||
@include v-arrow;
|
||||
color: $colorC;
|
||||
position: absolute;
|
||||
right: 15px;
|
||||
top: 50%;
|
||||
margin-top: -1px;
|
||||
transform: rotate(45deg) translate(0, -50%);
|
||||
box-sizing: border-box;
|
||||
}
|
||||
}
|
||||
|
||||
// 间隔列表
|
||||
%gap-item{
|
||||
position: relative;
|
||||
background: #fff;
|
||||
margin: 10px 0;
|
||||
@if $activeStateSwitch{
|
||||
&:active,
|
||||
&:hover {
|
||||
background-color: darken($colorF, 3%);
|
||||
}
|
||||
}
|
||||
&::before{
|
||||
content: "";
|
||||
@include retina-one-px-border;
|
||||
}
|
||||
&::after{
|
||||
content: "";
|
||||
@include retina-one-px-border(bottom);
|
||||
}
|
||||
}
|
||||
|
||||
// 下面的几个%，由于版本或前缀，所以设计成%
|
||||
//-----------------------------------------------------
|
||||
// flex
|
||||
%display-flex {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
// all-transition
|
||||
%transition-all {
|
||||
transition: all 0.3s ease-in-out;
|
||||
}
|
||||
|
||||
// translate3d
|
||||
%translate3d {
|
||||
transform: translate3d(0, 0, 0);
|
||||
}
|
||||
|
||||
|
||||
// btn
|
||||
//----------------------------------------------------
|
||||
// btn-basic
|
||||
// 按钮基本样式，联合申明
|
||||
%btn-basic {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
cursor: pointer;
|
||||
text-align: center;
|
||||
border: 1px solid transparent;
|
||||
box-sizing: border-box;
|
||||
user-select: none;
|
||||
padding: 0 1em;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
// btn-size
|
||||
// 按钮大小
|
||||
@mixin btn-size($padding: 1em, $height: $barHeight, $radius: 3px) {
|
||||
padding: 0 $padding;
|
||||
line-height: $height - 2px; // 减掉2px的上下高度
|
||||
@if $radius {
|
||||
border-radius: $radius;
|
||||
}
|
||||
}
|
||||
|
||||
// btn-color
|
||||
// 包括按钮背景色，文本色，是否有边框
|
||||
@mixin btn-color($colorText: #333, $colorBg: #666, $colorBorder: false) {
|
||||
color: nth($colorText, 1);
|
||||
background-color: nth($colorBg, 1);
|
||||
@if $colorBorder {
|
||||
border-color: nth($colorBorder, 1);
|
||||
}
|
||||
&:hover,
|
||||
&:active {
|
||||
@if length($colorText) == 2 {
|
||||
color: nth($colorText, 2);
|
||||
}
|
||||
@if length($colorBg) == 2 {
|
||||
background-color: nth($colorBg, 2);
|
||||
} @else {
|
||||
@if lightness($colorBg) > 40% {
|
||||
background-color: darken($colorBg, 5%);
|
||||
}
|
||||
@else {
|
||||
background-color: lighten($colorBg, 5%);
|
||||
}
|
||||
}
|
||||
@if $colorBorder and length($colorBorder) == 2 {
|
||||
border-color: nth($colorBorder, 2); // $colorBorder: #dbdbdb #ccc => #ccc
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
//function
|
||||
//-----------------------------------------------------
|
||||
|
||||
// 为颜色添加白色，以百分比形式
|
||||
@function tint($color, $percent) {
|
||||
@return mix(white, $color, $percent);
|
||||
}
|
||||
|
||||
// 为颜色添加黑色，以百分比形式
|
||||
@function shade($color, $percent) {
|
||||
@return mix(black, $color, $percent);
|
||||
}
|
||||
|
||||
%shadow {
|
||||
box-shadow: 0px 0px 6px 0px rgba(0,0,0,.75);
|
||||
}
|
||||
|
||||
%trans {
|
||||
transition: all 0.2s ease-in;
|
||||
-ms-transition: all 0.2s ease-in;
|
||||
}
|
||||
|
||||
%trans8 {
|
||||
transition: all 0.8s ease-in;
|
||||
-ms-transition: all 0.8s ease-in;
|
||||
}
|
||||
|
||||
%line-bg {
|
||||
background: linear-gradient(200deg, #a0cfe4, #e8c37e);
|
||||
}
|
||||
|
||||
%paper-bg {
|
||||
background: url('./img/checkered-pattern.png') repeat #5d5d5d;
|
||||
}
|
||||
418
themes/yilia/source-src/css/core/_reset.scss
Normal file
418
themes/yilia/source-src/css/core/_reset.scss
Normal file
@ -0,0 +1,418 @@
|
||||
@charset "UTF-8";
|
||||
|
||||
//-----------------------------------------------------
|
||||
// reset scss
|
||||
// 包括normalize，清零重置
|
||||
//-----------------------------------------------------
|
||||
|
||||
// normalize 4.0
|
||||
// http://necolas.github.io/normalize.css/
|
||||
//-----------------------------------------------------
|
||||
|
||||
// 1. Prevent mobile text size adjust after orientation change, without disabling user zoom.
|
||||
// 2. Remove the gray background color from tap, default value is inherit
|
||||
html {
|
||||
-ms-text-size-adjust: 100%; // 1
|
||||
-webkit-text-size-adjust: 100%; // 1
|
||||
-webkit-tap-highlight-color: transparent; // 2
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
// 1. Remove default margin
|
||||
body {
|
||||
margin: 0; // 1
|
||||
font-size: $fontSize;
|
||||
font-family: $fontFamily;
|
||||
line-height: $fontLineHeight;
|
||||
color: $colorText;
|
||||
background-color: $colorBg;
|
||||
min-height: 100%;
|
||||
}
|
||||
|
||||
// HTML5 display definitions
|
||||
//-----------------------------------------------------
|
||||
|
||||
// Correct `block` display not defined for any HTML5 element in IE 8/9.
|
||||
// Correct `block` display not defined for `details` or `summary` in IE 10/11 and Firefox.
|
||||
// Correct `block` display not defined for `main` in IE 11.
|
||||
article,
|
||||
aside,
|
||||
details,
|
||||
figcaption,
|
||||
figure,
|
||||
footer,
|
||||
header,
|
||||
hgroup,
|
||||
main,
|
||||
menu,
|
||||
nav,
|
||||
section,
|
||||
summary {
|
||||
display: block;
|
||||
}
|
||||
|
||||
// 1. Correct `inline-block` display not defined in IE 9-.
|
||||
audio,
|
||||
canvas,
|
||||
progress,
|
||||
video {
|
||||
display: inline-block; // 1
|
||||
}
|
||||
|
||||
// Prevent modern browsers from displaying `audio` without controls.
|
||||
// Remove excess height in iOS 5 devices.
|
||||
audio:not([controls]) {
|
||||
display: none;
|
||||
height: 0;
|
||||
}
|
||||
|
||||
// Add the correct vertical alignment in Chrome, Firefox, and Opera.
|
||||
progress {
|
||||
vertical-align: baseline;
|
||||
}
|
||||
|
||||
// Address `[hidden]` styling not present in IE 8/9/10.
|
||||
// Hide the `template` element in IE 8/9/11, Safari, and Firefox < 22.
|
||||
[hidden],
|
||||
template {
|
||||
display: none;
|
||||
}
|
||||
|
||||
// Links
|
||||
//-----------------------------------------------------
|
||||
|
||||
// 1. Remove the gray background color from active links in IE 10.
|
||||
// 2. Improve readability when focused and also mouse hovered in all browsers.
|
||||
|
||||
a {
|
||||
background: transparent; // 1
|
||||
text-decoration: none;
|
||||
color: nth($colorLink, 1);
|
||||
|
||||
&:active {
|
||||
outline: 0; // 2
|
||||
}
|
||||
}
|
||||
|
||||
// Text-level semantics
|
||||
//-----------------------------------------------------
|
||||
|
||||
// Address styling not present in IE 8/9/10/11, Safari, and Chrome.
|
||||
abbr[title] {
|
||||
border-bottom: 1px dotted;
|
||||
}
|
||||
|
||||
// Address style set to `bolder` in Firefox 4+, Safari, and Chrome.
|
||||
b,
|
||||
strong {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
// Address styling not present in Safari and Chrome.
|
||||
dfn {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
// Address styling not present in IE 8/9.
|
||||
mark {
|
||||
background: #ff0;
|
||||
color: #000;
|
||||
}
|
||||
|
||||
// Address inconsistent and variable font size in all browsers.
|
||||
small {
|
||||
font-size: 80%;
|
||||
}
|
||||
|
||||
// Prevent `sub` and `sup` affecting `line-height` in all browsers.
|
||||
sub,
|
||||
sup {
|
||||
font-size: 75%;
|
||||
line-height: 0;
|
||||
position: relative;
|
||||
vertical-align: baseline;
|
||||
}
|
||||
|
||||
sup {
|
||||
top: -0.5em;
|
||||
}
|
||||
|
||||
sub {
|
||||
bottom: -0.25em;
|
||||
}
|
||||
|
||||
// Embedded content
|
||||
//-----------------------------------------------------
|
||||
|
||||
// 1. Remove border when inside `a` element in IE 8/9/10.
|
||||
img {
|
||||
border: 0; // 1
|
||||
vertical-align: middle;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
// Correct overflow not hidden in IE 9/10/11.
|
||||
svg:not(:root) {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
// Grouping content
|
||||
//-----------------------------------------------------
|
||||
|
||||
// 1. Contain overflow in all browsers.
|
||||
// 2. Improve readability of pre-formatted text in all browsers.
|
||||
pre {
|
||||
overflow: auto; // 1
|
||||
white-space: pre; // 2
|
||||
white-space: pre-wrap; // 2
|
||||
word-wrap: break-word; // 2
|
||||
}
|
||||
|
||||
// 1. Address odd `em`-unit font size rendering in all browsers.
|
||||
code,
|
||||
kbd,
|
||||
pre,
|
||||
samp {
|
||||
font-family: monospace, monospace; // 1
|
||||
font-size: 1em; // 2
|
||||
}
|
||||
|
||||
// Forms
|
||||
//-----------------------------------------------------
|
||||
|
||||
// Known limitation: by default, Chrome and Safari on OS X allow very limited
|
||||
// styling of `select`, unless a `border` property is set.
|
||||
|
||||
// 1. Correct color not being inherited.
|
||||
// Known issue: affects color of disabled elements.
|
||||
// 2. Correct font properties not being inherited.
|
||||
// 3. Address margins set differently in Firefox 4+, Safari, and Chrome.
|
||||
button,
|
||||
input,
|
||||
optgroup,
|
||||
select,
|
||||
textarea {
|
||||
color: inherit; // 1
|
||||
font: inherit; // 2
|
||||
margin: 0; // 3
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
// Show the overflow in IE.
|
||||
// 1. Show the overflow in Edge.
|
||||
// 2. Show the overflow in Edge, Firefox, and IE.
|
||||
button,
|
||||
input, // 1
|
||||
select { // 2
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
// Address inconsistent `text-transform` inheritance for `button` and `select`.
|
||||
// All other form control elements do not inherit `text-transform` values.
|
||||
// Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.
|
||||
// Correct `select` style inheritance in Firefox.
|
||||
button,
|
||||
select {
|
||||
text-transform: none;
|
||||
}
|
||||
|
||||
// 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
|
||||
// and `video` controls.
|
||||
// 2. Correct inability to style clickable `input` types in iOS.
|
||||
// 3. Improve usability and consistency of cursor style between image-type
|
||||
// `input` and others.
|
||||
button,
|
||||
html input[type="button"], // 1
|
||||
input[type="reset"],
|
||||
input[type="submit"] {
|
||||
-webkit-appearance: button; // 2
|
||||
cursor: pointer; // 3
|
||||
}
|
||||
|
||||
// Re-set default cursor for disabled elements.
|
||||
[disabled] {
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
// Remove inner padding and border in Firefox 4+.
|
||||
button::-moz-focus-inner,
|
||||
input::-moz-focus-inner {
|
||||
border: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
// 1. Address Firefox 4+ setting `line-height` on `input` using `!important` in
|
||||
// the UA stylesheet.
|
||||
input {
|
||||
line-height: normal; // 1
|
||||
}
|
||||
|
||||
// It's recommended that you don't attempt to style these elements.
|
||||
// Firefox's implementation doesn't respect box-sizing, padding, or width.
|
||||
|
||||
// 1. Address box sizing set to `content-box` in IE 8/9/10.
|
||||
// 2. Remove excess padding in IE 8/9/10.
|
||||
input[type="checkbox"],
|
||||
input[type="radio"] {
|
||||
box-sizing: border-box; // 1
|
||||
padding: 0; // 2
|
||||
}
|
||||
|
||||
// Fix the cursor style for Chrome's increment/decrement buttons. For certain
|
||||
// `font-size` values of the `input`, it causes the cursor style of the
|
||||
// decrement button to change from `default` to `text`.
|
||||
input[type="number"]::-webkit-inner-spin-button,
|
||||
input[type="number"]::-webkit-outer-spin-button {
|
||||
height: auto;
|
||||
}
|
||||
|
||||
// 1. Address `appearance` set to `searchfield` in Safari and Chrome.
|
||||
// 2. Address `box-sizing` set to `border-box` in Safari and Chrome
|
||||
// (include `-moz` to future-proof).
|
||||
input[type="search"] {
|
||||
-webkit-appearance: textfield; // 1
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
// Remove inner padding and search cancel button in Safari and Chrome on OS X.
|
||||
// Safari (but not Chrome) clips the cancel button when the search input has
|
||||
// padding (and `textfield` appearance).
|
||||
input[type="search"]::-webkit-search-cancel-button,
|
||||
input[type="search"]::-webkit-search-decoration {
|
||||
-webkit-appearance: none;
|
||||
}
|
||||
|
||||
// Define consistent border, margin, and padding.
|
||||
fieldset {
|
||||
border: 1px solid #c0c0c0;
|
||||
margin: 0 2px;
|
||||
padding: 0.35em 0.625em 0.75em;
|
||||
}
|
||||
|
||||
// 1. Correct `color` not being inherited in IE 8/9/10/11.
|
||||
// 2. Remove padding so people aren't caught out if they zero out fieldsets.
|
||||
legend {
|
||||
border: 0; // 1
|
||||
padding: 0; // 2
|
||||
}
|
||||
|
||||
// 1. Remove default vertical scrollbar in IE 8/9/10/11.
|
||||
textarea {
|
||||
overflow: auto; // 1
|
||||
resize: vertical;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
// Don't inherit the `font-weight` (applied by a rule above).
|
||||
// NOTE: the default cannot safely be changed in Chrome and Safari on OS X.
|
||||
optgroup {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
// webkit focus outline
|
||||
input,
|
||||
select,
|
||||
textarea,
|
||||
button {
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
// Android 下 input focus 消除高亮外框
|
||||
textarea,
|
||||
input {
|
||||
-webkit-user-modify: read-write-plaintext-only;
|
||||
}
|
||||
|
||||
// ie10 clear & password
|
||||
input::-ms-clear,
|
||||
input::-ms-reveal {
|
||||
display: none;
|
||||
}
|
||||
|
||||
// 表单placeholder样式
|
||||
// 注意不可联合申明，否则无效
|
||||
// Firefox 19+
|
||||
input::-moz-placeholder,
|
||||
textarea::-moz-placeholder {
|
||||
color: $colorPlaceholder;
|
||||
}
|
||||
|
||||
// Internet Explorer 10+
|
||||
input:-ms-input-placeholder,
|
||||
textarea:-ms-input-placeholder {
|
||||
color: $colorPlaceholder;
|
||||
}
|
||||
|
||||
// Safari and Chrome
|
||||
input::-webkit-input-placeholder,
|
||||
textarea::-webkit-input-placeholder {
|
||||
color: $colorPlaceholder;
|
||||
}
|
||||
|
||||
// 如不支持placeholder添加class 或者 设置提示的placeholder
|
||||
.placeholder{
|
||||
color: $colorPlaceholder;
|
||||
}
|
||||
|
||||
// Tables
|
||||
//-----------------------------------------------------
|
||||
// Remove most spacing between table cells.
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0;
|
||||
}
|
||||
|
||||
td,
|
||||
th {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
// 根据使用习惯，对normalize上进行补充
|
||||
//-----------------------------------------------------
|
||||
|
||||
h1, h2, h3, h4, h5, h6, p, figure, form, blockquote {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
// ul ol dl
|
||||
ul, ol, li, dl, dd {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
ul, ol {
|
||||
list-style: none outside none;
|
||||
}
|
||||
|
||||
// hn
|
||||
h1, h2, h3 {
|
||||
line-height: 2;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
// icon
|
||||
i {
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
// 所有元素为border-box
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
// 清除子元素浮动
|
||||
.clearfix {
|
||||
@extend %clearfix;
|
||||
}
|
||||
83
themes/yilia/source-src/css/core/_variables.scss
Normal file
83
themes/yilia/source-src/css/core/_variables.scss
Normal file
@ -0,0 +1,83 @@
|
||||
@charset "UTF-8";
|
||||
|
||||
//-----------------------------------------------------
|
||||
// variables scss
|
||||
//-----------------------------------------------------
|
||||
|
||||
|
||||
// font相关
|
||||
//-----------------------------------------------------
|
||||
$fontSize: 14px !default;
|
||||
$fontLineHeight: 1.5 !default;
|
||||
$fontFamily: "Helvetica Neue", Helvetica, STHeiTi, Arial, sans-serif !default;
|
||||
// ios华文黑体,Android 4.0之后,Android 4.0之前
|
||||
$fontCn: STHeiTi, Roboto, "Droid Sans Fallback", Arial !default;
|
||||
// ios4.0+,ios4.0-,Android 4.0+,Android 4.0-
|
||||
$fontEn: "Helvetica Neue", Helvetica, Roboto, "Droid Sans", Arial !default;
|
||||
|
||||
|
||||
// 背景色，文本色，边框色，链接色
|
||||
//-----------------------------------------------------
|
||||
$colorText: #333 !default;
|
||||
$colorBg: #fff !default;
|
||||
$colorBorder: #dbdbdb !default;
|
||||
$colorLink: #08c !default;
|
||||
$colorPlaceholder: #999 !default; // input placeholder color
|
||||
$colorDisabled: (text: #999, bg: #e3e3e3, border: #dbdbdb) !default; // textColor bgColor borderColor
|
||||
$colorOverlay: rgba(0,0,0,.7) !default; // 遮罩层颜色
|
||||
|
||||
|
||||
// 基本颜色
|
||||
// color function : http://sass-lang.com/docs/yardoc/Sass/Script/Functions.html
|
||||
// lighten($color, $amount)
|
||||
// darken($color, $amount)
|
||||
// opacity($color, $amount)
|
||||
// mix($color1, $color2[, $amount])
|
||||
//-----------------------------------------------------
|
||||
$color3: #333;
|
||||
$color6: #666;
|
||||
$color9: #999;
|
||||
$colorC: #ccc;
|
||||
$colorF: #f5f5f5;
|
||||
|
||||
$blue: #007aff !default;
|
||||
$orange: #ff9500 !default;
|
||||
$red: #ff3b30 !default;
|
||||
$green: #4cd964 !default;
|
||||
$primary: #007aff !default;
|
||||
|
||||
|
||||
// 元素上下间距
|
||||
//-----------------------------------------------------
|
||||
$gap: 20px !default;
|
||||
|
||||
|
||||
// header,footer等的高度
|
||||
//-----------------------------------------------------
|
||||
$barHeight: 44px !default;
|
||||
|
||||
|
||||
// radius
|
||||
//-----------------------------------------------------
|
||||
$radiusBase: 5px !default;
|
||||
$radiusSmall: 3px !default;
|
||||
|
||||
|
||||
// timing-function
|
||||
//-----------------------------------------------------
|
||||
$timingFunction: cubic-bezier(0.42, 0, 0.58, 1);
|
||||
|
||||
|
||||
// active state switch
|
||||
//-----------------------------------------------------
|
||||
$activeStateSwitch: true !default;
|
||||
|
||||
|
||||
// z-index
|
||||
//-----------------------------------------------------
|
||||
$zIndexHeader: 1000 !default;
|
||||
$zIndexFooter: 2000 !default;
|
||||
$zIndexPopup: 3000 !default;
|
||||
$zIndexOverlay: 4000 !default; // 默认高于header和footer部分
|
||||
|
||||
$articlePadding: 7.6923%;
|
||||
111
themes/yilia/source-src/css/fonts.scss
Normal file
111
themes/yilia/source-src/css/fonts.scss
Normal file
@ -0,0 +1,111 @@
|
||||
@font-face {font-family: "iconfont";
|
||||
src: url('./fonts/iconfont.eot'); /* IE9*/
|
||||
src: url('./fonts/iconfont.eot#iefix') format('embedded-opentype'), /* IE6-IE8 */
|
||||
url('./fonts/iconfont.woff') format('woff'), /* chrome, firefox */
|
||||
url('./fonts/iconfont.ttf') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+*/
|
||||
url('./fonts/iconfont.svg#iconfont') format('svg'); /* iOS 4.1- */
|
||||
}
|
||||
|
||||
[class^="icon-"], [class*=" icon-"] {
|
||||
/* use !important to prevent issues with browser extensions that change fonts */
|
||||
font-family: 'iconfont' !important;
|
||||
speak: none;
|
||||
font-size:16px;
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
font-variant: normal;
|
||||
text-transform: none;
|
||||
line-height: 1;
|
||||
|
||||
/* Better Font Rendering =========== */
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
.icon-twitter:before { content: "\e600"; }
|
||||
|
||||
.icon-facebook:before { content: "\e601"; }
|
||||
|
||||
.icon-clock:before { content: "\e602"; }
|
||||
|
||||
.icon-mail:before { content: "\e609"; }
|
||||
|
||||
.icon-link:before { content: "\e6ab"; }
|
||||
|
||||
.icon-search:before { content: "\e65b"; }
|
||||
|
||||
.icon-smile:before { content: "\e64a"; }
|
||||
|
||||
.icon-roundrightfill:before { content: "\e65a"; }
|
||||
|
||||
.icon-list:before { content: "\e682"; }
|
||||
|
||||
.icon-book:before { content: "\e6fe"; }
|
||||
|
||||
.icon-home:before { content: "\e6bb"; }
|
||||
|
||||
.icon-share:before { content: "\e618"; }
|
||||
|
||||
.icon-back:before { content: "\e625"; }
|
||||
|
||||
.icon-qq:before { content: "\e62d"; }
|
||||
|
||||
.icon-weibo:before { content: "\e619"; }
|
||||
|
||||
.icon-segmentfault:before { content: "\e603"; }
|
||||
|
||||
.icon-sort:before { content: "\e700"; }
|
||||
|
||||
.icon-jianshu:before { content: "\e613"; }
|
||||
|
||||
.icon-circle-left:before { content: "\e71f"; }
|
||||
|
||||
.icon-circle-right:before { content: "\e720"; }
|
||||
|
||||
.icon-loading:before { content: "\e614"; }
|
||||
|
||||
.icon-acfun:before { content: "\e604"; }
|
||||
|
||||
.icon-close:before { content: "\e60c"; }
|
||||
|
||||
.icon-tumblr:before { content: "\e6b0"; }
|
||||
|
||||
.icon-calendar:before { content: "\e667"; }
|
||||
|
||||
.icon-rss:before { content: "\e877"; }
|
||||
|
||||
.icon-price-tags:before { content: "\e6f9"; }
|
||||
|
||||
.icon-quo-left:before { content: "\e7f5"; }
|
||||
|
||||
.icon-quo-right:before { content: "\e7f6"; }
|
||||
|
||||
.icon-back1:before { content: "\e64e"; }
|
||||
|
||||
.icon-github:before { content: "\e735"; }
|
||||
|
||||
.icon-film:before { content: "\e7b7"; }
|
||||
|
||||
.icon-weixin:before { content: "\e61f"; }
|
||||
|
||||
.icon-qzone:before { content: "\e680"; }
|
||||
|
||||
.icon-category:before { content: "\e605"; }
|
||||
|
||||
.icon-douban:before { content: "\e64c"; }
|
||||
|
||||
.icon-roundleftfill:before { content: "\e799"; }
|
||||
|
||||
.icon-tuding:before { content: "\e651"; }
|
||||
|
||||
.icon-zhihu:before { content: "\e61b"; }
|
||||
|
||||
.icon-linkedin:before { content: "\e6d4"; }
|
||||
|
||||
.icon-google:before { content: "\e635"; }
|
||||
|
||||
.icon-plane:before { content: "\e62f"; }
|
||||
|
||||
.icon-bilibili:before { content: "\e622"; }
|
||||
|
||||
.icon-psn:before { content: "\e6c7"; }
|
||||
BIN
themes/yilia/source-src/css/fonts/iconfont.eot
Normal file
BIN
themes/yilia/source-src/css/fonts/iconfont.eot
Normal file
Binary file not shown.
201
themes/yilia/source-src/css/fonts/iconfont.svg
Normal file
201
themes/yilia/source-src/css/fonts/iconfont.svg
Normal file
@ -0,0 +1,201 @@
|
||||
<?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>
|
||||
Created by FontForge 20120731 at Sun Jul 9 01:44:08 2017
|
||||
By admin
|
||||
</metadata>
|
||||
<defs>
|
||||
<font id="iconfont" horiz-adv-x="1024" >
|
||||
<font-face
|
||||
font-family="iconfont"
|
||||
font-weight="500"
|
||||
font-stretch="normal"
|
||||
units-per-em="1024"
|
||||
panose-1="2 0 6 3 0 0 0 0 0 0"
|
||||
ascent="896"
|
||||
descent="-128"
|
||||
x-height="792"
|
||||
bbox="0 -212 1170 896.316"
|
||||
underline-thickness="0"
|
||||
underline-position="0"
|
||||
unicode-range="U+0078-E877"
|
||||
/>
|
||||
<missing-glyph
|
||||
/>
|
||||
<glyph glyph-name=".notdef"
|
||||
/>
|
||||
<glyph glyph-name=".notdef"
|
||||
/>
|
||||
<glyph glyph-name=".null" horiz-adv-x="0"
|
||||
/>
|
||||
<glyph glyph-name="nonmarkingreturn" horiz-adv-x="341"
|
||||
/>
|
||||
<glyph glyph-name="x" unicode="x" horiz-adv-x="1001"
|
||||
d="M281 543q-27 -1 -53 -1h-83q-18 0 -36.5 -6t-32.5 -18.5t-23 -32t-9 -45.5v-76h912v41q0 16 -0.5 30t-0.5 18q0 13 -5 29t-17 29.5t-31.5 22.5t-49.5 9h-133v-97h-438v97zM955 310v-52q0 -23 0.5 -52t0.5 -58t-10.5 -47.5t-26 -30t-33 -16t-31.5 -4.5q-14 -1 -29.5 -0.5
|
||||
t-29.5 0.5h-32l-45 128h-439l-44 -128h-29h-34q-20 0 -45 1q-25 0 -41 9.5t-25.5 23t-13.5 29.5t-4 30v167h911zM163 247q-12 0 -21 -8.5t-9 -21.5t9 -21.5t21 -8.5q13 0 22 8.5t9 21.5t-9 21.5t-22 8.5zM316 123q-8 -26 -14 -48q-5 -19 -10.5 -37t-7.5 -25t-3 -15t1 -14.5
|
||||
t9.5 -10.5t21.5 -4h37h67h81h80h64h36q23 0 34 12t2 38q-5 13 -9.5 30.5t-9.5 34.5q-5 19 -11 39h-368zM336 498v228q0 11 2.5 23t10 21.5t20.5 15.5t34 6h188q31 0 51.5 -14.5t20.5 -52.5v-227h-327z" />
|
||||
<glyph glyph-name="twitter" unicode=""
|
||||
d="M961 661q-16 -33 -65 -73q-19 -16 -20 -45q-18 -345 -308 -480q-246 -114 -496 25q-8 4 -8 10q105 -7 189 32q47 21 73 44q-26 6 -29 6q-91 21 -132 106q-6 10 -3.5 15t15.5 4q23 -2 52 2q-132 53 -138 186q6 -2 23.5 -8t30 -8.5t25.5 -2.5q-61 52 -73 115q-14 72 21 132
|
||||
q60 -66 112 -102q111 -75 251 -91q13 -2 17.5 1.5t3.5 17.5q-13 120 88 181q107 65 203 -6q41 -30 85 -10q5 2 65 28q-23 -62 -76 -98q21 0 54 9.5t38 10.5z" />
|
||||
<glyph glyph-name="facebook" unicode=""
|
||||
d="M721 834v-145q-12 1 -30.5 1.5t-54.5 -6.5t-48 -25q-7 -10 -8 -31.5t0 -55.5t1 -48h141q-23 -107 -29 -140h-113v-450h-196v221.5v226.5h-84v142h83v15q2 49 4 74.5t7.5 63t17 62.5t28.5 43q10 10 19 17.5t21.5 13t20.5 9t25.5 6t26.5 4t34 2t37 0.5h46h51z" />
|
||||
<glyph glyph-name="clock" unicode=""
|
||||
d="M512 768q159 0 271.5 -112.5t112.5 -271.5t-112.5 -271.5t-271.5 -112.5t-271.5 112.5t-112.5 271.5t112.5 271.5t271.5 112.5zM512 896q-139 0 -257 -68.5t-186.5 -186.5t-68.5 -257t68.5 -257t186.5 -186.5t257 -68.5t257 68.5t186.5 186.5t68.5 257t-68.5 257
|
||||
t-186.5 186.5t-257 68.5v0zM686 302l-110 109v229h-129v-256q0 -28 23 -48l125 -125z" />
|
||||
<glyph glyph-name="mail" unicode=""
|
||||
d="M51 441v-485h928v485l-464 -230zM51 644v-129l464 -230l464 230v129h-928z" />
|
||||
<glyph glyph-name="link" unicode=""
|
||||
d="M969 395l-94 -94q-44 -44 -104.5 -53.5t-113.5 16.5l218 218q18 19 18 45.5t-18 44.5l-91 91q-19 19 -45 19t-45 -19l-218 -218q-26 53 -16.5 113.5t53.5 104.5l94 94q56 57 136 57t136 -57l90 -90q57 -56 57 -135.5t-57 -136.5zM331.5 120q-18.5 19 -18.5 45.5t19 44.5
|
||||
l271 272q19 19 45.5 19t45.5 -19t19 -45.5t-19 -45.5l-272 -271q-18 -19 -45 -19t-45.5 19zM151 29l90 -90q19 -19 45.5 -19t45.5 19l218 218q26 -53 16 -114t-53 -104l-87 -95q-56 -56 -135.5 -56t-135.5 56l-99 99q-56 56 -56 135.5t56 135.5l95 87q43 43 104 53t114 -16
|
||||
l-218 -218q-19 -19 -19 -45.5t19 -45.5z" />
|
||||
<glyph glyph-name="search" unicode=""
|
||||
d="M996 -184q-28 -28 -68 -28t-68 28l-170 170q-111 -72 -241 -72q-92 0 -175 36t-143 96t-95.5 143t-35.5 174.5t35.5 174.5t95.5 143t143.5 95.5t174.5 35.5t174 -35.5t143 -95.5t96 -143t36 -175q0 -130 -72 -241l170 -170q28 -28 28 -68t-28 -68v0zM449 684
|
||||
q-87 0 -161 -43t-117 -117t-43 -161t43 -161t117 -116.5t161 -42.5t161 42.5t116.5 116.5t42.5 161t-42.5 161t-116.5 117t-161 43z" />
|
||||
<glyph glyph-name="smile" unicode=""
|
||||
d="M511 -64q-91 0 -174 35.5t-143 95.5t-95.5 143t-35.5 174t35.5 174t95.5 143t143 95.5t174 35.5t174 -35.5t143 -95.5t95.5 -143t35.5 -174t-35.5 -174t-95.5 -143t-143 -95.5t-174 -35.5zM511 768q-104 0 -192.5 -51.5t-140 -140t-51.5 -192.5t51.5 -192.5t140 -140
|
||||
t192.5 -51.5t192.5 51.5t140 140t51.5 192.5t-51.5 192.5t-140 140t-192.5 51.5zM512 123q-67 0 -126.5 29t-100.5 81q-8 11 -6.5 24t12 21t23.5 6.5t21 -11.5q33 -41 79 -63.5t98 -22.5q53 0 99.5 22.5t78.5 64.5q8 11 21 12.5t23.5 -6.5t12.5 -21t-7 -24
|
||||
q-41 -53 -100.5 -82.5t-127.5 -29.5zM368 381q-20 0 -34 14t-14 34v64q0 20 14 34t34 14t34 -14t14 -34v-64q0 -20 -14 -34t-34 -14zM656 381q-20 0 -34 14t-14 34v64q0 20 14 34t34 14t34 -14t14 -34v-64q0 -20 -14 -34t-34 -14z" />
|
||||
<glyph glyph-name="roundrightfill" unicode=""
|
||||
d="M512 832q-185 0 -316.5 -131.5t-131.5 -316.5t131.5 -316.5t316.5 -131.5t316.5 131.5t131.5 316.5t-131.5 316.5t-316.5 131.5zM662 360l-160 -158q-10 -10 -23 -10t-22.5 9.5t-9.5 23t10 22.5l137 136l-136 137q-10 9 -10 22.5t9.5 22.5t23 9t22.5 -9l159 -160v0v0
|
||||
q4 -4 7 -10v0q8 -20 -7 -35z" />
|
||||
<glyph glyph-name="list" unicode=""
|
||||
d="M896 640h-288q-13 0 -22.5 9.5t-9.5 22.5t9.5 22.5t22.5 9.5h288q13 0 22.5 -9.5t9.5 -22.5t-9.5 -22.5t-22.5 -9.5zM896 480h-288q-13 0 -22.5 9.5t-9.5 22.5t9.5 22.5t22.5 9.5h288q13 0 22.5 -9.5t9.5 -22.5t-9.5 -22.5t-22.5 -9.5zM896 224h-288q-13 0 -22.5 9.5
|
||||
t-9.5 22.5t9.5 22.5t22.5 9.5h288q13 0 22.5 -9.5t9.5 -22.5t-9.5 -22.5t-22.5 -9.5zM896 64h-288q-13 0 -22.5 9.5t-9.5 22.5t9.5 22.5t22.5 9.5h288q13 0 22.5 -9.5t9.5 -22.5t-9.5 -22.5t-22.5 -9.5zM384 416h-192q-40 0 -68 28t-28 68v192q0 40 28 68t68 28h192
|
||||
q40 0 68 -28t28 -68v-192q0 -40 -28 -68t-68 -28zM192 736q-13 0 -22.5 -9.5t-9.5 -22.5v-192q0 -13 9.5 -22.5t22.5 -9.5h192q13 0 22.5 9.5t9.5 22.5v192q0 13 -9.5 22.5t-22.5 9.5h-192zM384 -32h-192q-40 0 -68 28t-28 68v192q0 40 28 68t68 28h192q40 0 68 -28t28 -68
|
||||
v-192q0 -40 -28 -68t-68 -28zM192 288q-13 0 -22.5 -9.5t-9.5 -22.5v-192q0 -13 9.5 -22.5t22.5 -9.5h192q13 0 22.5 9.5t9.5 22.5v192q0 13 -9.5 22.5t-22.5 9.5h-192z" />
|
||||
<glyph glyph-name="book" unicode=""
|
||||
d="M289 2v798h612h6q11 0 19 -7.5t8 -18.5v-745q0 -11 -8 -19t-19 -8v0h-6h-612v0zM907 -200q11 0 19 7.5t8 18.5v100q0 10 -8 18t-19 8t-18.5 -8t-7.5 -18v-73h-592v-53h618zM218 -147q-30 0 -51.5 20.5t-23.5 50.5l0.5 1l0.5 1v6q1 29 22.5 49.5t51.5 20.5h18v798h-18
|
||||
q-53 0 -90 -37.5t-37 -89.5v-2v-1q-1 -655 0 -738q0 -1 -0.5 -2.5t-0.5 -2.5q0 -50 35 -86.5t85 -40.5h4h22v53h-18z" />
|
||||
<glyph glyph-name="home" unicode=""
|
||||
d="M982 492l-409 320q-26 21 -62 21t-62 -21l-406 -321q-10 -8 -11.5 -21t6.5 -23.5t21 -12t24 6.5l13 11v-388q0 -40 34 -68t74 -28h640q38 0 61 26.5t23 69.5v389l14 -12q9 -7 20 -7q16 0 25 13q9 10 7 23t-12 22zM608 99v-67h-192v179q0 31 25 54t71 23t71 -23t25 -54
|
||||
v-112z" />
|
||||
<glyph glyph-name="share" unicode=""
|
||||
d="M0 812v0v0zM864 108q-68 0 -115 -49l-431 216q2 12 2 25t-2 25l431 216q47 -49 115 -49q66 0 113 47t47 113t-47 113t-113 47t-113 -47t-47 -113q0 -13 2 -25l-431 -216q-47 49 -115 49q-66 0 -113 -47t-47 -113t47 -113t113 -47q68 0 115 49l431 -216q-2 -12 -2 -25
|
||||
q0 -66 47 -113t113 -47t113 47t47 113t-47 113t-113 47z" />
|
||||
<glyph glyph-name="back" unicode=""
|
||||
d="M321 248q-25 0 -40 19q-14 17 -12 38t19 35l327 267q16 14 37.5 12t35 -19t11.5 -38t-19 -35l-327 -267q-14 -12 -32 -12zM647 -19q-18 0 -32 12l-327 267q-17 14 -19 35t11.5 37.5t35 19t37.5 -11.5l327 -267q17 -14 19 -35t-12 -38q-15 -19 -40 -19z" />
|
||||
<glyph glyph-name="qq" unicode=""
|
||||
d="M200 344l-2 6l-1 6l-1 4v5v5v5l1 6l2 7l2 6l3 8l4 8l5 7v6l1 5l1 7l2 7l2 9l2 4l2 3l2 4l3 3v5v7v7l2 10l1 11l3 14l4 14l3 8l3 9l3 8l4 8l4 9l4 9l6 9l6 10l3 5l3 4l7 10l7 10l8 10l8 10l10 10l9 10l12 10l7 7l9 7l10 6l10 6l9 5l11 5l11 5l12 4l11 4l12 4l12 2l13 3
|
||||
l13 2l13 2l13 1l14 1h13h13h14l14 -1l13 -2l14 -2l13 -3l13 -3l13 -3l14 -4l13 -4l12 -5l13 -6l12 -6l12 -6l11 -8l10 -6l4 -4l5 -3l9 -8l8 -7l7 -8l8 -8l6 -9l7 -8l5 -9l5 -8l6 -10l4 -8l8 -17l4 -9l3 -9l3 -9l2 -8l2 -8l2 -8l5 -16l2 -13l2 -13l1 -10l3 -16v-3l2 -3l5 -8
|
||||
l3 -6l3 -5l4 -7l3 -7l2 -8l3 -8l1 -9l1 -4l1 -5v-5l-1 -4v-6l-1 -5l-3 -11l-2 -5l-2 -6v-2l1 -1l2 -5l12 -17l10 -14l4 -9l6 -9l6 -11l6 -11l6 -13l7 -15l4 -8l3 -9l3 -9l3 -8l3 -9l2 -8l3 -16l2 -16l2 -14v-8v-7v-6l-1 -7l-2 -12l-2 -11l-3 -10l-1 -5l-3 -4l-2 -4l-2 -4
|
||||
l-3 -3l-2 -3l-3 -3l-3 -2l-3 -2l-3 -1l-2 -1h-2h-2l-2 1l-5 2l-2 1l-2 2l-3 2l-2 3l-4 4l-5 6l-3 6l-4 6l-4 6l-5 10l-5 11l-1 1h-1l-2 -2l-2 -3l-2 -4l-4 -10l-6 -16l-7 -18l-6 -9l-6 -10l-7 -10l-7 -11l-4 -5l-5 -5l-10 -10l1 -1l1 -2l5 -3l23 -10l9 -6l9 -5l10 -7l8 -7
|
||||
l4 -3l3 -3l3 -5l2 -4l1 -4l2 -4l1 -4l1 -5l-1 -3v-3l-1 -3l-2 -3v-2l-2 -3l-4 -5l-3 -5l-3 -3l-3 -2l-6 -5l-7 -4l-7 -4l-8 -3l-9 -3l-5 -2l-4 -1l-10 -3l-11 -2l-10 -2l-12 -2h-12l-12 -2h-12h-13h-13l-14 1l-12 1l-14 2l-14 1l-14 2l-14 4l-13 3l-14 3l-14 5l-13 4l-7 3
|
||||
l-7 2l-4 2h-4h-5h-6l-13 1l-7 1l-8 1l-6 -5l-7 -5l-10 -5l-11 -6l-7 -3l-7 -3l-16 -6l-8 -2l-9 -3l-13 -2l-7 -1h-8l-9 -1l-10 -1h-9h-10h-22l-22 1l-23 2l-11 2l-11 1l-10 2l-11 2l-10 3l-10 2l-9 4l-8 3l-8 4l-7 4l-6 5l-3 2l-3 3l-2 3l-2 3l-2 3l-1 3l-2 6l-1 3l-1 4v3
|
||||
l1 4v3l1 4v2v6v4l2 4l1 5l3 5l2 2l1 3l5 5l3 2l3 2l3 3l5 1l3 2l5 3l5 1l6 2l6 1l6 1l6 1l8 1h2v0l1 1v1l-1 2l-4 2l-10 8l-7 6l-7 6l-8 8l-8 10l-10 10l-3 6l-5 6l-4 7l-3 8l-5 7l-3 9l-4 8l-4 9l-2 9l-3 11l-1 1h-1v1h-1l-1 -1l-1 -1l-1 -2l-1 -2l-1 -2l-1 -3l-5 -8l-2 -5
|
||||
l-4 -4l-4 -5l-4 -6l-5 -5l-5 -5l-5 -5l-6 -3l-6 -4l-6 -2l-7 -2l-6 -1h-1h-1l-1 1l-2 2l-2 2l-2 6l-2 4l-2 4l-1 6l-1 5l-2 11l-1 7v7v15l1 17l1 8l2 9l1 10l3 8l3 10l3 10l4 10l3 10l6 10l4 10l6 10l7 11l7 10l7 11l7 7l7 9l9 8l3 4l5 5l7 6l7 6l11 10l9 6z" />
|
||||
<glyph glyph-name="weibo" unicode=""
|
||||
d="M730 320l15 35q29 92 -54 107q-67 12 -205 -33q34 29 33 73t-30 65q-30 19 -69 18.5t-84 -22.5t-90 -54.5t-86 -76.5t-72.5 -89.5t-50.5 -93t-19 -86.5q0 -44 24.5 -89t71 -84t126.5 -64t180 -25q101 0 183 21t132.5 53t85 71.5t48 75t13.5 65.5q0 37 -15.5 64t-38 39.5
|
||||
t-44.5 20t-38 8.5zM432 -49.5q-123 -11.5 -215.5 39.5t-100 134.5t73.5 150.5t204 78.5t215.5 -39.5t100.5 -134.5t-73.5 -150.5t-204.5 -78.5zM374 273q-67 -11 -107 -59.5t-30.5 -105.5t63.5 -89.5t120.5 -21t107 60t30.5 105.5t-63.5 89t-120.5 21zM358.5 56
|
||||
q-21.5 -6 -40.5 4t-24.5 29.5t6 37.5t33 24t40.5 -3.5t24.5 -29.5t-6 -38t-33 -24zM433 141q-11 0 -19 7.5t-8 18.5t8 19t19 8t19 -8t8 -19t-8 -18.5t-19 -7.5zM951 604q-44 57 -113 80.5t-153 11.5q-14 -2 -23 -13.5t-7 -25.5t13.5 -22.5t26.5 -6.5q134 19 201 -66
|
||||
q30 -39 38 -89t-10 -93q-5 -13 0.5 -26t18.5 -19q7 -2 13 -2q24 0 32 21q25 60 14.5 129t-51.5 121zM718 570q-14 -2 -22.5 -13.5t-6.5 -25.5t13.5 -22.5t25.5 -6.5q49 7 72 -22q10 -13 12.5 -30t-3.5 -32q-5 -13 0.5 -26t18.5 -19q7 -2 13 -2q24 0 33 21q12 32 7 67.5
|
||||
t-27 62.5q-47 61 -136 48z" />
|
||||
<glyph glyph-name="segmentfault" unicode=""
|
||||
d="M123 145q71 -64 144 -64q32 0 56 15t24 46q0 14 -6 24.5t-19.5 19t-25.5 14t-35 14t-37 14.5q-65 28 -99.5 64t-34.5 100q0 87 61 130t158 43q113 0 188 -48v-14l-48 -93q-55 41 -127 41q-33 0 -52 -13.5t-19 -38.5q0 -11 5 -20t11 -15t19 -12.5t22.5 -10t29 -10.5
|
||||
t30.5 -11q74 -28 109 -64t35 -103q0 -90 -62.5 -135t-165.5 -45q-119 0 -211 70v14zM656 -26q0 113 3 450q-32 -1 -75 -1l1 121q42 0 73 -1q0 3 -1 54.5t-1 53.5q0 96 49.5 140.5t132.5 44.5q72 0 135 -26v-18l-35 -96q-29 17 -60 17q-27 0 -41 -17.5t-14 -62.5
|
||||
q0 -13 1 -51.5l1 -38.5q35 1 113 1l-1 -121q-78 0 -114 1q3 -112 3 -450h-170v0z" />
|
||||
<glyph glyph-name="sort" unicode=""
|
||||
d="M384 576h512q13 0 22.5 9.5t9.5 22.5t-9.5 22.5t-22.5 9.5h-512q-13 0 -22.5 -9.5t-9.5 -22.5t9.5 -22.5t22.5 -9.5zM896 416h-512q-13 0 -22.5 -9.5t-9.5 -22.5t9.5 -22.5t22.5 -9.5h512q13 0 22.5 9.5t9.5 22.5t-9.5 22.5t-22.5 9.5zM896 192h-512q-13 0 -22.5 -9.5
|
||||
t-9.5 -22.5t9.5 -22.5t22.5 -9.5h512q13 0 22.5 9.5t9.5 22.5t-9.5 22.5t-22.5 9.5zM192 608zM128 608q0 26 19 45t45 19t45 -19t19 -45t-19 -45t-45 -19t-45 19t-19 45zM192 384zM128 384q0 26 19 45t45 19t45 -19t19 -45t-19 -45t-45 -19t-45 19t-19 45zM192 160zM128 160
|
||||
q0 26 19 45t45 19t45 -19t19 -45t-19 -45t-45 -19t-45 19t-19 45z" />
|
||||
<glyph glyph-name="jianshu" unicode=""
|
||||
d="M282 883l93 -61q8 -7 -3 -14q-18 -8 -40 -29l-14 -18l122 7l46 50l65 -53l3 -7q-3 -4 -7 -4l-157 -7q46 -29 46 -61q-3 -29 -32 -36q-29 -3 -29 15q-3 60 -18 78l-60 -3q-86 -79 -183 -161q-7 -8 -7 7q122 154 175 297zM293 482l-7 -354q-4 -50 -54 -104q-14 -11 -18 0
|
||||
l8 261v143l-4 129l82 -32q4 0 7 -4l-3 -7zM325 654q104 -32 104 -57q-7 -43 -32 -58q-18 -10 -29 11q-28 79 -50 97q-3 10 7 7zM433 228q-11 -32 -40 -54q-14 -10 -18 8v236v71q-1 6 0.5 6.5t7.5 -2.5l50 -32l164 7l29 39l71 -39q4 0 4 -7l-22 -33l4 -153q-4 -36 -43 -86
|
||||
q-18 -15 -28 0q-4 10 -15 25q-7 14 -11 21zM601 450l-172 -4v-89l147 7q7 0 7 -7t-11 -7l-143 -7l4 -101l168 8v200zM615 564q-68 0 -111 -10l-25 25l279 14l36 39l75 -46q0 -4 4 -4q3 -3 -4 -7l-29 -36l4 -204l4 -143q7 -100 -108 -175q-7 -4 -10.5 0t0.5 11q-4 50 -36 75
|
||||
q-4 3 -4 7t4 4q37 -2 54 7t14 28l-4 422zM615 890l90 -54q7 -3 -4 -11q-22 -7 -36 -28q-3 -4 -7 -11q-7 -11 -14 -18l154 7l46 50l64 -53q8 -7 0 -7l-196 -11q71 -39 71 -72q-7 -32 -43 -50q-28 -3 -28 18q-4 75 -25 104l-58 -4q-10 -10 -32 -35q-43 -54 -75 -86
|
||||
q-7 -4 -10.5 -4t-0.5 7q72 151 104 258z" />
|
||||
<glyph glyph-name="circle-left" unicode=""
|
||||
d="M512 -64q-185 0 -316.5 131.5t-131.5 316.5t131.5 316.5t316.5 131.5t316.5 -131.5t131.5 -316.5t-131.5 -316.5t-316.5 -131.5zM512 768q-159 0 -271.5 -112.5t-112.5 -271.5t112.5 -271.5t271.5 -112.5t271.5 112.5t112.5 271.5t-112.5 271.5t-271.5 112.5zM290 372
|
||||
l1 -1q2 -6 6 -10v0v0l159 -159q10 -10 23 -10t22.5 9.5t9.5 22.5t-9 23l-104 103h305q14 0 23 9.5t9 23t-9 22.5t-23 9h-306l106 105q9 10 9 23t-9 22.5t-23 9.5q-13 0 -22 -9l-161 -159q-15 -15 -7 -34z" />
|
||||
<glyph glyph-name="circle-right" unicode=""
|
||||
d="M512 -64q-185 0 -316.5 131.5t-131.5 316.5t131.5 316.5t316.5 131.5t316.5 -131.5t131.5 -316.5t-131.5 -316.5t-316.5 -131.5zM512 768q-159 0 -271.5 -112.5t-112.5 -271.5t112.5 -271.5t271.5 -112.5t271.5 112.5t112.5 271.5t-112.5 271.5t-271.5 112.5zM733 395v0
|
||||
q-3 6 -7 10v0v0l-159 160q-9 9 -22.5 9t-23 -9t-9.5 -22.5t10 -22.5l103 -104h-305q-13 0 -22.5 -9.5t-9.5 -22.5t9.5 -22.5t22.5 -9.5h307l-106 -105q-10 -9 -10 -22.5t9.5 -23t22.5 -9.5t23 10l160 158q15 15 7 35z" />
|
||||
<glyph glyph-name="loading" unicode=""
|
||||
d="M384 768q0 53 37.5 90.5t90.5 37.5t90.5 -37.5t37.5 -90.5t-37.5 -90.5t-90.5 -37.5t-90.5 37.5t-37.5 90.5zM656 656q0 53 37.5 90.5t90.5 37.5t90.5 -37.5t37.5 -90.5t-37.5 -90.5t-90.5 -37.5t-90.5 37.5t-37.5 90.5zM832 384q0 27 18.5 45.5t45.5 18.5t45.5 -18.5
|
||||
t18.5 -45.5t-18.5 -45.5t-45.5 -18.5t-45.5 18.5t-18.5 45.5zM720 112.5q0 26.5 18.5 45t45 18.5t45.5 -18.5t19 -45t-19 -45.5t-45.5 -19t-45 19t-18.5 45.5zM448 0v0q0 27 18.5 45.5t45.5 18.5t45.5 -18.5t18.5 -45.5v0q0 -27 -18.5 -45.5t-45.5 -18.5t-45.5 18.5
|
||||
t-18.5 45.5zM176 112v0q0 27 19 45.5t45.5 18.5t45 -18.5t18.5 -45.5v0q0 -26 -18.5 -45t-45 -19t-45.5 19t-19 45zM144 656v0q0 39 28.5 67.5t68 28.5t67.5 -28.5t28 -67.5v0q0 -40 -28 -68t-67.5 -28t-68 28t-28.5 68zM56 384q0 30 21 51t51 21t51 -21t21 -51t-21 -51
|
||||
t-51 -21t-51 21t-21 51z" />
|
||||
<glyph glyph-name="acfun" unicode="" horiz-adv-x="1092"
|
||||
d="M521 896l-521 -859l261 -165l53 185l414 31l107 -205l257 154zM415 254l98 217l111 -217h-209z" />
|
||||
<glyph glyph-name="close" unicode=""
|
||||
d="M512 217l-321 -320l-82 82l320 321l-320 321l82 82l321 -320l321 320l82 -82l-320 -321l320 -321l-82 -82z" />
|
||||
<glyph glyph-name="tumblr" unicode=""
|
||||
d="M843 796h-662q-68 0 -116.5 -48.5t-48.5 -116.5v-662q0 -68 48.5 -116.5t116.5 -48.5h662q68 0 116.5 48.5t48.5 116.5v662q0 68 -48.5 116.5t-116.5 48.5zM725 -3q-44 -21 -80 -29q-35 -8 -77 -8q-37 0 -73 12t-61.5 33.5t-35.5 46.5t-10 72v240h-93v97q53 17 77 37
|
||||
q29 25 46.5 59t23.5 87h98v-158h158v-122h-158v-176q0 -64 3 -74q7 -18 26 -29q23 -14 52 -14q52 0 104 34v-108v0z" />
|
||||
<glyph glyph-name="calendar" unicode=""
|
||||
d="M870 763h-37v-182q0 -29 -20.5 -49.5t-49.5 -20.5t-49.5 20.5t-20.5 49.5v182h-361v-181q0 -29 -20.5 -49.5t-49.5 -20.5t-49.5 20.5t-20.5 49.5v181h-38q-37 0 -63.5 -26.5t-26.5 -63.5v-196h896v196q0 37 -26.5 63.5t-63.5 26.5zM315 601q0 -22 -15.5 -38t-37.5 -16v0
|
||||
q-22 0 -38 16t-16 38v176q0 23 16 38.5t38 15.5v0q22 0 37.5 -15.5t15.5 -38.5v-176zM818 601q0 -22 -15.5 -38t-38.5 -16v0q-22 0 -37.5 16t-15.5 38v176q0 23 15.5 38.5t37.5 15.5v0q23 0 38.5 -15.5t15.5 -38.5v-176zM908 439v-358q0 -38 -26.5 -64t-63.5 -26h-613
|
||||
q-37 0 -63 26t-26 64v258v93v7h-52v-412q0 -37 26.5 -63.5t63.5 -26.5h716q37 0 63.5 26.5t26.5 63.5v412h-52zM537 179h71q9 -41 42 -41q20 0 31 12t11 34q0 40 -42 41h-22v44h10q25 1 34.5 11t9.5 31q0 14 -9.5 22.5t-24.5 8.5q-13 0 -21 -4t-10.5 -8.5t-6.5 -15.5l-66 -1
|
||||
q23 77 106 78q101 -3 105 -82q0 -38 -45 -58q57 -19 57 -69q-4 -83 -117 -87q-47 0 -76 22t-37 62zM489 161v-62h-227v40q39 61 95 97q57 38 57 70q0 27 -34 27q-41 -1 -41 -36h-72q3 48 36.5 71t82.5 23q99 -4 106 -84q4 -57 -73 -105q-24 -14 -31.5 -19.5t-21.5 -21.5h123
|
||||
v0z" />
|
||||
<glyph glyph-name="rss" unicode=""
|
||||
d="M329 44q0 -46 -32 -78t-77.5 -32t-77.5 32t-32 78t32 78t77.5 32t77.5 -32t32 -78zM622 -26q1 -16 -10 -28q-10 -12 -27 -12h-77q-14 0 -24.5 9.5t-11.5 23.5q-13 131 -105.5 224t-223.5 106q-14 1 -23.5 11t-9.5 25v77q0 16 12 27q9 9 24 9h3q91 -7 174.5 -45.5
|
||||
t148.5 -103.5t103.5 -148.5t46.5 -174.5v0zM914 -27q1 -16 -10 -27q-10 -12 -26 -12h-82q-15 0 -25.5 10t-11.5 25q-6 122 -57 233t-132.5 192t-192 132t-233.5 59q-14 0 -24 10.5t-10 25.5v81q0 16 11 27q10 10 25 10h2q150 -8 286.5 -69t243.5 -168q106 -106 167.5 -243
|
||||
t68.5 -286v0z" />
|
||||
<glyph glyph-name="price-tags" unicode="" horiz-adv-x="1025"
|
||||
d="M256 640q0 30 -21.5 51.5t-51.5 21.5t-51.5 -21.5t-21.5 -51.5t21.5 -51.5t51.5 -21.5t51.5 21.5t21.5 51.5zM866 311q0 -30 -21 -52l-281 -281q-22 -21 -52 -21t-51 21l-409 409q-22 22 -37 58.5t-15 66.5v238q0 29 21.5 51t51.5 22h238q30 0 66.5 -15t58.5 -37
|
||||
l409 -408q21 -22 21 -52v0z" />
|
||||
<glyph glyph-name="quo-left" unicode=""
|
||||
d="M826 386h-128q0 79 56.5 135.5t135.5 56.5q27 0 45.5 18.5t18.5 45t-18.5 45.5t-45.5 19q-87 0 -160.5 -43t-116.5 -116.5t-43 -160.5v-256q0 -53 37.5 -90.5t90.5 -37.5h128q53 0 90.5 37.5t37.5 90.5v128q0 53 -37.5 90.5t-90.5 37.5zM378 578q27 0 45.5 18.5t18.5 45
|
||||
t-18.5 45.5t-45.5 19q-86 0 -160 -43t-117 -116.5t-43 -160.5v-256q0 -53 37.5 -90.5t90.5 -37.5h128q53 0 90.5 37.5t37.5 90.5v128q0 53 -37.5 90.5t-90.5 37.5h-128q0 79 56.5 135.5t135.5 56.5z" />
|
||||
<glyph glyph-name="quo-right" unicode=""
|
||||
d="M352 736h-128q-53 0 -90.5 -37.5t-37.5 -90.5v-128q0 -53 37.5 -90.5t90.5 -37.5h128q0 -79 -56 -135.5t-136 -56.5q-27 0 -45.5 -18.5t-18.5 -45.5t18.5 -45.5t45.5 -18.5q133 0 226.5 93.5t93.5 226.5v256q0 53 -37.5 90.5t-90.5 37.5zM864 736h-128q-53 0 -90.5 -37.5
|
||||
t-37.5 -90.5v-128q0 -53 37.5 -90.5t90.5 -37.5h128q0 -79 -56.5 -135.5t-135.5 -56.5q-27 0 -45.5 -18.5t-18.5 -45.5t18.5 -45.5t45.5 -18.5q133 0 226.5 93.5t93.5 226.5v256q0 53 -37.5 90.5t-90.5 37.5z" />
|
||||
<glyph glyph-name="back1" unicode=""
|
||||
d="M222 245q10 -13 25 -21l7 -6q17 -14 41 -14t41 14q24 21 14 49q3 11 3 20v55h331q71 0 121 -45.5t50 -109.5q0 -48 -29.5 -86.5t-76.5 -56.5l5 -4q-4 -6 -4 -12q0 -11 9 -19t21 -8q21 0 29 18q69 29 110.5 84.5t41.5 122.5q0 96 -80.5 163.5t-194.5 67.5h-333v54
|
||||
q0 9 -3 19q12 30 -14 51q-17 14 -41 14t-41 -14l-9 -8q-12 -7 -20 -17l-131 -112q-9 -4 -14 -8q-18 -15 -17 -37q-1 -21 17 -36q5 -5 14 -9l128 -109v0zM208 403v-7l-4 3l4 4v0zM208 403z" />
|
||||
<glyph glyph-name="github" unicode=""
|
||||
d="M1 371q0 -165 95.5 -297.5t246.5 -184.5q6 -2 10 -2t6.5 1.5t4 3t2 5t0.5 5.5v6.5v5.5v88q-37 -4 -66 0.5t-45 14t-28.5 23.5t-17.5 25.5t-9 23.5t-6 15q-8 14 -26 27t-27 20.5t-2 14.5q50 26 113 -66q34 -51 118 -30q10 40 40 70q-115 20 -171.5 85t-55.5 158
|
||||
q0 87 55 150q-22 66 5 137q30 3 66 -10.5t50 -23t25 -18.5q58 16 129 16q70 0 129 -16q13 10 28.5 19.5t49 21.5t61.5 9q26 -71 6 -134q56 -64 56 -152q0 -92 -56.5 -157t-172.5 -86q44 -42 44 -104v-128v-3l1.5 -9t4.5 -6t11 -3q154 52 251 185t97 300q0 104 -40.5 198.5
|
||||
t-109 162.5t-163 108.5t-198.5 40.5t-198.5 -40t-163 -108.5t-109 -163t-40.5 -198.5z" />
|
||||
<glyph glyph-name="film" unicode=""
|
||||
d="M0 684v-768h1024v768h-1024zM192 -20h-128v128h128v-128zM192 236h-128v128h128v-128zM192 492h-128v128h128v-128zM768 -20h-512v640h512v-640zM960 -20h-128v128h128v-128zM960 236h-128v128h128v-128zM960 492h-128v128h128v-128zM384 492v-384l256 192z" />
|
||||
<glyph glyph-name="weixin" unicode="" horiz-adv-x="1171"
|
||||
d="M331 633q0 23 -14 37.5t-38 14.5t-43 -15t-19 -37q0 -23 19 -37.5t43 -14.5t38 14t14 38v0zM756 343q0 16 -14.5 28.5t-37.5 12.5q-15 0 -28 -13t-13 -28q0 -16 13 -29t28 -13q23 0 37.5 12.5t14.5 29.5zM621 633q0 23 -14 37.5t-37 14.5q-25 0 -44 -15t-19 -37
|
||||
q0 -23 19 -37.5t44 -14.5q23 0 37 14t14 38v0zM984 343q0 16 -15 28.5t-37 12.5q-15 0 -28 -13t-13 -28q0 -16 13 -29t28 -13q22 0 37 12.5t15 29.5zM832 570q-18 2 -40 2q-97 0 -178 -44t-127.5 -119t-46.5 -164q0 -45 13 -87q-20 -2 -39 -2q-15 0 -28.5 1t-31 3.5t-25.5 4
|
||||
t-31.5 6t-28.5 6.5l-144 -73l41 125q-166 116 -166 280q0 96 55.5 177t151 128t207.5 47q101 0 190.5 -38t149.5 -104.5t78 -148.5v0zM1170 249q0 -67 -39 -127.5t-106 -110.5l32 -104l-114 63q-86 -21 -125 -21q-96 0 -177 40t-128 109t-47 151t46.5 151t128 109.5
|
||||
t177.5 40.5q92 0 173.5 -40.5t130 -110t48.5 -150.5v0z" />
|
||||
<glyph glyph-name="qzone" unicode="" horiz-adv-x="1117"
|
||||
d="M813 258q12 -36 28 -85q-210 20 -362 47q-1 5 24 26.5t63.5 50t83 62t82.5 62t62.5 48.5t22.5 24q-86 14 -173.5 19.5t-150.5 3t-113 -7.5t-76 -10l-25 -5l375 -52q-354 -237 -359 -259q182 -33 550 -22q83 -258 53 -272q-20 -9 -63.5 7t-92.5 45t-95.5 59.5t-76.5 52.5
|
||||
t-30 23q-3 -3 -9.5 -7.5t-26 -18.5t-38.5 -27t-45.5 -31t-50.5 -32.5t-49 -29t-44.5 -24t-35.5 -14t-23 -0.5q-19 9 -23.5 50.5t3 94t18 103t19.5 85t10 34.5q-4 3 -9.5 7.5t-23 19t-34.5 29t-39.5 34.5t-42 38.5t-39 38.5t-32.5 36.5t-20 30.5t-4 23q6 23 109 40t185 23
|
||||
t99 6q5 12 12 32.5t28.5 72.5t40.5 92.5t41.5 75.5t38.5 39q24 5 66 -69t72.5 -147t30.5 -77q4 0 12 -1t32.5 -4l49 -6t57.5 -8t62 -9.5t59 -10t52.5 -11t38 -11t19.5 -10.5q19 -24 -199 -199q-60 -49 -94 -75zM951 164q-42 -2 -106 -4q0 3 -1.5 7t-2.5 6z" />
|
||||
<glyph glyph-name="category" unicode=""
|
||||
d="M970 -35h-941q-13 0 -21 8v0q-8 9 -8 22t8 21v0q8 9 21 9h941q20 0 27 -18q2 -6 2 -12.5t-2 -11.5q-7 -18 -27 -18zM704 193h-675q-12 0 -21 8v0q-8 9 -8 22t8 21v0q8 9 21 9h675q20 0 27 -18q2 -6 2 -12t-2 -12q-7 -18 -27 -18zM27 495h416q11 0 19 -9v0q7 -9 7 -21
|
||||
t-7 -20v-1q-8 -9 -19 -9h-416q-11 0 -19 9l-1 1q-7 8 -7 20t7 21h1q7 9 19 9zM27 714h416q11 0 19 -9v0q7 -9 7 -21t-7 -20v0q-8 -10 -19 -10h-416q-12 0 -19 10h-1q-7 8 -7 20t7 21h1q7 9 19 9zM698 802q14 1 29 1q93 0 159 -66t66 -159q0 -21 -4 -41h-55q5 20 5 41
|
||||
q0 71 -50 121.5t-121 50.5q-15 0 -29 -3v55v0zM859 396l161 -277q2 -4 3 -7v0q1 -4 1 -8v0q0 -12 -9 -21t-22 -9q-8 0 -14.5 4t-10.5 11v0l-162 278l-10 -4l1 1q-34 -11 -70 -11q-94 0 -159.5 66t-65.5 159t66 159q54 55 130 65v-55q-54 -9 -92 -48q-51 -50 -51 -121
|
||||
t50.5 -121t121.5 -50t121 50q34 34 45 80h55q-13 -69 -62 -118q-13 -13 -27 -23z" />
|
||||
<glyph glyph-name="douban" unicode=""
|
||||
d="M823 822h-621q-56 0 -95.5 -40t-39.5 -96v-621q0 -56 39.5 -95.5t95.5 -39.5h621q56 0 96 39.5t40 95.5v621q0 56 -40 96t-96 40zM230 689h587v-71h-587v71zM770 571v-281h-493v281h493zM841 78h-634v71h185q-6 16 -14.5 33t-13 24t-20 30t-17.5 26l65 26q25 -37 69 -139
|
||||
h124q45 86 64 139l71 -26q-40 -91 -60 -113h181v-71zM348 501h352v-141h-352v141z" />
|
||||
<glyph glyph-name="roundleftfill" unicode=""
|
||||
d="M512 832q-185 0 -316.5 -131.5t-131.5 -316.5t131.5 -316.5t316.5 -131.5t316.5 131.5t131.5 316.5t-131.5 316.5t-316.5 131.5zM566 248q10 -9 10 -22.5t-9.5 -22.5t-23 -9t-22.5 9l-159 160v0v0q-3 3 -6 8q0 1 -0.5 1.5l-0.5 0.5q-8 20 7 35l160 158q10 10 23 10
|
||||
t22.5 -9.5t9.5 -23t-10 -22.5l-137 -136z" />
|
||||
<glyph glyph-name="tuding" unicode=""
|
||||
d="M949 -7l-223 223l206 207q11 11 10 26t-13 25q-72 58 -163 74t-175 -12l-215 170q2 60 -30 110q-9 13 -25 14.5t-27 -9.5l-219 -219q-11 -11 -9.5 -27t14.5 -24q50 -33 111 -31l170 -215q-29 -84 -12.5 -175.5t74.5 -163.5q10 -12 25 -13t26 10l206 207l223 -223
|
||||
q10 -10 23.5 -10t23 9.5t9.5 23t-10 23.5z" />
|
||||
<glyph glyph-name="zhihu" unicode=""
|
||||
d="M504 405h-147v224h130q16 0 27 11t11 26.5t-11 27t-27 11.5h-248q6 28 10 73v3q1 11 2 16q1 16 -8.5 28t-25.5 14t-28.5 -8t-13.5 -26q-1 -6 -2 -20v-1q-3 -29 -6 -46t-12.5 -46.5t-30.5 -58t-53 -58.5q-12 -11 -12.5 -26.5t10.5 -27.5t28 -12q15 0 26 10q57 52 88 110h2
|
||||
h68v-224h-175q-16 0 -27 -11t-11 -27t11 -27t27 -11h173q-14 -234 -190 -322q-14 -7 -19 -22t2 -29q11 -21 34 -21q10 0 18 4q156 78 208 250q3 -8 8 -15l121 -143q12 -14 30 -14q13 0 24 9q12 10 13.5 26t-8.5 28l-121 143q-10 12 -26 13.5t-28 -8.5l-3 -3q11 49 14 104
|
||||
h148q15 0 26.5 11t11.5 27t-11.5 27t-26.5 11zM922 712h-299q-16 0 -27 -11t-11 -27v-553q0 -15 11 -26.5t27 -11.5h23l5 -93v-1q2 -22 23 -31q7 -3 15 -3q14 0 24 8l1 1l120 119h88q16 0 27.5 11.5t11.5 26.5v553q0 16 -11.5 27t-27.5 11zM681 159h-19v477h222v-477h-64
|
||||
q-14 0 -24 -8l-1 -1l-73 -76l-3 50v1q-1 15 -12 24.5t-26 9.5z" />
|
||||
<glyph glyph-name="linkedin" unicode=""
|
||||
d="M259 -60h-191v637h191v-637v0zM958 -60h-192v338q0 132 -93 132q-74 0 -95 -73v-397h-192q3 572 0 637h161v-127h2q66 107 189 107q105 0 158 -65q62 -71 62 -192v-360zM262 734q0 -40 -29 -67.5t-69.5 -27.5t-69.5 27.5t-29 67.5t29 68t69.5 28t69.5 -28t29 -68v0v0z
|
||||
" />
|
||||
<glyph glyph-name="google" unicode=""
|
||||
d="M626 825h-260q-97 0 -169 -61.5t-72 -142.5q0 -84 53 -140t143 -56q10 0 25 1q-14 -26 -14 -50q0 -21 9 -35t29 -33q-8 0 -23.5 -0.5t-23.5 -0.5q-109 0 -183 -62.5t-74 -140.5q0 -72 80.5 -116t197.5 -44q124 0 201 59t77 137q0 61 -20 98t-81 83q-2 2 -6 5
|
||||
q-70 52 -70 75q0 22 10 37.5t42 40.5q77 60 77 139q0 48 -19.5 87t-54.5 60h68zM538 157q3 -14 3 -28q0 -64 -47 -102.5t-150 -38.5q-77 0 -128.5 42.5t-51.5 102.5q0 59 57.5 102t135.5 42q35 -1 67 -11q8 -5 27 -18t26 -18t20.5 -16t19.5 -18t12 -17.5t9 -21.5zM371 465
|
||||
q-54 2 -97 46t-51 112q-10 69 21 115.5t83 44.5q52 -1 92.5 -50t49.5 -119q9 -69 -18 -110t-80 -39zM838 706v119h-59v-119h-120v-60h120v-120h59v120h120v60h-120z" />
|
||||
<glyph glyph-name="plane" unicode=""
|
||||
d="M496 855l-361 -929q-3 -8 2.5 -15.5t15.5 -7.5l327 30l32 761l32 -761l327 -30q10 -1 16 7q3 4 3 10q0 4 -1 7l-361 929q-4 11 -16 11q-12 -1 -16 -12z" />
|
||||
<glyph glyph-name="bilibili" unicode="" horiz-adv-x="1130"
|
||||
d="M275 844q-13 -13 -18 -25q-3 -9 5.5 -35t14 -26t17 -12.5t11.5 -17.5q0 -12 -12 -19t-33 -7q-25 0 -66 -16t-58 -33q-17 -15 -37 -54l-20 -39v-453l20 -39q18 -34 32 -48.5t48 -33.5l34 -18l702 -4l40 19q37 18 56.5 37t35.5 55l18 36v223v223l-17 35q-16 35 -41 58
|
||||
q-22 22 -57 37t-61 15q-39 0 -46 15.5t21 40.5q14 14 18 21.5t4 22.5q0 24 -16.5 40.5t-28.5 16.5q-8 0 -21 -5.5t-18 -10.5q-15 -16 -73 -72l-70 -69l-81 1q-79 0 -90 4q-11 5 -70 63q-40 39 -60 57t-36.5 27t-25.5 5.5t-21 -15.5zM904 591q11 -1 31 -19l21 -19l1 -209
|
||||
q1 -144 0 -179.5t-8 -48.5q-21 -38 -63 -40q-25 -1 -340 0l-315 1l-43 43v426l20 22q19 22 40 24q12 1 317.5 0.5t338.5 -1.5zM347 429q-14 -16 -17 -25t-3 -40q0 -29 2.5 -38t15.5 -23q40 -47 81 2q8 9 10.5 20t2.5 42q0 34 -2.5 42.5t-16.5 22.5q-20 20 -36.5 19.5
|
||||
t-36.5 -22.5zM726 432q-14 -14 -16.5 -23t-2.5 -43q0 -35 2.5 -44t15.5 -21q18 -17 29 -20t27 6q40 23 36 88q-2 25 -5 34.5t-16 22.5q-18 19 -34.5 19t-35.5 -19z" />
|
||||
<glyph glyph-name="psp" unicode=""
|
||||
d="M263 627q42 0 79 -19.5t62 -52.5h217q24 32 60 50t78 18q72 0 123.5 -51.5t51.5 -123.5q0 -29 -9 -55q39 -140 32 -303q-21 -22 -46 -33.5t-41.5 -14.5t-46.5 -5q-79 96 -151 254q-24 9 -41 37h-239q-17 -27 -42 -36q-72 -157 -152 -255q-30 2 -46 5t-41.5 14.5
|
||||
t-46.5 33.5q-6 165 33 305q-9 27 -9 57q0 72 51 123.5t124 51.5zM433 465v-39h65v39h-65zM776 433q-14 -3 -22 -15t-5 -26.5t15.5 -22t26.5 -4.5t22 15t5 26.5t-15.5 22t-26.5 4.5zM694 489q-14 -3 -22 -15t-5 -26.5t15.5 -22.5t26.5 -4.5t22 15.5t5 26.5t-15.5 22
|
||||
t-26.5 4.5zM744 569q-14 -3 -22 -15.5t-5 -26.5t15.5 -22t26.5 -4.5t22 15.5t5 26t-15.5 22t-26.5 5zM826 521q-14 -3 -22 -15t-4.5 -26.5t15.5 -22t26 -4.5t22 15t5 26.5t-15.5 22t-26.5 4.5zM346 509l-58 -46l45 -59zM294 377l-46 59l-59 -46zM161 435l54 42l-42 54z
|
||||
M215 560l42 -54l53 42zM519 465v-39h65v39h-65zM880 701q-86 42 -186 0v-51q32 13 66 13q69 0 120 -47v85zM131 701v-85q51 47 120 47q34 0 66 -13v51q-100 43 -186 0z" />
|
||||
</font>
|
||||
</defs></svg>
|
||||
|
After Width: | Height: | Size: 27 KiB |
BIN
themes/yilia/source-src/css/fonts/iconfont.ttf
Normal file
BIN
themes/yilia/source-src/css/fonts/iconfont.ttf
Normal file
Binary file not shown.
BIN
themes/yilia/source-src/css/fonts/iconfont.woff
Normal file
BIN
themes/yilia/source-src/css/fonts/iconfont.woff
Normal file
Binary file not shown.
19
themes/yilia/source-src/css/footer.scss
Normal file
19
themes/yilia/source-src/css/footer.scss
Normal file
@ -0,0 +1,19 @@
|
||||
#footer {
|
||||
font-size: 12px;
|
||||
font-family: Menlo, Monaco, "Andale Mono", "lucida console", "Courier New", monospace;
|
||||
text-shadow: 0 1px #fff;
|
||||
position: absolute;
|
||||
bottom: 30px;
|
||||
opacity: 0.6;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
.outer{
|
||||
padding: 0 30px;
|
||||
}
|
||||
}
|
||||
.footer-left{
|
||||
float: left;
|
||||
}
|
||||
.footer-right{
|
||||
float: right;
|
||||
}
|
||||
1
themes/yilia/source-src/css/global.scss
Normal file
1
themes/yilia/source-src/css/global.scss
Normal file
@ -0,0 +1 @@
|
||||
@import "core";
|
||||
56
themes/yilia/source-src/css/grid.scss
Normal file
56
themes/yilia/source-src/css/grid.scss
Normal file
@ -0,0 +1,56 @@
|
||||
body, button, input, select, textarea {
|
||||
color: #1a1a1a;
|
||||
font-family: "lucida grande", "lucida sans unicode", lucida, helvetica, "Hiragino Sans GB", "Microsoft YaHei", "WenQuanYi Micro Hei", sans-serif;
|
||||
font-size: 16px;
|
||||
font-size: 1rem;
|
||||
line-height: 1.75;
|
||||
}
|
||||
body {
|
||||
overflow-y: hidden;
|
||||
background:#eaeaea;
|
||||
}
|
||||
html, body, #container {
|
||||
height: 100%;
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
}
|
||||
#mobile-nav {
|
||||
display: none;
|
||||
}
|
||||
#container{
|
||||
position:relative;
|
||||
min-height:100%;
|
||||
.anm-canvas {
|
||||
display: none;
|
||||
}
|
||||
&.show {
|
||||
.anm-canvas {
|
||||
display: block;
|
||||
position: fixed;
|
||||
}
|
||||
}
|
||||
}
|
||||
.body-wrap{
|
||||
margin-bottom: 80px;
|
||||
}
|
||||
.mid-col {
|
||||
position:absolute;
|
||||
right:0;
|
||||
min-height:100%;
|
||||
background:#eaeaea;
|
||||
left: 300px;
|
||||
width: auto;
|
||||
@extend %trans;
|
||||
&.show {
|
||||
background: none;
|
||||
opacity: .9;
|
||||
@extend %anmLeftIn;
|
||||
.article {
|
||||
@extend %trans;
|
||||
background: rgba(255,255,255,.3);
|
||||
}
|
||||
}
|
||||
&.hide {
|
||||
@extend %anmLeftOut;
|
||||
}
|
||||
}
|
||||
161
themes/yilia/source-src/css/highlight.scss
Normal file
161
themes/yilia/source-src/css/highlight.scss
Normal file
@ -0,0 +1,161 @@
|
||||
.article-entry pre,
|
||||
.article-entry .highlight {
|
||||
background: #272822;
|
||||
margin: 10px 0;
|
||||
padding: 10px 10px;
|
||||
overflow: auto;
|
||||
color: #fff;
|
||||
font-size: 0.9em;
|
||||
line-height: 22.400000000000002px;
|
||||
}
|
||||
.article-entry .highlight .gutter pre,
|
||||
.article-entry .highlight .gutter pre .line,
|
||||
.article-entry .gist .gist-file .gist-data .line-numbers {
|
||||
color: #666;
|
||||
}
|
||||
.article-entry pre,
|
||||
.article-entry code {
|
||||
font-family: "Source Code Pro", Consolas, Monaco, Menlo, Consolas, monospace;
|
||||
}
|
||||
.article-entry code {
|
||||
background: #eee;
|
||||
padding: 0 0.3em;
|
||||
border: none;
|
||||
}
|
||||
.article-entry pre code {
|
||||
background: none;
|
||||
text-shadow: none;
|
||||
padding: 0;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.article-entry .highlight {
|
||||
border-radius: 4px;
|
||||
}
|
||||
.article-entry .highlight pre {
|
||||
border: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
.article-entry .highlight table {
|
||||
margin: 0;
|
||||
width: auto;
|
||||
}
|
||||
.article-entry .highlight td {
|
||||
border: none;
|
||||
padding: 0;
|
||||
}
|
||||
.article-entry .highlight figcaption {
|
||||
color: highlight-comment;
|
||||
line-height: 1em;
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
.article-entry .highlight figcaption:before,
|
||||
.article-entry .highlight figcaption:after {
|
||||
content: "";
|
||||
display: table;
|
||||
}
|
||||
.article-entry .highlight figcaption:after {
|
||||
clear: both;
|
||||
}
|
||||
.article-entry .highlight figcaption a {
|
||||
float: right;
|
||||
}
|
||||
.article-entry .highlight .gutter pre {
|
||||
text-align: right;
|
||||
padding-right: 20px;
|
||||
}
|
||||
.article-entry .highlight .gutter pre .line {
|
||||
text-shadow: none;
|
||||
}
|
||||
.article-entry .highlight .line {
|
||||
color: #fff;
|
||||
min-height: 19px;
|
||||
}
|
||||
.article-entry .gist {
|
||||
margin: 0 -20px;
|
||||
border-style: solid;
|
||||
border-color: #ddd;
|
||||
border-width: 1px 0;
|
||||
background: #272822;
|
||||
padding: 15px 20px 15px 0;
|
||||
}
|
||||
.article-entry .gist .gist-file {
|
||||
border: none;
|
||||
font-family: "Source Code Pro", Consolas, Monaco, Menlo, Consolas, monospace;
|
||||
margin: 0;
|
||||
}
|
||||
.article-entry .gist .gist-file .gist-data {
|
||||
background: none;
|
||||
border: none;
|
||||
}
|
||||
.article-entry .gist .gist-file .gist-data .line-numbers {
|
||||
background: none;
|
||||
border: none;
|
||||
padding: 0 20px 0 0;
|
||||
}
|
||||
.article-entry .gist .gist-file .gist-data .line-data {
|
||||
padding: 0 !important;
|
||||
}
|
||||
.article-entry .gist .gist-file .highlight {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: none;
|
||||
}
|
||||
.article-entry .gist .gist-file .gist-meta {
|
||||
background: #272822;
|
||||
color: highlight-comment;
|
||||
font: 0.85em "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||
text-shadow: 0 0;
|
||||
padding: 0;
|
||||
margin-top: 1em;
|
||||
margin-left: 20px;
|
||||
}
|
||||
.article-entry .gist .gist-file .gist-meta a {
|
||||
color: #258fb8;
|
||||
font-weight: normal;
|
||||
}
|
||||
.article-entry .gist .gist-file .gist-meta a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
pre .comment {
|
||||
color: #75715e;
|
||||
}
|
||||
pre .keyword,
|
||||
pre .function .keyword,
|
||||
pre .class .params {
|
||||
color: #66d9ef;
|
||||
}
|
||||
pre .tag,
|
||||
pre .doctype,
|
||||
pre .params,
|
||||
pre .function,
|
||||
pre .css .value {
|
||||
color: #fff;
|
||||
}
|
||||
pre .css ~ * .tag,
|
||||
pre .title,
|
||||
pre .at_rule,
|
||||
pre .at_rule .keyword,
|
||||
pre .preprocessor,
|
||||
pre .preprocessor .keyword {
|
||||
color: #f92672;
|
||||
}
|
||||
pre .attribute,
|
||||
pre .built_in,
|
||||
pre .class,
|
||||
pre .css ~ * .class,
|
||||
pre .function .title {
|
||||
color: #a6e22e;
|
||||
}
|
||||
pre .value,
|
||||
pre .string {
|
||||
color: #e6db74;
|
||||
}
|
||||
pre .number {
|
||||
color: #7163d7;
|
||||
}
|
||||
pre .id,
|
||||
pre .css ~ * .id {
|
||||
color: #fd971f;
|
||||
}
|
||||
BIN
themes/yilia/source-src/css/img/checkered-pattern.png
Normal file
BIN
themes/yilia/source-src/css/img/checkered-pattern.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 353 B |
BIN
themes/yilia/source-src/css/img/scrollbar_arrow.png
Normal file
BIN
themes/yilia/source-src/css/img/scrollbar_arrow.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.0 KiB |
6
themes/yilia/source-src/css/img/tooltip.svg
Normal file
6
themes/yilia/source-src/css/img/tooltip.svg
Normal file
@ -0,0 +1,6 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
||||
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="80px" height="80px" viewBox="0 0 80 80">
|
||||
<path fill="#24c1f6" d="M80,0c0,0-5.631,14.445-25.715,27.213C29.946,42.688,12.79,33.997,3.752,30.417
|
||||
c-3.956-1.567-4.265,1.021-2.966,3.814C16.45,67.934,80,79.614,80,79.614l0,0V0z"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 492 B |
116
themes/yilia/source-src/css/left.scss
Normal file
116
themes/yilia/source-src/css/left.scss
Normal file
@ -0,0 +1,116 @@
|
||||
.left-col {
|
||||
background: #fff;
|
||||
width: 300px;
|
||||
position:fixed;
|
||||
opacity:1;
|
||||
transition:all .2s ease-in;
|
||||
height:100%;
|
||||
z-index: 999;
|
||||
&.show {
|
||||
@extend %shadow;
|
||||
}
|
||||
.overlay{
|
||||
width: 100%;
|
||||
height: 180px;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.intrude-less {
|
||||
width: 76%;
|
||||
text-align: center;
|
||||
margin: 112px auto 0;
|
||||
}
|
||||
|
||||
#header{
|
||||
width:100%;
|
||||
height: 300px;
|
||||
position: relative;
|
||||
border-bottom: 1px solid color-border;
|
||||
a {
|
||||
color: #696969;
|
||||
&:hover {
|
||||
color: #B0A0AA;
|
||||
}
|
||||
}
|
||||
.header-subtitle{
|
||||
text-align: center;
|
||||
color:#999;
|
||||
font-size: 14px;
|
||||
line-height: 25px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
}
|
||||
.header-menu{
|
||||
font-weight: 300;
|
||||
line-height: 31px;
|
||||
text-transform: uppercase;
|
||||
float:none;
|
||||
min-height: 150px;
|
||||
margin-left: -12px;
|
||||
text-align: center;
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: horizontal;
|
||||
-webkit-box-pack: center;
|
||||
-webkit-box-align: center;
|
||||
li{
|
||||
cursor: default;
|
||||
a{
|
||||
font-size: 14px;
|
||||
min-width: 300px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.header-smart-menu {
|
||||
font-size: 12px;
|
||||
margin-bottom: 20px;
|
||||
a {
|
||||
&:after {
|
||||
content: '/'
|
||||
}
|
||||
&:last-child {
|
||||
&:after {
|
||||
content: ''
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.profilepic{
|
||||
text-align: center;
|
||||
display: block;
|
||||
border: 5px solid #fff;
|
||||
border-radius: 300px;
|
||||
width: 128px;
|
||||
height: 128px;
|
||||
margin: 0 auto;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
background: #88acdb;
|
||||
-webkit-transition: all 0.2s ease-in;
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: horizontal;
|
||||
-webkit-box-pack: center;
|
||||
-webkit-box-align: center;
|
||||
text-align: center;
|
||||
img{
|
||||
border-radius: 300px;
|
||||
opacity: 1;
|
||||
-webkit-transition: all 0.2s ease-in;
|
||||
&.show{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
.header-author{
|
||||
text-align: center;
|
||||
margin: 0.67em 0;
|
||||
font-family: Roboto, "Roboto", serif;
|
||||
font-size: 30px;
|
||||
transition: 0.3s;
|
||||
}
|
||||
}
|
||||
}
|
||||
25
themes/yilia/source-src/css/main.scss
Normal file
25
themes/yilia/source-src/css/main.scss
Normal file
@ -0,0 +1,25 @@
|
||||
@import "./global";
|
||||
@import "./fonts";
|
||||
@import "./grid";
|
||||
@import "./left";
|
||||
@import "./scroll";
|
||||
@import "./highlight";
|
||||
@import "./tags";
|
||||
@import "./tags-cloud";
|
||||
@import "./social";
|
||||
@import "./page";
|
||||
@import "./archive";
|
||||
@import "./tools";
|
||||
@import "./article-main";
|
||||
@import "./article-inner";
|
||||
@import "./article-nav";
|
||||
@import "./comment";
|
||||
@import "./share";
|
||||
@import "./reward";
|
||||
@import "./aside";
|
||||
@import "./tooltip";
|
||||
@import "./footer";
|
||||
@media screen and (max-width: 800px) {
|
||||
@import "./mobile";
|
||||
@import "./mobile-slider";
|
||||
}
|
||||
42
themes/yilia/source-src/css/mobile-slider.scss
Normal file
42
themes/yilia/source-src/css/mobile-slider.scss
Normal file
@ -0,0 +1,42 @@
|
||||
.profilepic {
|
||||
text-align: center;
|
||||
display: block;
|
||||
border: 5px solid #fff;
|
||||
border-radius: 300px;
|
||||
width: 128px;
|
||||
height: 128px;
|
||||
margin: 0 auto;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
background: #88acdb;
|
||||
-webkit-transition: all 0.2s ease-in;
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: horizontal;
|
||||
-webkit-box-pack: center;
|
||||
-webkit-box-align: center;
|
||||
text-align: center;
|
||||
}
|
||||
.header-author {
|
||||
text-align: center;
|
||||
margin: 0.67em 0;
|
||||
font-family: Roboto, "Roboto", serif;
|
||||
font-size: 30px;
|
||||
-webkit-transition: 0.3s;
|
||||
-moz-transition: 0.3s;
|
||||
-ms-transition: 0.3s;
|
||||
transition: 0.3s;
|
||||
}
|
||||
.header-subtitle {
|
||||
text-align: center;
|
||||
color: #999;
|
||||
font-size: 14px;
|
||||
line-height: 25px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
}
|
||||
.header-subtitle {
|
||||
padding: 0 24px;
|
||||
}
|
||||
379
themes/yilia/source-src/css/mobile.scss
Normal file
379
themes/yilia/source-src/css/mobile.scss
Normal file
@ -0,0 +1,379 @@
|
||||
html, body, #container {
|
||||
height: auto;
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
}
|
||||
#mobile-nav {
|
||||
display: block;
|
||||
}
|
||||
.body-wrap {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.left-col {
|
||||
display: none;
|
||||
}
|
||||
.mid-col {
|
||||
left: 0;
|
||||
position: relative;
|
||||
}
|
||||
#header{
|
||||
.header-nav{
|
||||
position: relative;
|
||||
}
|
||||
}
|
||||
.wrap-side-operation {
|
||||
display: none;
|
||||
}
|
||||
.cloud-tie-wrapper {
|
||||
padding: 0;
|
||||
min-height: 20px;
|
||||
}
|
||||
.tools-col {
|
||||
left: -300px;
|
||||
width: 300px;
|
||||
.tools-wrap {
|
||||
padding-top: 48px;
|
||||
}
|
||||
.tools-wrap, .tools-section {
|
||||
width: 300px;
|
||||
.search-wrap {
|
||||
width: 280px;
|
||||
}
|
||||
.search-tag.tagcloud {
|
||||
margin-right: -30px;
|
||||
}
|
||||
.search-ul .search-li {
|
||||
padding: 5px 20px;
|
||||
}
|
||||
}
|
||||
&.show {
|
||||
.header-menu{
|
||||
&.tools-nav {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#container .header-author.fixed {
|
||||
position: fixed;
|
||||
top: -29px;
|
||||
width: 100%;
|
||||
color: #ddd;
|
||||
}
|
||||
.mobile-mask {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
background: rgba(0, 0, 0, .85);
|
||||
z-index: 999;
|
||||
}
|
||||
.btnctn{
|
||||
position: fixed;
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
top: -5px;
|
||||
z-index: 4;
|
||||
.slider-trigger{
|
||||
position: absolute;
|
||||
z-index: 101;
|
||||
width: 42px;
|
||||
height: 42px;
|
||||
text-align: center;
|
||||
line-height: 50px;
|
||||
&.back {
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
&.list {
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
}
|
||||
&:hover{
|
||||
background: #444;
|
||||
}
|
||||
.icon{
|
||||
font-size: 24px;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
.article-header{
|
||||
border-left: none;
|
||||
padding: 0;
|
||||
border-bottom: 1px dotted #ddd;
|
||||
h1{
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.archive-article-date{
|
||||
float: initial;
|
||||
}
|
||||
}
|
||||
.header-subtitle{
|
||||
padding: 0 24px;
|
||||
.icon {
|
||||
margin: 0 10px;
|
||||
color: #d0d0d0;
|
||||
}
|
||||
}
|
||||
|
||||
.article-info-index.article-info{
|
||||
min-height: 40px;
|
||||
padding-top: 10px;
|
||||
margin: 0;
|
||||
border-top: 1px solid #ddd;
|
||||
}
|
||||
.article-info-post.article-info{
|
||||
margin: 0;
|
||||
padding-top: 10px;
|
||||
border: none;
|
||||
}
|
||||
#viewer-box .viewer-box-l{
|
||||
font-size: 14px;
|
||||
}
|
||||
.article-nav-link-wrap{
|
||||
margin: 5px 0;
|
||||
display: block;
|
||||
clear: both;
|
||||
.icon-circle-right {
|
||||
float: left;
|
||||
margin: 6px 4px 0 0;
|
||||
}
|
||||
}
|
||||
.article{
|
||||
padding: 10px;
|
||||
margin: 10px 0;
|
||||
border: 0;
|
||||
font-size: 16px;
|
||||
color: #555;
|
||||
.article-more-link {
|
||||
margin: 0;
|
||||
}
|
||||
.article-entry{
|
||||
padding: 10px 0 30px 0;
|
||||
}
|
||||
.article-inner h1.article-title, .article-title{
|
||||
font-size: 18px;
|
||||
font-weight: 300;
|
||||
display: block;
|
||||
margin: 0;
|
||||
}
|
||||
.article-meta{
|
||||
width: auto;
|
||||
height: 30px;
|
||||
margin-top: -5px;
|
||||
position: ralative;
|
||||
.article-date{
|
||||
font-size: 12px;
|
||||
border-radius: 0;
|
||||
color: #666;
|
||||
background: none;
|
||||
height: auto;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
width: 100%;
|
||||
text-align: left;
|
||||
margin-left: 10px;
|
||||
time{
|
||||
width: auto;
|
||||
float: right;
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
.article-tag-list{
|
||||
margin-top: 7px;
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
top: 0;
|
||||
&:before{
|
||||
float: left;
|
||||
margin-top: 1px;
|
||||
left: 0;
|
||||
}
|
||||
.article-tag-list-item{
|
||||
float: left;
|
||||
padding-left: 0;
|
||||
width: auto;
|
||||
max-width: 83px;
|
||||
}
|
||||
}
|
||||
.article-category{
|
||||
margin-top: 7px;
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
top: -30px;
|
||||
&:before{
|
||||
float: left;
|
||||
margin-top: 1px;
|
||||
left: 15px;
|
||||
}
|
||||
.article-category-link{
|
||||
max-width: 83px;
|
||||
width: auto;
|
||||
padding-left:10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#article-nav-older{
|
||||
float: none;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
.share{
|
||||
padding: 3px 10px;
|
||||
}
|
||||
.duoshuo {
|
||||
padding: 0 13px;
|
||||
}
|
||||
#disqus_thread {
|
||||
padding: 0 13px;
|
||||
}
|
||||
#article-nav {
|
||||
margin: 0;
|
||||
padding: 5px 10px 10px;
|
||||
}
|
||||
#article-nav #article-nav-older {
|
||||
float: none;
|
||||
}
|
||||
#article-nav .article-nav-link-wrap .article-nav-title {
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
#page-nav .extend{
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.instagram .open-ins{
|
||||
left: 2px;
|
||||
top: -30px;
|
||||
color: #aaa;
|
||||
}
|
||||
.info-on-right{
|
||||
float: initial;
|
||||
}
|
||||
.archives-wrap{
|
||||
margin: 10px 10px 0px;
|
||||
padding: 10px;
|
||||
.archive-article-title{
|
||||
font-size: 16px;
|
||||
}
|
||||
.archive-year-wrap{
|
||||
position: relative;
|
||||
padding: 0 0 0 0;
|
||||
a{
|
||||
padding: 0 0 0 0;
|
||||
}
|
||||
}
|
||||
.article-meta{
|
||||
.archive-article-date{
|
||||
font-size: 12px;
|
||||
margin-right: 10px;
|
||||
margin-top: -5px;
|
||||
}
|
||||
.article-tag-list-link{
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.archives{
|
||||
.archive-article{
|
||||
padding: 10px 0;
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
#footer {
|
||||
position: relative;
|
||||
bottom: 0;
|
||||
.footer-left{
|
||||
float: initial;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.footer-right{
|
||||
float: initial;
|
||||
}
|
||||
}
|
||||
|
||||
#mobile-nav{
|
||||
.header-author{
|
||||
margin: 0;
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
color: #424242;
|
||||
}
|
||||
.overlay{
|
||||
height: 110px;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
z-index: 2;
|
||||
background: #4d4d4d;
|
||||
}
|
||||
#header{
|
||||
padding: 10px 0 0 0;
|
||||
.profilepic{
|
||||
display: block;
|
||||
position: relative;
|
||||
z-index: 100;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.header-menu{
|
||||
height: auto;
|
||||
margin: 10px 0 20px;
|
||||
&.tools-nav {
|
||||
display: none;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
z-index: 9999;
|
||||
ul {
|
||||
margin-right: 28px;
|
||||
}
|
||||
ul, li {
|
||||
border-color: #fff;
|
||||
a {
|
||||
color: #fff;
|
||||
&.active {
|
||||
background: #81b5cc;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
ul{
|
||||
text-align: center;
|
||||
cursor: default;
|
||||
display: flex;
|
||||
margin: 0 auto;
|
||||
align-items: center;
|
||||
justify-content: space-around;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
border: 1px solid #a0a0a0;
|
||||
border-radius: 3px;
|
||||
}
|
||||
li{
|
||||
border-left: 1px solid #a0a0a0;
|
||||
&:first-child {
|
||||
border-left: 0;
|
||||
}
|
||||
&:last-child {
|
||||
border-right: 0;
|
||||
}
|
||||
a {
|
||||
font-size: 14px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
display: block;
|
||||
color: #a0a0a0;
|
||||
&.active {
|
||||
color: #eaeaea;
|
||||
background: #a0a0a0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
38
themes/yilia/source-src/css/page.scss
Normal file
38
themes/yilia/source-src/css/page.scss
Normal file
@ -0,0 +1,38 @@
|
||||
#page-nav{
|
||||
text-align: center;
|
||||
margin-top: 30px;
|
||||
.page-number{
|
||||
width: 20px;
|
||||
height: 25px;
|
||||
background: #4d4d4d;
|
||||
display: inline-block;
|
||||
color: #fff;
|
||||
line-height: 25px;
|
||||
font-size: 12px;
|
||||
margin: 0 5px 30px;
|
||||
border-radius: 2px;
|
||||
&:hover{
|
||||
background: #5e5e5e;
|
||||
}
|
||||
}
|
||||
.current{
|
||||
background: #88acdb;
|
||||
cursor: default;
|
||||
&:hover{
|
||||
background: #88acdb;
|
||||
}
|
||||
}
|
||||
.extend{
|
||||
color: #4d4d4d;
|
||||
margin: 0 27px;
|
||||
opacity: 1;
|
||||
&:hover{
|
||||
color: #5e5e5e;
|
||||
}
|
||||
}
|
||||
&:hover{
|
||||
.extend{
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
51
themes/yilia/source-src/css/reward.scss
Normal file
51
themes/yilia/source-src/css/reward.scss
Normal file
@ -0,0 +1,51 @@
|
||||
.page-reward {
|
||||
margin: 60px 0;
|
||||
text-align: center;
|
||||
.page-reward-btn {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
width: 56px;
|
||||
height: 56px;
|
||||
line-height: 56px;
|
||||
font-size: 20px;
|
||||
color: #fff;
|
||||
background: #f44336;
|
||||
border-radius: 50%;
|
||||
box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12);
|
||||
-webkit-transition: .4s ease-in-out;
|
||||
transition: .4s ease-in-out;
|
||||
&:hover, &:active {
|
||||
box-shadow: 0 6px 12px rgba(0,0,0,0.2),0 4px 15px rgba(0,0,0,0.2);
|
||||
}
|
||||
.tooltip-item {
|
||||
display: block;
|
||||
width: 56px;
|
||||
height: 56px;
|
||||
}
|
||||
}
|
||||
.reward-box {
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
}
|
||||
.reward-p {
|
||||
color: #fff;
|
||||
font-weight: bold;
|
||||
text-shadow: 1px 1px 1px #45b9e0;
|
||||
.icon {
|
||||
margin: 0 10px;
|
||||
color: #ddd;
|
||||
}
|
||||
}
|
||||
.reward-type {
|
||||
font-size: 16px;
|
||||
display: block;
|
||||
color: #4d4d4d;
|
||||
margin: 20px 0 0 0;
|
||||
}
|
||||
.reward-img {
|
||||
width: 130px;
|
||||
height: 130px;
|
||||
border: 6px solid #fff;
|
||||
border-radius: 3px;
|
||||
}
|
||||
}
|
||||
64
themes/yilia/source-src/css/scroll.scss
Normal file
64
themes/yilia/source-src/css/scroll.scss
Normal file
@ -0,0 +1,64 @@
|
||||
/* 设置滚动条的样式 */
|
||||
::-webkit-scrollbar {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-button {
|
||||
width: 0;
|
||||
height: 0;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-button:start:increment,::-webkit-scrollbar-button:end:decrement {
|
||||
display: none;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-corner {
|
||||
display: block;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
border-radius: 8px;
|
||||
background-color: rgba(0,0,0,.2);
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
border-radius: 8px;
|
||||
background-color: rgba(0,0,0,.5);
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track,::-webkit-scrollbar-thumb {
|
||||
border-right: 1px solid transparent;
|
||||
border-left: 1px solid transparent;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track:hover {
|
||||
background-color: rgba(0,0,0,.15);
|
||||
}
|
||||
::-webkit-scrollbar-button:start {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
background: url(./img/scrollbar_arrow.png) no-repeat 0 0;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-button:start:hover {
|
||||
background: url(./img/scrollbar_arrow.png) no-repeat -15px 0;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-button:start:active {
|
||||
background: url(./img/scrollbar_arrow.png) no-repeat -30px 0;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-button:end {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
background: url(./img/scrollbar_arrow.png) no-repeat 0 -18px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-button:end:hover {
|
||||
background: url(./img/scrollbar_arrow.png) no-repeat -15px -18px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-button:end:active {
|
||||
background: url(./img/scrollbar_arrow.png) no-repeat -30px -18px;
|
||||
}
|
||||
107
themes/yilia/source-src/css/share.scss
Normal file
107
themes/yilia/source-src/css/share.scss
Normal file
@ -0,0 +1,107 @@
|
||||
.share-wrap {
|
||||
min-height: 20px;
|
||||
}
|
||||
.share-btn {
|
||||
float: right;
|
||||
position: relative;
|
||||
}
|
||||
.share-icons {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
a {
|
||||
border: 1px solid #fff;
|
||||
border-radius: 50%;
|
||||
display: -moz-inline-stack;
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
zoom: 1;
|
||||
margin: 10px;
|
||||
-webkit-transition: 0.3s;
|
||||
transition: 0.3s;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
opacity: 0.7;
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
line-height: 26px;
|
||||
text-shadow: 1px 1px 1px #509eb7;
|
||||
&:active {
|
||||
color: #fff;
|
||||
}
|
||||
&:hover {
|
||||
transform: scale(1.2);
|
||||
}
|
||||
&.share-outer {
|
||||
border: none;
|
||||
color: #fff;
|
||||
background: #4d4d4d;
|
||||
text-shadow: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
.page-modal {
|
||||
//display: none;
|
||||
position: fixed;
|
||||
top: 24%;
|
||||
left: 50%;
|
||||
z-index: 1001;
|
||||
padding: 20px;
|
||||
text-align: center;
|
||||
color: #727272;
|
||||
background: #fff;
|
||||
border-radius: 4px;
|
||||
box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12);
|
||||
opacity: 0;
|
||||
transform: translate(-50%, -200%);
|
||||
p {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
&.ready {
|
||||
visibility: hidden;
|
||||
display: block;
|
||||
transform: translate(-50%, -100%);
|
||||
transition: .3s;
|
||||
}
|
||||
|
||||
&.in {
|
||||
visibility: visible;
|
||||
opacity: 1;
|
||||
transform: translate(-50%, 0);
|
||||
}
|
||||
|
||||
.close {
|
||||
position: absolute;
|
||||
right: 15px;
|
||||
top: 15px;
|
||||
color: rgba(0, 0, 0, .2);
|
||||
font-size: 16px;
|
||||
line-height: 20px;
|
||||
&:hover, &:active {
|
||||
color: rgba(0, 0, 0, .4);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.mask {
|
||||
visibility: hidden;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
z-index: 1000;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: #000;
|
||||
opacity: 0;
|
||||
filter: alpha(opacity=0);
|
||||
pointer-events: none;
|
||||
-webkit-transition: .3s ease-in-out;
|
||||
transition: .3s ease-in-out;
|
||||
&.in {
|
||||
visibility: visible;
|
||||
pointer-events: auto;
|
||||
opacity: .3;
|
||||
}
|
||||
}
|
||||
151
themes/yilia/source-src/css/social.scss
Normal file
151
themes/yilia/source-src/css/social.scss
Normal file
@ -0,0 +1,151 @@
|
||||
#header .header-nav{
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
transition: transform .3s ease-in;
|
||||
.social {
|
||||
margin-top: 10px;
|
||||
text-align: center;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
a {
|
||||
border-radius:50%;
|
||||
display:-moz-inline-stack;
|
||||
display:inline-block;
|
||||
vertical-align:middle;
|
||||
*vertical-align:auto;
|
||||
zoom:1;
|
||||
*display:inline;
|
||||
margin:0 8px 15px 8px;
|
||||
transition:0.3s;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
opacity: 0.7;
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
line-height: 26px;
|
||||
&:hover {
|
||||
opacity:1
|
||||
}
|
||||
}
|
||||
a.weibo {
|
||||
background: #aaaaff;
|
||||
border:1px solid #aaaaff;
|
||||
&:hover {
|
||||
border:1px solid #aaaaff;
|
||||
}
|
||||
}
|
||||
a.segmentfault {
|
||||
background: #009a61;
|
||||
border:1px solid #009a61;
|
||||
&:hover {
|
||||
border:1px solid #009a61;
|
||||
}
|
||||
}
|
||||
a.rss {
|
||||
background: #ef7522;
|
||||
border:1px solid #ef7522;
|
||||
&:hover {
|
||||
border:1px solid #cf5d0f;
|
||||
}
|
||||
}
|
||||
a.github {
|
||||
background: #afb6ca;
|
||||
border:1px solid #afb6ca;
|
||||
&:hover {
|
||||
border:1px solid #909ab6;
|
||||
}
|
||||
}
|
||||
a.facebook {
|
||||
background: #3b5998;
|
||||
border:1px solid #3b5998;
|
||||
&:hover {
|
||||
border:1px solid #2d4373;
|
||||
}
|
||||
}
|
||||
a.google {
|
||||
background: #c83d20;
|
||||
border:1px solid #c83d20;
|
||||
&:hover {
|
||||
border:1px solid #9c3019;
|
||||
}
|
||||
}
|
||||
a.twitter {
|
||||
background: #55cff8;
|
||||
border:1px solid #55cff8;
|
||||
&:hover {
|
||||
border:1px solid #24c1f6;
|
||||
}
|
||||
}
|
||||
a.linkedin {
|
||||
background: #005a87;
|
||||
border:1px solid #005a87;
|
||||
&:hover {
|
||||
border:1px solid #006b98;
|
||||
}
|
||||
}
|
||||
a.acfun {
|
||||
background: #fd4c5d;
|
||||
border:1px solid #fd4c5d;
|
||||
&:hover {
|
||||
border:1px solid #fd4c5d;
|
||||
}
|
||||
}
|
||||
a.bilibili {
|
||||
background: #e15280;
|
||||
border:1px solid #e15280;
|
||||
&:hover {
|
||||
border:1px solid #e15280;
|
||||
}
|
||||
}
|
||||
a.zhihu {
|
||||
background: #0078d8;
|
||||
border:1px solid #0078d8;
|
||||
&:hover {
|
||||
border:1px solid #0078d8;
|
||||
}
|
||||
}
|
||||
a.douban {
|
||||
background: #06c611;
|
||||
border:1px solid #06c611;
|
||||
&:hover {
|
||||
border:1px solid #06c611;
|
||||
}
|
||||
}
|
||||
a.mail {
|
||||
background: #005a87;
|
||||
border:1px solid #005a87;
|
||||
&:hover {
|
||||
border:1px solid #006b98;
|
||||
}
|
||||
}
|
||||
a.jianshu {
|
||||
background: #ff5722;
|
||||
border:1px solid #ff5722;
|
||||
&:hover {
|
||||
border:1px solid #ff5722;
|
||||
}
|
||||
}
|
||||
a.weixin {
|
||||
background: #4caf50;
|
||||
border:1px solid #4caf50;
|
||||
&:hover {
|
||||
border:1px solid #4caf50;
|
||||
}
|
||||
}
|
||||
a.qq {
|
||||
background: #34baad;
|
||||
border:1px solid #34baad;
|
||||
&:hover {
|
||||
border:1px solid #34baad;
|
||||
}
|
||||
}
|
||||
a.psn {
|
||||
background: #086ef6;
|
||||
border:1px solid #086ef6;
|
||||
&:hover {
|
||||
border:1px solid #086ef6;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
63
themes/yilia/source-src/css/tags-cloud.scss
Normal file
63
themes/yilia/source-src/css/tags-cloud.scss
Normal file
@ -0,0 +1,63 @@
|
||||
.glass {
|
||||
background-color: rgba(54,70,93,.9);
|
||||
left: 0;
|
||||
opacity: 1;
|
||||
z-index: 998;
|
||||
transition: opacity .15s;
|
||||
bottom: 0;
|
||||
position: fixed;
|
||||
right: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.tagcloud-ctn {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
z-index: 90120;
|
||||
background-size: 100% 100%;
|
||||
opacity: 1;
|
||||
.tagcloud-global {
|
||||
position: fixed;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
margin-top: -115px;
|
||||
margin-left: -315px;
|
||||
width: 630px;
|
||||
a {
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
border-radius: 50%;
|
||||
background: #F2992E;
|
||||
color: #fff;
|
||||
display: block;
|
||||
float: left;
|
||||
line-height: 80px;
|
||||
text-align: center;
|
||||
}
|
||||
.tab-post-types .tab-post-type:nth-child(1) .post-type-icon {
|
||||
background: #F2992E
|
||||
}
|
||||
|
||||
.tab-post-types .tab-post-type:nth-child(2) .post-type-icon {
|
||||
background: #56BC8A
|
||||
}
|
||||
|
||||
.tab-post-types .tab-post-type:nth-child(3) .post-type-icon {
|
||||
background: #4AA8D8
|
||||
}
|
||||
|
||||
.tab-post-types .tab-post-type:nth-child(4) .post-type-icon {
|
||||
background: #A77DC2
|
||||
}
|
||||
|
||||
.tab-post-types .tab-post-type:nth-child(5) .post-type-icon {
|
||||
background: #DD765D
|
||||
}
|
||||
}
|
||||
}
|
||||
112
themes/yilia/source-src/css/tags.scss
Normal file
112
themes/yilia/source-src/css/tags.scss
Normal file
@ -0,0 +1,112 @@
|
||||
#header .tagcloud a{
|
||||
color:#fff;
|
||||
}
|
||||
.tagcloud{
|
||||
a.js-tag{
|
||||
display:inline-block;
|
||||
text-decoration:none;
|
||||
font-weight: normal;
|
||||
font-size:10px;
|
||||
color:#fff;
|
||||
height:18px;
|
||||
line-height:18px;
|
||||
float: left;
|
||||
padding:0 5px 0px 10px;
|
||||
position:relative;
|
||||
border-radius:0 5px 5px 0;
|
||||
margin: 5px 9px 5px 8px;
|
||||
font-family: Menlo, Monaco, "Andale Mono", "lucida console", "Courier New", monospace;
|
||||
&:hover{
|
||||
opacity: 0.8;
|
||||
}
|
||||
&:before{
|
||||
content: " ";
|
||||
width: 0px;
|
||||
height: 0px;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: -18px;
|
||||
border: 9px solid transparent;
|
||||
}
|
||||
&:after{
|
||||
content:" ";
|
||||
width:4px;
|
||||
height:4px;
|
||||
background-color:#fff;
|
||||
border-radius:4px;
|
||||
box-shadow:0px 0px 0px 1px rgba(0,0,0,.3);
|
||||
position:absolute;
|
||||
top: 7px;
|
||||
left: 2px;
|
||||
}
|
||||
}
|
||||
a.color1{
|
||||
background: #FF945C;
|
||||
&:before{
|
||||
border-right-color: #FF945C;
|
||||
}
|
||||
}
|
||||
a.color2{
|
||||
background: #cc8167;
|
||||
&:before{
|
||||
border-right-color: #cc8167;
|
||||
}
|
||||
}
|
||||
a.color3{
|
||||
background: #BA8F6C;
|
||||
&:before{
|
||||
border-right-color: #BA8F6C;
|
||||
}
|
||||
}
|
||||
a.color4{
|
||||
background: #94635c;
|
||||
&:before{
|
||||
border-right-color:#94635c;
|
||||
}
|
||||
}
|
||||
a.color5{
|
||||
background: #7B5D5F;
|
||||
&:before{
|
||||
border-right-color:#7B5D5F;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.article-tag-list{
|
||||
.article-tag-list-item{
|
||||
float: left;
|
||||
}
|
||||
}
|
||||
.article-pop-out{
|
||||
float: left;
|
||||
.icon-tuding {
|
||||
color: #999;
|
||||
float: left;
|
||||
margin-right: 10px;
|
||||
margin-top: 6px;
|
||||
}
|
||||
}
|
||||
.article-tag, .article-category{
|
||||
float: left;
|
||||
.article-tag-list{
|
||||
float: left;
|
||||
}
|
||||
.icon {
|
||||
color: #999;
|
||||
float: left;
|
||||
margin-right: 10px;
|
||||
margin-top: 6px;
|
||||
}
|
||||
}
|
||||
.article-pop-out {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.archive-article-date {
|
||||
color: #999;
|
||||
margin-right: 7.6923%;
|
||||
float: right;
|
||||
.icon {
|
||||
margin: 5px 5px 5px 0;
|
||||
}
|
||||
}
|
||||
143
themes/yilia/source-src/css/tools.scss
Normal file
143
themes/yilia/source-src/css/tools.scss
Normal file
@ -0,0 +1,143 @@
|
||||
.tools-col {
|
||||
width: 300px;
|
||||
height: 100%;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: 0;
|
||||
z-index: 0;
|
||||
padding: 0;
|
||||
opacity: 0;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
overflow-scrolling: touch;
|
||||
@extend %trans;
|
||||
&.show {
|
||||
opacity: 1;
|
||||
@extend %anmSmallLeftIn;
|
||||
}
|
||||
&.hide {
|
||||
@extend %anmSmallLeftOut;
|
||||
z-index: 0;
|
||||
}
|
||||
.tools-nav {
|
||||
display: none;
|
||||
}
|
||||
.tools-wrap, .tools-section{
|
||||
height: 100%;
|
||||
color: #e5e5e5;
|
||||
width: 360px;
|
||||
overflow: hidden;
|
||||
overflow-y: auto;
|
||||
::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
.tools-section {
|
||||
.search-wrap {
|
||||
width: 310px;
|
||||
margin: 20px 20px 10px 20px;
|
||||
position: relative;
|
||||
.search-ipt {
|
||||
width: 310px;
|
||||
color: #fff;
|
||||
background: none;
|
||||
border: none;
|
||||
border-bottom: 2px solid #fff;
|
||||
font-family: Roboto, "Roboto", serif;
|
||||
}
|
||||
.icon {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 7px;
|
||||
color: #fff;
|
||||
cursor: pointer;
|
||||
@extend %trans;
|
||||
&:hover {
|
||||
transform: scale(1.2);
|
||||
}
|
||||
}
|
||||
::-webkit-input-placeholder {
|
||||
color: #ededed;
|
||||
}
|
||||
}
|
||||
.search-tag.tagcloud {
|
||||
text-align: center;
|
||||
position: relative;
|
||||
.search-tag-wording {
|
||||
font-size: 12px;
|
||||
margin: 4px 75px 0 0;
|
||||
}
|
||||
.article-tag-list {
|
||||
@extend %trans;
|
||||
margin: 15px 10px 0;
|
||||
padding: 10px;
|
||||
background: rgba(255,255,255,0.2);
|
||||
&.show {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
.a {
|
||||
float: initial;
|
||||
}
|
||||
}
|
||||
.search-ul {
|
||||
margin-top: 10px;
|
||||
color: rgba(77, 77, 77, 0.75);
|
||||
-webkit-overflow-scrolling: touch;
|
||||
overflow-scrolling: touch;
|
||||
overflow-y: auto;
|
||||
.search-li {
|
||||
padding: 10px 20px;
|
||||
border-bottom: 1px dotted #dcdcdc;
|
||||
&:hover {
|
||||
background: rgba(255, 255, 255, 0.2);
|
||||
}
|
||||
}
|
||||
.search-title {
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
display: block;
|
||||
color: rgba(255,255,248,1);
|
||||
text-shadow: 1px 1px rgba(77,77,77,0.25);
|
||||
.icon {
|
||||
margin-right: 10px;
|
||||
color: #fffdd8;
|
||||
}
|
||||
&:hover {
|
||||
color: #fff;
|
||||
@extend %trans;
|
||||
}
|
||||
}
|
||||
.search-time, .search-tag, .search-category {
|
||||
display: inline-block;
|
||||
font-size: 12px;
|
||||
color: #fffdd8;
|
||||
margin-right: 10px;
|
||||
.icon {
|
||||
margin-right: 0px;
|
||||
}
|
||||
span {
|
||||
cursor: pointer;
|
||||
margin-right: 5px;
|
||||
&:hover {
|
||||
color: #fff;
|
||||
@extend %trans;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.tools-section-friends {
|
||||
padding-top: 30px;
|
||||
}
|
||||
.aboutme-wrap {
|
||||
display: flex;
|
||||
align-items:center;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
color: #fffdd8;
|
||||
text-shadow: 1px 1px rgba(77, 77, 77, 0.45);
|
||||
}
|
||||
}
|
||||
218
themes/yilia/source-src/css/tooltip.scss
Normal file
218
themes/yilia/source-src/css/tooltip.scss
Normal file
@ -0,0 +1,218 @@
|
||||
.tooltip-left {
|
||||
.tooltip {
|
||||
position: absolute;
|
||||
z-index: 999;
|
||||
cursor: pointer;
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
top: -10px;
|
||||
right: 10px;
|
||||
&:hover {
|
||||
a.share-outer {
|
||||
background: #24c1f6;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* Trigger item */
|
||||
|
||||
@-webkit-keyframes pulse {
|
||||
from { -webkit-transform: scale3d(0.5,0.5,1); }
|
||||
to { -webkit-transform: scale3d(1,1,1); }
|
||||
}
|
||||
|
||||
@keyframes pulse {
|
||||
from { -webkit-transform: scale3d(0.5,0.5,1); transform: scale3d(0.5,0.5,1); }
|
||||
to { -webkit-transform: scale3d(1,1,1); transform: scale3d(1,1,1); }
|
||||
}
|
||||
|
||||
/* Tooltip */
|
||||
|
||||
.tooltip-content {
|
||||
position: absolute;
|
||||
background: rgba(36,193,246,0.9);
|
||||
z-index: 9999;
|
||||
width: 200px;
|
||||
bottom: 50%;
|
||||
margin-bottom: -10px;
|
||||
border-radius: 20px;
|
||||
font-size: 1.1em;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
opacity: 0;
|
||||
cursor: default;
|
||||
pointer-events: none;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
|
||||
transition: opacity 0.3s, transform 0.3s;
|
||||
}
|
||||
|
||||
.tooltip-west .tooltip-content {
|
||||
left: 3.5em;
|
||||
-webkit-transform-origin: -2em 50%;
|
||||
transform-origin: -2em 50%;
|
||||
-webkit-transform: translate3d(0,50%,0) rotate3d(1,1,1,30deg);
|
||||
transform: translate3d(0,50%,0) rotate3d(1,1,1,30deg);
|
||||
}
|
||||
|
||||
.tooltip-east .tooltip-content {
|
||||
right: 3.5em;
|
||||
-webkit-transform-origin: calc(100% + 2em) 50%;
|
||||
transform-origin: calc(100% + 2em) 50%;
|
||||
-webkit-transform: translate3d(0,50%,0) rotate3d(1,1,1,-30deg);
|
||||
transform: translate3d(0,50%,0) rotate3d(1,1,1,-30deg);
|
||||
}
|
||||
|
||||
.tooltip:hover .tooltip-content {
|
||||
opacity: 1;
|
||||
-webkit-transform: translate3d(0,50%,0) rotate3d(0,0,0,0);
|
||||
transform: translate3d(0,50%,0) rotate3d(0,0,0,0);
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* Gap "bridge" and arrow */
|
||||
|
||||
.tooltip-content::before,
|
||||
.tooltip-content::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.tooltip-content::before {
|
||||
height: 100%;
|
||||
width: 3em;
|
||||
}
|
||||
|
||||
.tooltip-content::after {
|
||||
width: 2em;
|
||||
height: 2em;
|
||||
top: 50%;
|
||||
margin: -1em 0 0;
|
||||
background: url(./img/tooltip.svg) no-repeat center center;
|
||||
background-size: 100%;
|
||||
}
|
||||
|
||||
.tooltip-west .tooltip-content::before,
|
||||
.tooltip-west .tooltip-content::after {
|
||||
right: 99%; /* because of FF, otherwise we have a gap */
|
||||
}
|
||||
|
||||
.tooltip-east .tooltip-content::before,
|
||||
.tooltip-east .tooltip-content::after {
|
||||
left: 99%; /* because of FF, otherwise we have a gap */
|
||||
}
|
||||
|
||||
.tooltip-east .tooltip-content::after {
|
||||
-webkit-transform: scale3d(-1,1,1);
|
||||
transform: scale3d(-1,1,1);
|
||||
}
|
||||
}
|
||||
|
||||
.tooltip-top {
|
||||
.tooltip {
|
||||
display: inline;
|
||||
position: relative;
|
||||
z-index: 999;
|
||||
}
|
||||
|
||||
/* Gap filler */
|
||||
.tooltip::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 20px;
|
||||
bottom: 100%;
|
||||
left: 50%;
|
||||
pointer-events: none;
|
||||
-webkit-transform: translateX(-50%);
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
|
||||
.tooltip:hover::after {
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
/* Tooltip */
|
||||
|
||||
.tooltip-content {
|
||||
position: absolute;
|
||||
z-index: 9999;
|
||||
width: 370px;
|
||||
left: 50%;
|
||||
bottom: 100%;
|
||||
font-size: 20px;
|
||||
line-height: 1.4;
|
||||
text-align: center;
|
||||
font-weight: 400;
|
||||
color: #4d4d4d;
|
||||
background: transparent;
|
||||
opacity: 0;
|
||||
margin: 0 0 -10px -185px;
|
||||
cursor: default;
|
||||
pointer-events: none;
|
||||
font-family: 'Satisfy', cursive;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-webkit-transition: opacity 0.3s 0.3s;
|
||||
transition: opacity 0.3s 0.3s;
|
||||
padding-bottom: 80px;
|
||||
}
|
||||
|
||||
.tooltip:hover .tooltip-content {
|
||||
opacity: 1;
|
||||
pointer-events: auto;
|
||||
-webkit-transition-delay: 0s;
|
||||
transition-delay: 0s;
|
||||
}
|
||||
|
||||
.tooltip-content span {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.tooltip-text {
|
||||
border-bottom: 10px solid #4d4d4d;
|
||||
overflow: hidden;
|
||||
-webkit-transform: scale3d(0,1,1);
|
||||
transform: scale3d(0,1,1);
|
||||
-webkit-transition: -webkit-transform 0.3s 0.3s;
|
||||
transition: transform 0.3s 0.3s;
|
||||
}
|
||||
|
||||
.tooltip:hover .tooltip-text {
|
||||
-webkit-transition-delay: 0s;
|
||||
transition-delay: 0s;
|
||||
-webkit-transform: scale3d(1,1,1);
|
||||
transform: scale3d(1,1,1);
|
||||
}
|
||||
|
||||
.tooltip-inner {
|
||||
background: rgba(36,193,246,0.9);
|
||||
padding: 40px;
|
||||
-webkit-transform: translate3d(0,100%,0);
|
||||
transform: translate3d(0,100%,0);
|
||||
webkit-transition: -webkit-transform 0.3s;
|
||||
transition: transform 0.3s;
|
||||
}
|
||||
|
||||
.tooltip:hover .tooltip-inner {
|
||||
-webkit-transition-delay: 0.3s;
|
||||
transition-delay: 0.3s;
|
||||
-webkit-transform: translate3d(0,0,0);
|
||||
transform: translate3d(0,0,0);
|
||||
}
|
||||
|
||||
/* Arrow */
|
||||
|
||||
.tooltip-content::after {
|
||||
content: '';
|
||||
left: 50%;
|
||||
border: solid transparent;
|
||||
height: 0;
|
||||
width: 0;
|
||||
position: absolute;
|
||||
pointer-events: none;
|
||||
border-color: transparent;
|
||||
border-top-color: #4d4d4d;
|
||||
border-width: 10px;
|
||||
margin-left: -10px;
|
||||
}
|
||||
}
|
||||
95
themes/yilia/source-src/js/anm.js
Normal file
95
themes/yilia/source-src/js/anm.js
Normal file
@ -0,0 +1,95 @@
|
||||
function init() {
|
||||
var width, height, largeHeader, canvas, ctx, circles, target, animateHeader = true;
|
||||
|
||||
// Main
|
||||
initHeader();
|
||||
addListeners();
|
||||
|
||||
function initHeader() {
|
||||
width = window.innerWidth;
|
||||
height = window.innerHeight;
|
||||
target = {x: 0, y: height};
|
||||
|
||||
largeHeader = document.getElementById('container');
|
||||
largeHeader.style.height = height+'px';
|
||||
|
||||
canvas = document.getElementById('anm-canvas');
|
||||
canvas.width = width;
|
||||
canvas.height = height;
|
||||
ctx = canvas.getContext('2d');
|
||||
|
||||
// create particles
|
||||
circles = [];
|
||||
for(var x = 0; x < width*0.5; x++) {
|
||||
var c = new Circle();
|
||||
circles.push(c);
|
||||
}
|
||||
animate();
|
||||
}
|
||||
|
||||
// Event handling
|
||||
function addListeners() {
|
||||
window.addEventListener('scroll', scrollCheck);
|
||||
window.addEventListener('resize', resize);
|
||||
}
|
||||
|
||||
function scrollCheck() {
|
||||
if(document.body.scrollTop > height) animateHeader = false;
|
||||
else animateHeader = true;
|
||||
}
|
||||
|
||||
function resize() {
|
||||
width = window.innerWidth;
|
||||
height = window.innerHeight;
|
||||
largeHeader.style.height = height+'px';
|
||||
canvas.width = width;
|
||||
canvas.height = height;
|
||||
}
|
||||
|
||||
function animate() {
|
||||
if(animateHeader) {
|
||||
ctx.clearRect(0,0,width,height);
|
||||
for(var i in circles) {
|
||||
circles[i].draw();
|
||||
}
|
||||
}
|
||||
requestAnimationFrame(animate);
|
||||
}
|
||||
|
||||
// Canvas manipulation
|
||||
function Circle() {
|
||||
var _this = this;
|
||||
|
||||
// constructor
|
||||
(function() {
|
||||
_this.pos = {};
|
||||
init();
|
||||
//console.log(_this);
|
||||
})();
|
||||
|
||||
function init() {
|
||||
_this.pos.x = Math.random()*width;
|
||||
_this.pos.y = height+Math.random()*100;
|
||||
_this.alpha = 0.1+Math.random()*0.3;
|
||||
_this.scale = 0.1+Math.random()*0.3;
|
||||
_this.velocity = Math.random();
|
||||
}
|
||||
|
||||
this.draw = function() {
|
||||
if(_this.alpha <= 0) {
|
||||
init();
|
||||
}
|
||||
_this.pos.y -= _this.velocity;
|
||||
_this.alpha -= 0.0005;
|
||||
ctx.beginPath();
|
||||
ctx.arc(_this.pos.x, _this.pos.y, _this.scale*10, 0, 2 * Math.PI, false);
|
||||
ctx.fillStyle = 'rgba(255,255,255,'+ _this.alpha+')';
|
||||
ctx.fill();
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
module.exports = {
|
||||
init: init
|
||||
}
|
||||
47
themes/yilia/source-src/js/aside.js
Normal file
47
themes/yilia/source-src/js/aside.js
Normal file
@ -0,0 +1,47 @@
|
||||
var backTop = function (domE, ctn, distance) {
|
||||
if (!domE) return;
|
||||
var timer = null;
|
||||
var _onscroll = window.onscroll,
|
||||
_onclick = domE.onclick;
|
||||
(ctn || window).onscroll = throttle(function () {
|
||||
typeof _onscroll === 'function' && _onscroll.apply(this, arguments);
|
||||
toggleDomE();
|
||||
}, 100);
|
||||
domE.onclick = function () {
|
||||
typeof _onclick === 'function' && _onclick.apply(this, arguments);
|
||||
var baseCt = ctn.scrollTop || document.documentElement.scrollTop || document.body.scrollTop;
|
||||
timer = setInterval(function () { //设置一个计时器
|
||||
var ct = ctn.scrollTop || document.documentElement.scrollTop || document.body.scrollTop; //获取距离顶部的距离
|
||||
var diff = Math.max(10, ct / 6);
|
||||
ct -= diff;
|
||||
if (ct > 0) {//如果与顶部的距离大于零
|
||||
ctn.scrollTop = ctn.scrollTop - diff;
|
||||
window.scrollTo(0, ct);//向上移动10px
|
||||
} else {//如果距离小于等于零
|
||||
ctn.scrollTop = 0;
|
||||
window.scrollTo(0, 0);//移动到顶部
|
||||
clearInterval(timer);//清除计时器
|
||||
}
|
||||
}, 10);//隔10ms执行一次前面的function，展现一种平滑滑动效果
|
||||
};
|
||||
|
||||
function toggleDomE() {
|
||||
domE.style.display = (ctn.scrollTop || document.documentElement.scrollTop || document.body.scrollTop) > (distance || 500) ? 'block' : 'none';
|
||||
}
|
||||
function throttle(func, wait) {
|
||||
var timer = null;
|
||||
return function () {
|
||||
var self = this, args = arguments;
|
||||
if (timer) clearTimeout(timer);
|
||||
timer = setTimeout(function () {
|
||||
return typeof func === 'function' && func.apply(self, args);
|
||||
}, wait);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
function init() {
|
||||
backTop(document.getElementById('js-jump-container'), document.getElementById('container'));
|
||||
}
|
||||
|
||||
export default { init }
|
||||
20
themes/yilia/source-src/js/browser.js
Normal file
20
themes/yilia/source-src/js/browser.js
Normal file
@ -0,0 +1,20 @@
|
||||
var browser = {
|
||||
versions: function() {
|
||||
var u = window.navigator.userAgent;
|
||||
return {
|
||||
trident: u.indexOf('Trident') > -1, //IE内核
|
||||
presto: u.indexOf('Presto') > -1, //opera内核
|
||||
webKit: u.indexOf('AppleWebKit') > -1, //苹果、谷歌内核
|
||||
gecko: u.indexOf('Gecko') > -1 && u.indexOf('KHTML') == -1, //火狐内核
|
||||
mobile: !!u.match(/AppleWebKit.*Mobile.*/), //是否为移动终端
|
||||
ios: !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/), //ios终端
|
||||
android: u.indexOf('Android') > -1 || u.indexOf('Linux') > -1, //android终端或者uc浏览器
|
||||
iPhone: u.indexOf('iPhone') > -1 || u.indexOf('Mac') > -1, //是否为iPhone或者安卓QQ浏览器
|
||||
iPad: u.indexOf('iPad') > -1, //是否为iPad
|
||||
webApp: u.indexOf('Safari') == -1, //是否为web应用程序，没有头部与底部
|
||||
weixin: u.indexOf('MicroMessenger') == -1 //是否为微信浏览器
|
||||
};
|
||||
}()
|
||||
}
|
||||
|
||||
module.exports = browser
|
||||
39
themes/yilia/source-src/js/fix.js
Normal file
39
themes/yilia/source-src/js/fix.js
Normal file
@ -0,0 +1,39 @@
|
||||
function init() {
|
||||
// 由于hexo分页不支持，手工美化
|
||||
var $nav = document.querySelector('#page-nav')
|
||||
if ($nav && !document.querySelector('#page-nav .extend.prev')) {
|
||||
$nav.innerHTML = '<a class="extend prev disabled" rel="prev">« Prev</a>' + $nav.innerHTML
|
||||
}
|
||||
if ($nav && !document.querySelector('#page-nav .extend.next')) {
|
||||
$nav.innerHTML = $nav.innerHTML + '<a class="extend next disabled" rel="next">Next »</a>'
|
||||
}
|
||||
|
||||
// 新窗口打开
|
||||
if (yiliaConfig && yiliaConfig.open_in_new) {
|
||||
let $a = document.querySelectorAll(('.article-entry a:not(.article-more-a)'))
|
||||
$a.forEach(($em) => {
|
||||
let target = $em.getAttribute('target');
|
||||
if (!target || target === '') {
|
||||
$em.setAttribute('target', '_blank');
|
||||
}
|
||||
})
|
||||
}
|
||||
// 目录序号
|
||||
if (yiliaConfig && yiliaConfig.toc_hide_index) {
|
||||
let $a = document.querySelectorAll(('.toc-number'))
|
||||
$a.forEach(($em) => {
|
||||
$em.style.display = 'none';
|
||||
})
|
||||
}
|
||||
|
||||
// about me 转义
|
||||
var $aboutme = document.querySelector('#js-aboutme')
|
||||
if ($aboutme && $aboutme.length !== 0) {
|
||||
$aboutme.innerHTML = $aboutme.innerText
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
module.exports = {
|
||||
init: init
|
||||
}
|
||||
18
themes/yilia/source-src/js/main.js
Normal file
18
themes/yilia/source-src/js/main.js
Normal file
@ -0,0 +1,18 @@
|
||||
// 样式
|
||||
import '../css/main.scss'
|
||||
// 上报
|
||||
// import './report'
|
||||
// 图片查看器
|
||||
import Viewer from './viewer'
|
||||
// 分享
|
||||
import Share from './share'
|
||||
// 边缘
|
||||
import Aside from './aside'
|
||||
|
||||
import {addLoadEvent} from './util'
|
||||
|
||||
addLoadEvent(function() {
|
||||
Share.init()
|
||||
Viewer.init()
|
||||
Aside.init()
|
||||
})
|
||||
104
themes/yilia/source-src/js/mobile.js
Normal file
104
themes/yilia/source-src/js/mobile.js
Normal file
@ -0,0 +1,104 @@
|
||||
import addClass from 'dom101/add-class'
|
||||
import removeClass from 'dom101/remove-class'
|
||||
import after from 'dom101/after'
|
||||
// 浏览器判断
|
||||
import Browser from './browser'
|
||||
// fix hexo 不支持的配置
|
||||
import Fix from './fix'
|
||||
|
||||
import {addLoadEvent} from './util'
|
||||
|
||||
function isPathMatch(path, href) {
|
||||
let reg = /\/|index.html/g
|
||||
return (path.replace(reg, '')) === (href.replace(reg, ''))
|
||||
}
|
||||
|
||||
function tabActive() {
|
||||
let $tabs = document.querySelectorAll('.js-header-menu li a')
|
||||
let path = window.location.pathname
|
||||
|
||||
for (var i = 0, len = $tabs.length; i < len; i++) {
|
||||
let $tab = $tabs[i]
|
||||
if (isPathMatch(path, $tab.getAttribute('href'))) {
|
||||
addClass($tab, 'active')
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function getElementLeft(element) {
|
||||
var actualLeft = element.offsetLeft;
|
||||
var current = element.offsetParent;
|
||||
while (current !== null) {
|
||||
actualLeft += current.offsetLeft;
|
||||
current = current.offsetParent;
|
||||
}
|
||||
return actualLeft;
|
||||
}
|
||||
function getElementTop(element) {
|
||||
var actualTop = element.offsetTop;
|
||||
var current = element.offsetParent;
|
||||
while (current !== null) {
|
||||
actualTop += current.offsetTop;
|
||||
current = current.offsetParent;
|
||||
}
|
||||
return actualTop;
|
||||
}
|
||||
|
||||
function scrollStop($dom, top, limit, zIndex, diff) {
|
||||
let nowLeft = getElementLeft($dom)
|
||||
let nowTop = getElementTop($dom) - top
|
||||
|
||||
if (nowTop - limit <= diff) {
|
||||
let $newDom = $dom.$newDom
|
||||
if (!$newDom) {
|
||||
$newDom = $dom.cloneNode(true)
|
||||
after($dom, $newDom)
|
||||
$dom.$newDom = $newDom
|
||||
$newDom.style.position = 'fixed'
|
||||
$newDom.style.top = (limit || nowTop) + 'px'
|
||||
$newDom.style.left = nowLeft + 'px'
|
||||
$newDom.style.zIndex = zIndex || 2
|
||||
$newDom.style.width = '100%'
|
||||
$newDom.style.color = '#fff'
|
||||
}
|
||||
$newDom.style.visibility = 'visible'
|
||||
$dom.style.visibility = 'hidden'
|
||||
} else {
|
||||
$dom.style.visibility = 'visible'
|
||||
let $newDom = $dom.$newDom
|
||||
if ($newDom) {
|
||||
$newDom.style.visibility = 'hidden'
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function handleScroll() {
|
||||
let $overlay = document.querySelector('.js-overlay')
|
||||
let $menu = document.querySelector('.js-header-menu')
|
||||
scrollStop($overlay, document.body.scrollTop, -63, 2, 0)
|
||||
scrollStop($menu, document.body.scrollTop, 1, 3, 0)
|
||||
}
|
||||
|
||||
function bindScroll() {
|
||||
document.querySelector('#container').addEventListener('scroll', (e) => {
|
||||
handleScroll()
|
||||
})
|
||||
|
||||
window.addEventListener('scroll', (e) => {
|
||||
handleScroll()
|
||||
})
|
||||
handleScroll()
|
||||
}
|
||||
|
||||
function init() {
|
||||
if (Browser.versions.mobile && window.screen.width < 800) {
|
||||
tabActive()
|
||||
bindScroll()
|
||||
}
|
||||
}
|
||||
|
||||
init();
|
||||
|
||||
addLoadEvent(function() {
|
||||
Fix.init()
|
||||
})
|
||||
79
themes/yilia/source-src/js/share.js
Normal file
79
themes/yilia/source-src/js/share.js
Normal file
@ -0,0 +1,79 @@
|
||||
import addClass from 'dom101/add-class'
|
||||
import removeClass from 'dom101/remove-class'
|
||||
|
||||
function generate(url, opts) {
|
||||
var url = url.replace(/<%-sUrl%>/g, encodeURIComponent(opts.sUrl))
|
||||
.replace(/<%-sTitle%>/g, opts.sTitle)
|
||||
.replace(/<%-sDesc%>/g, opts.sDesc)
|
||||
.replace(/<%-sPic%>/g, encodeURIComponent(opts.sPic));
|
||||
|
||||
window.open(url);
|
||||
}
|
||||
|
||||
function showWX() {
|
||||
let $wx = document.querySelector('.js-wx-box')
|
||||
let $mask = document.querySelector('.mask')
|
||||
addClass($wx, 'in')
|
||||
addClass($wx, 'ready')
|
||||
addClass($mask, 'in')
|
||||
}
|
||||
|
||||
function hideWX() {
|
||||
let $wx = document.querySelector('.js-wx-box')
|
||||
let $mask = document.querySelector('.mask')
|
||||
removeClass($wx, 'in')
|
||||
removeClass($wx, 'ready')
|
||||
removeClass($mask, 'in')
|
||||
}
|
||||
|
||||
function handleClick(type, opts) {
|
||||
if (type === 'weibo') {
|
||||
generate('http://service.weibo.com/share/share.php?url=<%-sUrl%>&title=<%-sTitle%>&pic=<%-sPic%>', opts)
|
||||
} else if (type === 'qq') {
|
||||
generate('http://connect.qq.com/widget/shareqq/index.html?url=<%-sUrl%>&title=<%-sTitle%>&source=<%-sDesc%>', opts)
|
||||
} else if (type === 'douban') {
|
||||
generate('https://www.douban.com/share/service?image=<%-sPic%>&href=<%-sUrl%>&name=<%-sTitle%>&text=<%-sDesc%>', opts)
|
||||
} else if (type === 'qzone') {
|
||||
generate('http://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?url=<%-sUrl%>&title=<%-sTitle%>&pics=<%-sPic%>&summary=<%-sDesc%>', opts)
|
||||
} else if (type === 'facebook') {
|
||||
generate('https://www.facebook.com/sharer/sharer.php?u=<%-sUrl%>', opts)
|
||||
} else if (type === 'twitter') {
|
||||
generate('https://twitter.com/intent/tweet?text=<%-sTitle%>&url=<%-sUrl%>&via=<%-config.url%>', opts)
|
||||
} else if (type === 'google') {
|
||||
generate('https://plus.google.com/share?url=<%-sUrl%>', opts)
|
||||
} else if (type === 'weixin') {
|
||||
showWX();
|
||||
}
|
||||
}
|
||||
|
||||
let init = function() {
|
||||
let $sns = document.querySelectorAll('.share-sns');
|
||||
if (!$sns || $sns.length === 0) return;
|
||||
|
||||
let sUrl = window.location.href;
|
||||
let sTitle = document.querySelector('title').innerHTML;
|
||||
let $img = document.querySelectorAll('.article-entry img');
|
||||
let sPic = $img.length ? document.querySelector('.article-entry img').getAttribute('src') : '';
|
||||
if ((sPic !== '') && !/^(http:|https:)?\/\//.test(sPic)) {
|
||||
sPic = window.location.origin + sPic
|
||||
}
|
||||
|
||||
$sns.forEach(($em) => {
|
||||
$em.onclick = (e) => {
|
||||
let type = $em.getAttribute('data-type')
|
||||
handleClick(type, {
|
||||
sUrl: sUrl,
|
||||
sPic: sPic,
|
||||
sTitle: sTitle,
|
||||
sDesc: sTitle
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
document.querySelector('.mask').onclick = hideWX
|
||||
document.querySelector('.js-modal-close').onclick = hideWX
|
||||
}
|
||||
|
||||
module.exports = {
|
||||
init: init
|
||||
}
|
||||
130
themes/yilia/source-src/js/slider.js
Normal file
130
themes/yilia/source-src/js/slider.js
Normal file
@ -0,0 +1,130 @@
|
||||
// 动画
|
||||
import Anm from './anm'
|
||||
// 浏览器判断
|
||||
import Browser from './browser'
|
||||
|
||||
import axios from 'axios'
|
||||
import Vue from './vue.min'
|
||||
|
||||
const isMobile = (Browser.versions.mobile && window.screen.width < 800)
|
||||
|
||||
function fixzero(str) {
|
||||
str = str + ''
|
||||
return str.length === 1 ? '0' + str : str
|
||||
}
|
||||
|
||||
function setScrollZero() {
|
||||
let $sct = document.querySelectorAll('.tools-section')
|
||||
$sct.forEach((em) => {
|
||||
em.scrollTop = 0
|
||||
})
|
||||
}
|
||||
let vm = new Vue({
|
||||
el: '#container',
|
||||
data: {
|
||||
isCtnShow: false,
|
||||
isShow: false,
|
||||
items: [],
|
||||
innerArchive: false,
|
||||
friends: false,
|
||||
aboutme: false,
|
||||
jsonFail: false,
|
||||
showTags: false,
|
||||
showCategories: false,
|
||||
search: null
|
||||
},
|
||||
methods: {
|
||||
stop (event) {
|
||||
event.stopPropagation()
|
||||
},
|
||||
chose (name, prefix) {
|
||||
this.search = prefix + name
|
||||
},
|
||||
clearChose () {
|
||||
this.search = null
|
||||
},
|
||||
openSlider (event, type) {
|
||||
event.stopPropagation()
|
||||
this.innerArchive = false
|
||||
this.friends = false
|
||||
this.aboutme = false
|
||||
this[type] = true
|
||||
this.isShow = true
|
||||
this.isCtnShow = true
|
||||
setScrollZero()
|
||||
},
|
||||
hideSlider () {
|
||||
if (this.isShow) {
|
||||
this.isShow = false
|
||||
setTimeout(() => {
|
||||
this.isCtnShow = false
|
||||
}, 300)
|
||||
}
|
||||
}
|
||||
},
|
||||
filters: {
|
||||
urlformat: (str) => {
|
||||
if (window.yiliaConfig && window.yiliaConfig.root) {
|
||||
return window.yiliaConfig.root + str
|
||||
}
|
||||
return '/' + str
|
||||
},
|
||||
dateformat: (str) => {
|
||||
let d = new Date(str)
|
||||
return d.getFullYear() + '-' + fixzero((d.getMonth() + 1)) + '-' + fixzero(d.getDate())
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
search (newVal, oldVal) {
|
||||
if(newVal) {
|
||||
handleSearch.call(this, newVal.toLowerCase())
|
||||
} else {
|
||||
this.items.forEach(function(item){
|
||||
item.isHide = false
|
||||
})
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
axios.get(window.yiliaConfig.root + 'content.json?t=' + (+ new Date()))
|
||||
.then((res)=>{
|
||||
this.items = res.data
|
||||
}).catch((err) => {
|
||||
this.jsonFail = true
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
function handleSearch(val) {
|
||||
var type
|
||||
if (val.startsWith('#')) {
|
||||
val = val.substr(1, val.length)
|
||||
type = 'tag'
|
||||
} else if (val.startsWith('$')) {
|
||||
val = val.substr(1, val.length)
|
||||
type = 'category'
|
||||
} else {
|
||||
type = 'title'
|
||||
}
|
||||
this.items.forEach((item) => {
|
||||
switch(type) {
|
||||
case 'title' :
|
||||
item.isHide = item.title.toLowerCase().indexOf(val) < 0
|
||||
break
|
||||
case 'tag' :
|
||||
item.isHide = Array.prototype.every.call(item.tags, function(tag){
|
||||
return tag.name.toLowerCase().indexOf(val) < 0
|
||||
})
|
||||
break
|
||||
case 'category' :
|
||||
item.isHide = Array.prototype.every.call(item.categories, function(category){
|
||||
return category.name.toLowerCase().indexOf(val) < 0
|
||||
})
|
||||
break
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
if (!isMobile) {
|
||||
Anm.init()
|
||||
}
|
||||
Some files were not shown because too many files have changed in this diff Show More
Loading…
x
Reference in New Issue
Block a user