Skip to content

Y
yanglr2010

大白技术控 / yanglr2010

通知 1
Star 1
Fork 0
Y
yanglr2010

前往新版Gitcode，体验更适合开发者的 AI 搜索 >>

提交 3374ba2e 编写于 作者: EvanOne(文一)'s avatar EvanOne(文一)
浏览文件
操作

refactor: Refactor post & homepage

上级 044af0e5
隐藏空白更改
内联 并排
Showing with 558 addition and 545 deletion
FAQ.md
浏览文件 @ 3374ba2e
......@@ -9,7 +9,7 @@
使用 `stun` 主题运行后，浏览器里显示：
`
n/layout.pug block content include ./_mixins/post-list.pug include ./_mixins/post-header.pug div.content.code-highlight if theme.post_list_paged.home include ./_components/recent-posts.pug include ./_components/pagination.pug else include ./_components/recent-posts.pug
n/layout.pug block content include ./_mixins/post-timeline.pug include ./_mixins/post-header.pug div.content.code-highlight if theme.post_list_paged.home include ./_components/recent-posts.pug include ./_components/pagination.pug else include ./_components/recent-posts.pug
`
原因是没有安装对 `pug` 的支持。文档和 READMD 都有提到：
......
_config.yml
浏览文件 @ 3374ba2e
# ---------------------------------------------------------------
# Theme Core Configuration Settings
# ---------------------------------------------------------------
# Allow to cache content generation. Introduced in Stun v1.4.0
cache: true
# # Minify source files after hexo generator. Introduced in Stun v1.4.0
# minify: true
# ---------------------------------------------------------------
# SEO Settings
# ---------------------------------------------------------------
# If true, will add site-subtitle to index page.
# Remember to set up your site-subtitle in Hexo `_config.yml`.
index_subtitle: false
# Webmaster tools verification setting
# ---------------------------------------------------------------
# Google Webmaster tools verification setting
# See: https://www.google.com/webmasters/
google_site_verification:
# Bing Webmaster tools verification setting
# See: https://www.bing.com/webmaster/
bing_site_verification:
# Baidu Webmaster tools verification setting
# See: https://ziyuan.baidu.com/site/
baidu_site_verification:
# 360 Webmaster tools verification setting
# see http://zhanzhang.so.com/
qihu360_site_verification:
# ---------------------------------------------------------------
# Menu config
# ---------------------------------------------------------------
......@@ -159,6 +195,7 @@ sidebar:
offsetTop: 20px
# Horizon line.
horizon_line: true
width: 260px
author:
enable: true
......@@ -316,23 +353,16 @@ stick_top:
# Code highlight.
# values:
# - light
# - dark
# - ocean
# - light
# - dark
# - ocean
highlight_theme: light
# Code wrap
# values: true or false.
# Code wrap.
code_word_wrap: false
# Horizonal alignment of img.
# values:
# - left
# - center
# - right
#
# If you empty it, images will show by default.
img_horizonal_align:
# Add a line below h1, h2.
heading_line: true
# Reward
reward:
......@@ -532,26 +562,6 @@ math:
copy_tex_js: https://cdn.jsdelivr.net/npm/katex@0.10.2/dist/contrib/copy-tex.min.js
copy_tex_css: https://cdn.jsdelivr.net/npm/katex@0.10.2/dist/contrib/copy-tex.css
# ---------------------------------------------------------------
# Webmaster tools verification config
# ---------------------------------------------------------------
# Google Webmaster tools verification setting
# See: https://www.google.com/webmasters/
google_site_verification:
# Bing Webmaster tools verification setting
# See: https://www.bing.com/webmaster/
bing_site_verification:
# Baidu Webmaster tools verification setting
# See: https://ziyuan.baidu.com/site/
baidu_site_verification:
# 360 Webmaster tools verification setting
# see http://zhanzhang.so.com/
qihu360_site_verification:
# ---------------------------------------------------------------
# Other config
# ---------------------------------------------------------------
......@@ -676,6 +686,11 @@ js: js
# In theme directory (source/images).
images: images
# The common prefix of the FontAwesome icon.
# Using "fa" prefix in version 4.
# Using "fas | far | fal | fad | fab" prefix in version 5.
fa_prefix: fa
# Set a CDN address for the vendor you want to customize.
# ! -----------------------------------------------------
# ! Do not edit the follow configs.
......
layout/_layout.pug
浏览文件 @ 3374ba2e
......@@ -11,13 +11,15 @@ html(lang=config.language)
main#main.main
div.main-inner
div#content.content
div.content-inner(class=`${is_home() ? 'home' : ''}`)
div.content-inner(class=`${is_home() ? 'content-home' : ''}`)
block content
aside#sidebar.sidebar
div.sidebar-inner
!= partial('./_partials/sidebar/sidebar.pug', null, { cache: theme.cache })
div.clearfix
footer#footer.footer
div.footer-inner
!= partial('./_partials/footer/footer.pug', null, { cache: theme.cache })
......
layout/_mixins/post-header.pug
浏览文件 @ 3374ba2e
mixin postHeader(post)
header.post-header
- var fa_prefix = theme.fa_prefix || 'fa'
if post.top
include ../_components/sticky-top.pug
include ../_partials/widgets/sticky-top.pug
if is_post()
h1.post-title= post.title || _p("post.untitled")
h1.post-header-title= post.title || __("post.untitled")
else
if post.link
h1.post-title
a(href=url_for(post.link) target="_blank" rel="noopener"
).post-title-link= post.title || post.link
else
h1.post-title
a(href=url_for(post.path)
).post-title-link= post.title || _p("post.untitled")
h1.post-header-title
if post.link
a(href=url_for(post.link) target="_blank" rel="noopener" ).post-header-title__a= post.title || post.link
else
a(href=url_for(post.path)).post-header-title__a= post.title || __("post.untitled")
if !post.link
div.post-meta
div.post-header-meta
if theme.post_meta.created.enable
span.post-create
i(class=`fa fa-${theme.post_meta.created.icon}`)
span.post-header-meta-create
i(class=`${fa_prefix} fa-${theme.post_meta.created.icon}`)
if !theme.post_meta.icon_only
span= _p("post.posted") + " "
span= __("post.posted") + " "
span= full_date(post.date, "YYYY-MM-DD")
if theme.post_meta.updated.enable
span.post-update
i(class=`fa fa-${theme.post_meta.updated.icon}`)
span.post-header-meta-update
i(class=`${fa_prefix} fa-${theme.post_meta.updated.icon}`)
if !theme.post_meta.icon_only
span= _p("post.updated") + " "
span= __("post.updated") + " "
span= full_date(post.updated, "YYYY-MM-DD")
if theme.post_meta.word_count.enable
span.post-word-count
i(class=`fa fa-${theme.post_meta.word_count.icon}`)
span.post-header-meta-word-count
i(class=`${fa_prefix} fa-${theme.post_meta.word_count.icon}`)
if !theme.post_meta.icon_only
span= _p("post.word_count") + " "
span= __("post.word_count") + " "
span= wordcount(post.content)
if theme.post_meta.reading_time.enable
- var postReadingTime = theme.post_meta.reading_time
span.post-reading-time
i(class=`fa fa-${postReadingTime.icon}`)
span.post-header-meta-reading-time
i(class=`${fa_prefix} fa-${postReadingTime.icon}`)
if !theme.post_meta.icon_only
span= _p("post.reading_time") + " "
span= __("post.reading_time") + " "
- var READING_TIME_UNIT = "m";
span= min2read(post.content, {cn: postReadingTime.speed.zh, en: postReadingTime.speed.en}) + READING_TIME_UNIT
......@@ -55,17 +54,17 @@ mixin postHeader(post)
span(id=url_for(post.path) data-flag-title=post.title).leancloud_visitors
i.fa.fa-eye
if !theme.post_meta.icon_only
span= _p("post.reading_count") + " "
span= __("post.reading_count") + " "
span.leancloud-visitors-count
//- Can`t show the result of busuanzi counting in homepage,
//- because will conflict by ID selector.
if is_post()
if theme.busuanzi.enable && theme.busuanzi.post_pv.enable
span.post-reading-count
i(class=`fa fa-${theme.busuanzi.post_pv.icon}`)
span.post-header-reading-count
i(class=`${fa_prefix} fa-${theme.busuanzi.post_pv.icon}`)
if !theme.post_meta.icon_only && !theme.busuanzi.post_pv.icon_only
span= _p("post.reading_count") + " "
span= __("post.reading_count") + " "
span#busuanzi_value_page_pv
layout/_mixins/post-list.pug → layout/_mixins/post-timeline.pug
浏览文件 @ 3374ba2e
mixin postList(posts)
section.post-list
mixin postTimeline(posts)
section.post-timeline
- var year, tmpYear
- posts.each(function (post) {
if post.date
......@@ -7,14 +7,14 @@ mixin postList(posts)
if tmpYear !== year
- year = tmpYear
time.post-list-item.year= year
time.post-timeline-item.year= year
post.post-list-item
article.post-timeline-item
if post.date
time.post-list-item__time= full_date(post.date, "MM-DD")
h2.post-list-item-title
time.post-timeline-item__time= full_date(post.date, "MM-DD")
h2.post-timeline-item-title
if post.link
a.post-list-item-title__a(href=url_for(post.link) target="_blank" rel="noopener")= post.title || post.link
a.post-timeline-item-title__a(href=url_for(post.link) target="_blank" rel="noopener")= post.title || post.link
else
a.post-list-item-title__a(href=url_for(post.path))= post.title || __("post.untitled")
a.post-timeline-item-title__a(href=url_for(post.path))= post.title || __("post.untitled")
- })
layout/_partials/post/recent-posts.pug → layout/_partials/post/post-list.pug
浏览文件 @ 3374ba2e
section#recent-posts.recent-posts
//- include ../_mixins/post-header.pug
section.posts
include ../../_mixins/post-header.pug
//- include ../_mixins/gallery.pug
- var postLists = theme.post_list.paginate.home ? page.posts : site.posts
- postLists.each(function (post) {
article(class=`${post.link ? "post-link" : ""}`).post
//- +postHeader(post)
article.post(class=`${post.link ? "post-link-title" : ""}`)
+postHeader(post)
div.post-body
if theme.post_list.cover_image.home && post.top_image
......@@ -21,12 +21,12 @@ section#recent-posts.recent-posts
- content.length > theme.auto_excerpt.length ? excerpt += "......" : ""
div!= excerpt
else if post.excerpt
div.post-excerpt!= post.excerpt
div.post-body-excerpt!= post.excerpt
else
- isExcerpt = false
div.post-excerpt!= post.content
div.post-body-excerpt!= post.content
if !post.link && isExcerpt
div.post-btn
a(href=url_for(post.path))= _p("post.read_more") + " »"
div.post-body-more
a.post-body-more__a(href=url_for(post.path))= _p("post.read_more") + " »"
- })
layout/_partials/widgets/pagination.pug
浏览文件 @ 3374ba2e
-
var options = {
prev_text: '<i class="fa fa-chevron-left"></i>',
next_text: '<i class="fa fa-chevron-right"></i>',
mid_size: 1
}
nav.paginator
- var fa_prefix = theme.fa_prefix || 'fa'
nav#paginator
if (!is_post())
div.paginator-inner!= paginator(options)
if !is_post()
- var prev_text = `<i class="${fa_prefix} fa-chevron-left"></i>`
- var next_text = `<i class="${fa_prefix} fa-chevron-right"></i>`
div.paginator-inner!= paginator({ prev_text, next_text, mid_size: 1 })
else
div.post-paginator
if (page.prev)
div.article-prev.pull-left
a(href=url_for(page.prev.path))
i.fa.fa-chevron-left
span.title= page.prev.title || _p("post.untitled")
div.paginator-post
if page.prev
div.paginator-post-prev
a.paginator-post-prev__a(href=url_for(page.prev.path))
i(class=`${fa_prefix} fa-chevron-left`)
span= page.prev.title || __("post.untitled")
if (page.next)
div.article-next.pull-right
a(href=url_for(page.next.path))
span.title= page.next.title || _p("post.untitled")
i.fa.fa-chevron-right
if page.next
div.paginator-post-next
a.paginator-post-next__a(href=url_for(page.next.path))
span= page.next.title || __("post.untitled")
i(class=`${fa_prefix} fa-chevron-right`)
layout/archive.pug
浏览文件 @ 3374ba2e
extends ./_layout.pug
include ./_mixins/post-list.pug
include ./_mixins/post-timeline.pug
block content
div.archive
div.archive-total= site.posts.length === 0 ? __("page.posts-empty") : _p("page.posts-total", site.posts.length)
+postList(theme.post_list.paginate.archives ? page.posts : site.posts)
+postTimeline(theme.post_list.paginate.archives ? page.posts : site.posts)
//- if theme.post_list.paginate.archives
//- include ./_components/pagination.pug
if theme.post_list.paginate.archives
include ./_partials/widgets/pagination.pug
layout/category.pug
浏览文件 @ 3374ba2e
extends ./_layout.pug
include ./_mixins/post-list.pug
include ./_mixins/post-timeline.pug
block content
div.single-category
......@@ -8,6 +8,6 @@ block content
span= __("page.categories") + " -- "
span= page.category
+postList(page.posts)
+postTimeline(page.posts)
//- include ./_components/pagination.pug
include ./_partials/widgets/pagination.pug
layout/index.pug
浏览文件 @ 3374ba2e
extends ./_layout.pug
block content
include ./_partials/post/post-list.pug
if theme.post_list.paginate.home
include ./_partials/post/recent-posts.pug
//- include ./_components/pagination.pug
else
include ./_partials/post/recent-posts.pug
include ./_partials/widgets/pagination.pug
layout/main.pug 已删除 100644 → 0
浏览文件 @ 044af0e5
main#main
div.main-inner
if theme.sidebar.enable
include ./sidebar.pug
if body
div!= body
else
block content
//- if page.comments
//- include ../_components/comments.pug
div.clearfix
layout/post.pug
浏览文件 @ 3374ba2e
extends ./_layout.pug
block content
include ./_mixins/post-header.pug
include ./_mixins/gallery.pug
div.content.headings.code-highlight
+postHeader(page)
div.post-body
if page.photos && page.photos.length
+gallery(page)
!= page.content
footer.post-footer
if theme.post_widget.end_text.enable
div.post-footer-end
span= "------"
span= _p("post.end")
span= "------"
- var fa_prefix = theme.fa_prefix || 'fa'
- var themeConfigCC = theme.creative_commons.enable && theme.creative_commons.post
if page.copyright === false ? page.copyright : themeConfigCC
include ./_components/copyright.pug
if theme.post_widget.tags
if page.tags && page.tags.length > 0
div.post-footer-tags
i.fa.fa-tags.icon
each tag in page.tags.data
span!= link_to(tag.permalink, tag.name)
if page.reward === false ? page.reward : (theme.reward && theme.reward.enable)
include ./_components/reward.pug
include ./_components/pagination.pug
include ./_mixins/post-header.pug
//- include ./_mixins/gallery.pug
+postHeader(page)
div.post-body
if page.photos && page.photos.length
//- +gallery(page)
!= page.content
footer.post-footer
if theme.post_widget.end_text.enable
div.post-footer-end
span= "------ "
span= __("post.end")
span= " ------"
- var themeConfigCC = theme.creative_commons.enable && theme.creative_commons.post
if page.copyright === false ? page.copyright : themeConfigCC
//- include ./_components/copyright.pug
if theme.post_widget.tags
if page.tags && page.tags.length > 0
div.post-footer-tags
each tag in page.tags.data
span.post-footer-tags-item
i.post-footer-tags-item__i(class=`${fa_prefix} fa-tags`)
a.post-footer-tags-item__a(href=tag.permalink)= tag.name
//- if page.reward === false ? page.reward : (theme.reward && theme.reward.enable)
//- include ./_components/reward.pug
include ./_partials/widgets/pagination.pug
layout/tag.pug
浏览文件 @ 3374ba2e
extends ./_layout.pug
include ./_mixins/post-list.pug
include ./_mixins/post-timeline.pug
block content
div.single-tag
......@@ -8,6 +8,6 @@ block content
span= __("page.tags") + " -- "
span= page.tag
+postList(page.posts)
+postTimeline(page.posts)
//- include ./_components/pagination.pug
include ./_partials/widgets/pagination.pug
scripts/filters/external-link.js
浏览文件 @ 3374ba2e
......@@ -17,8 +17,9 @@ hexo.extend.filter.register('after_post_render', function(data) {
$('a').each(function() {
var href = $(this).attr('href');
if (!href) return;
var className = $(this).attr('class');
if (!href) return;
if (className && className.indexOf('friends-item') !== -1) return;
var data = url.parse(href);
......@@ -36,7 +37,7 @@ hexo.extend.filter.register('after_post_render', function(data) {
'</span>'
);
});
});
data.content = $.html();
}, 0);
scripts/filters/post-heading.js 0 → 100644
浏览文件 @ 3374ba2e
/* global hexo */
'use strict';
hexo.extend.filter.register('after_post_render', function (data) {
var cheerio;
if (!cheerio) cheerio = require('cheerio');
var $ = cheerio.load(data.content, { decodeEntities: false });
$('h1,h2,h3,h4,h5,h6').each(function () {
var $heading = $(this);
var $headingATag = $heading.find('a');
$headingATag.addClass('heading-link');
$heading.html($headingATag.html($heading.text().trim()));
});
data.content = $.html();
}, 0);
scripts/filters/wrap-table.js
浏览文件 @ 3374ba2e
......@@ -4,11 +4,11 @@
hexo.extend.filter.register('after_post_render', function (data) {
var cheerio;
if (!cheerio) cheerio = require('cheerio');
var $ = cheerio.load(data.content, { decodeEntities: false });
var $wrapper = $('<div style="overflow: auto"></div>');
var $wrapper = $('<div class="table-container"></div>');
$('table').wrap($wrapper);
data.content = $.html();
......
source/css/_common/components/index.styl
浏览文件 @ 3374ba2e
......@@ -2,6 +2,7 @@
@import './footer/index.styl';
@import './sidebar/index.styl';
@import './pages/page.styl';
@import './pages/index.styl';
@import './post/index.styl';
@import './widgets/index.styl';
source/css/_common/components/pages/main.styl 已删除 100644 → 0
浏览文件 @ 044af0e5
setUlStyle(content, hoverColor)
&::before
content: content
position: absolute
top: .04em
left: -1.5em
line-height: $line-height-base
color: $ul-list-color
transition: color .2s ease
transform: scale(.6)
@extend $font-face-awesome
&:hover
&::before
color: hoverColor
.content
border-radius: 5px
padding: 1.5rem 2rem
font-size: $font-main-base
background-color: $white
if (hexo-config('sidebar.enable'))
width: calc(100% - 320px)
if (hexo-config('sidebar.position') == 'left')
float: right
else
float: left
else
margin: 0 auto
width: calc(100% - 200px)
a
word-wrap: break-word
word-break: break-word
img
max-width: 100%
vertical-align: bottom
ul,
ol
margin: .5rem 0
padding-left: 2em
li
position: relative
if ($icon-ul-list-1 && ($icon-ul-list-2 && $icon-ul-list-3))
list-style-type: none
ul
li
setUlStyle($icon-ul-list-1, $ul-list-hover-color)
ul
li
setUlStyle($icon-ul-list-2, $ul-list-hover-color)
ul
li
setUlStyle($icon-ul-list-3, $ul-list-hover-color)
ol
counter-reset: ol-li
& > li
&::before
content: counter(ol-li) '.'
position: absolute
left: -1.5em
text-align: right
color: $blue-light
counter-increment: ol-li
blockquote
margin: 0 0 1rem
& > :first-child
margin-top: 0
& > :last-child
margin-bottom: 0
& + blockquote
padding-top: 0
figure
margin-top: 0
margin-bottom: 0
cite
&::before
content: '--'
padding: 0 .2em
iframe
max-width: 100%
.home-content
@extend .headings
padding: 0
background-color: transparent
source/css/_common/components/post/index.styl 0 → 100644
浏览文件 @ 3374ba2e
@import './post-list.styl';
@import './post.styl';
source/css/_common/components/post/post-header.styl 已删除 100644 → 0
浏览文件 @ 044af0e5
.post-header
position: relative
margin: 0 0 1.5rem
font-size: 1em
text-align: center
.post-title
display: inline-block
margin: 0
cursor: auto
&-link
clearAStyle()
display: inline-block
position: relative
font-size: inherit
word-wrap: break-word
word-break: break-word
color: $post-info-title-color
cursor: pointer
&::before
content: ''
visibility: hidden
position: absolute
bottom: 0
left: 0
width: 100%
height: 2px
background-color: #000
transition-timing-function: ease
transition-duration: .2s
transform: scaleX(0)
&:hover::before
visibility: visible
transform: scaleX(1)
.post-meta
i
margin-right: .2rem
& > span
&:not(:first-child)::before
content: '•'
margin: 0 .3rem
color: #666
.post-create
color: $post-info-create-color
.post-update
color: $post-info-update-color
.post-word-count
color: $post-info-word-count-color
.post-reading-time
color: $post-info-reading-time-color
.post-reading-count
color: $post-info-reading-count-color
.leancloud_visitors
color: $post-info-reading-count-color
.post-link
.post-header
margin: 0 0 .5rem
.post-title-wrapper
margin: 0
.post-excerpt
margin: 0
source/css/_common/components/post/post-list.styl 0 → 100644
浏览文件 @ 3374ba2e
// Only in homepage.
.post {
margin: 0 0 1.5rem;
border-radius: 5px;
padding: 1.5rem 2rem;
width: 100%;
background-color: $white;
&-body {
&-excerpt {
& *:last-child {
margin-bottom: 0;
}
}
&-more {
margin-top: 1.5rem;
text-align: center;
&__a {
display: inline-block;
border-radius: 5px;
padding: 0 .6em;
color: $white;
background-color: $home-readmore-bg-color;
transition: background-color .2s ease;
cursor: pointer;
&:hover {
color: $white;
background-color: $home-readmore-bg-hover-color;
}
}
}
}
}
.post-link-title {
.post-header {
margin: 0 0 .5rem;
}
.post-body {
&-excerpt {
margin: 0;
}
}
}
source/css/_common/components/post/post.styl
浏览文件 @ 3374ba2e
.post-body,
#recent-posts
if (hexo-config('img_horizonal_align'))
img
display: block
if (hexo-config('img_horizonal_align') == 'left')
margin: 0 auto 0 0
else if (hexo-config('img_horizonal_align') == 'right')
margin: 0 0 0 auto
else
margin: auto
.post-body
#more
border: 0
.post-footer
&-end
margin: 1rem 0 0
text-align: center
color: #b6b6b6
if (hexo-config('post_widget.end_text.horizon_line'))
border-top: 1px dashed #e6e6e6
padding: 1rem 0 0
span
margin: 0 .1rem
&-tags
margin-bottom: 1rem
.icon
color: $post-tags-icon-color
span
margin: 0 .5rem
.post-header {
position: relative;
margin: 0 0 1rem;
font-size: 1em;
text-align: center;
&-title {
margin: 0;
cursor: auto;
&__a {
position: relative;
color: $post-title-color;
word-wrap();
&::before {
content: '';
visibility: hidden;
position: absolute;
right: 0;
bottom: -4px;
left: 0;
height: 2px;
background-color: #000;
transition-property: transform;
transition-ease();
transform: scaleX(0);
}
&:hover {
color: $post-title-color;
&::before {
visibility: visible;
transform: scaleX(1);
}
}
}
}
&-meta {
i {
margin-right: .2rem;
}
& > span {
&:not(:first-child)::before {
content: '•';
margin: 0 .3rem;
color: $black-light;
}
}
&-create {
color: $post-create-color;
}
&-update {
color: $post-update-color;
}
&-word-count {
color: $post-word-count-color;
}
&-reading-time {
color: $post-reading-time-color;
}
&-reading-count {
color: $post-reading-count-color;
}
.leancloud_visitors {
color: $post-reading-count-color;
}
}
}
.post-footer {
&-end {
margin: 0 0 1rem;
text-align: center;
color: $post-end-color;
if (hexo-config('post_widget.end_text.horizon_line')) {
border-top: 1px dashed $post-end-line-color;
padding: 1rem 0 0;
}
}
&-tags {
margin: 0 0 1rem;
&-item {
margin: 0 .5rem;
&__i {
margin-right: .3rem;
color: $post-tags-icon-color;
}
&__a {
transition-property: color;
transition-ease();
}
}
}
}
source/css/_common/components/post/recent-posts.styl 已删除 100644 → 0
浏览文件 @ 044af0e5
.post
margin: 0 0 1.5rem
border-radius: 5px
padding: 1.5rem 2rem
width: 100%
background-color: $white
.post-excerpt
margin-bottom: 2em
.post-btn
text-align: center
a
clearAStyle()
display: inline-block
border-radius: 5px
padding: 0 .6em
color: $white
background-color: $home-post-read-more-color
transition: background-color .2s ease
cursor: pointer
&:hover
background-color: $home-post-read-more-hover-color
source/css/_common/components/widgets/index.styl
浏览文件 @ 3374ba2e
......@@ -6,11 +6,11 @@
// @import './lazyload.styl' if (hexo-config('lazyload.enable'))
// @import './loading-bar.styl'
// @import './recent-posts.styl'
// @import './pagination.styl'
// @import './comments.styl'
@import './sticky-top.styl';
// @import './copy.styl'
// @import './analytics/index.styl'
// @import './search/index.styl'
// @import './tag-plugin/index.styl'
@import './post-list.styl';
@import './sticky-top.styl';
@import './post-timeline.styl';
@import './pagination.styl'
source/css/_common/components/widgets/pagination.styl
浏览文件 @ 3374ba2e
#paginator
overflow: hidden
margin-top: 1em
width: 100%
.paginator-inner
border-radius: 5px
padding: .7em 0
text-align: center
background-color: $white
a.page-number
clearAStyle()
height: 100%
color: $pagination-item-color
background-color: $pagination-item-bg-color
&:hover
color: $pagination-item-hover-color
background-color: $pagination-item-hover-bg-color
.paginator {
margin-top: 1.5em;
border-radius: 5px;
text-align: center;
background-color: $white;
.space,
.page-number
display: inline-block
border-radius: 3px
width: 1.5em
height: 1.5em
line-height: 1.5em
vertical-align: middle
.page-number
margin: 0 .5em
.space
margin: 0 .2em
&-inner {
padding: .8em 0;
}
.current
color: $pagination-item-active-color
background-color: $pagination-item-active-bg-color
.space,
.page-number {
display: inline-block;
border-radius: 3px;
width: 1rem;
height: 1rem;
line-height: 1rem;
vertical-align: middle;
}
.page-number {
margin: 0 .5em;
color: $pagination-item-color;
background-color: $pagination-item-bg-color;
transition-property: color, background-color;
transition-ease();
&:hover {
color: $pagination-item-hover-color;
background-color: $pagination-item-hover-bg-color;
}
}
.current {
color: $pagination-item-active-color;
background-color: $pagination-item-active-bg-color;
}
a.prev,
a.next
clearAStyle()
vertical-align: middle
color: $pagination-arrow-color
&:hover
color: $pagination-arrow-hover-color
a.prev
margin-right: .5em
a.next
margin-left: .5em
.post-paginator
overflow: hidden
border-top: 1px solid #e8e8e8
padding-top: 2em
.article-prev,
.article-next
width: 100%
a
clearAStyle()
word-break: break-all
color: $pagination-arrow-color
&:hover
color: $pagination-arrow-hover-color
.article-prev
text-align: left
.title
margin-left: .3rem
.article-next
text-align: right
.title
margin-right: .3rem
.pull-left
float: left
.pull-right
float: right
a.next {
display: inline-block;
width: 1rem;
height: 1rem;
line-height: 1rem;
vertical-align: middle;
color: $pagination-arrow-color;
transition-property: color;
transition-ease();
&:hover {
color: $pagination-arrow-hover-color;
}
}
a.prev {
margin-right: .2em;
}
a.next {
margin-left: .2em;
}
// Pagination of post.
// ----------------------------------------
&-post {
border-top: 1px solid $pagination-line-color;
padding-top: 1.5rem;
&-prev,
&-next {
width: 100%;
&__a {
color: $pagination-arrow-color;
word-wrap();
transition-property: color;
transition-ease();
&:hover {
color: $pagination-arrow-hover-color;
}
}
}
&-prev {
text-align: left;
i {
margin-right: .3rem;
}
}
&-next {
text-align: right;
i {
margin-left: .3rem;
}
}
}
}
source/css/_common/components/widgets/post-list.styl → source/css/_common/components/widgets/post-timeline.styl
浏览文件 @ 3374ba2e
.post-list {
.post-timeline {
position: relative;
&::before {
content: '';
position: absolute;
top: $font-size-main;
bottom: $font-size-main;
top: 16px;
bottom: 16px;
left: 0;
border-left: .3rem solid $post-list-line-color;
border-left: .3rem solid #c8edff;
transform: translateX(-50%);
}
......@@ -24,21 +24,21 @@
position: absolute;
top: 50%;
left: 0;
z-index: $z-index0;
border: .15rem solid $post-list-dot-color;
z-index: 1000;
border: .15rem solid #6ec5ff;
border-radius: 50%;
width: .6rem;
height: .6rem;
background-color: $white;
background-color: #fff;
transition-delay: 0s;
transition-timing-function: ease;
transition-duration: .2s;
transition-property: border-color;
transition-ease();
transform: translate(-50%, -50%);
}
&:hover {
&::before {
border-color: $post-list-dot-hover-color;
}
&:hover::before {
border-color: #fc6423;
}
&:last-child {
......@@ -46,35 +46,37 @@
}
&.year {
font-weight: $font-weight-bolder;
font-weight: 700;
}
&__time {
display: inline-block;
padding-right: 1rem;
width: 3rem;
margin-right: 1em; /* Affect the width of title */
width: 3em; /* Affect the width of title */
vertical-align: middle;
color: $post-list-time-color;
color: #99a9bf;
transform: translateY(3%);
}
&-title {
display: inline-block;
margin: 0;
width: calc(100% - 3rem);
font-size: $font-size-main + 2px;
width: calc(100% - 4em);
font-size: 1em;
font-weight: normal;
vertical-align: middle;
}
&__a {
color: $font-color;
transition-property: color;
transition-ease();
&-title__a {
color: #333;
transition-delay: 0s;
transition-timing-function: ease;
transition-duration: .2s;
transition-property: color;
}
&:hover {
color: $blue-light;
}
}
&-title__a:hover {
color: #49b1f5;
}
}
}
source/css/_common/outline/index.styl
浏览文件 @ 3374ba2e
@import './macro.styl';
@import './render.styl';
source/css/_common/outline/macro.styl
浏览文件 @ 3374ba2e
......@@ -7,9 +7,9 @@
}
.main-inner {
overflow: hidden;
margin: 0 auto;
width: $main-width;
font-size: $font-size-main;
}
.sidebar {
......@@ -34,8 +34,56 @@ if (hexo-config('sidebar.position') == 'left') {
height: 100%;
background-color: $white;
&.home {
padding: 0;
background-color: transparent;
.post-body {
if (hexo-config('heading_line')) {
h1,
h2 {
border-bottom: 1px solid $heading-line-color;
padding-bottom: .3em;
}
}
}
.external-link {
color: $gray-dark;
i {
margin: 0 .1rem 0 .15rem;
font-size: .9em;
}
}
.table-container {
overflow: auto;
margin-bottom: 1rem;
table {
margin: 0;
}
}
.heading-link {
color: $heading-color;
&::after {
content: $icon-heading-link;
margin-left: .3em;
color: $heading-logo-color;
opacity: 0;
@extend $font-awesome;
transition-property: opacity;
transition-ease();
}
&:hover {
&::after {
opacity: 1;
}
}
}
}
.content-home {
padding: 0;
background-color: transparent;
}
source/css/_common/scaffolding/base.styl
浏览文件 @ 3374ba2e
......@@ -36,9 +36,9 @@ h6 {
line-height: $line-height-heading;
}
for n in 1 .. 6 {
h{n} {
font-size: $font-size-heading-base - $font-size-heading-step * n;
for size in 1 .. 6 {
h{size} {
font-size: $font-size-headings[size - 1]
}
}
......@@ -76,7 +76,7 @@ hr {
blockquote {
margin: 0;
border-left: 5px solid $quote-left-color;
padding: .5rem 1rem;
padding: 0 1rem;
background-color: $quote-bg-color;
& cite::before {
......
source/css/_mixins/index.styl
浏览文件 @ 3374ba2e
......@@ -87,11 +87,3 @@ disable-user-select() {
-ms-user-select: none;
user-select: none;
}
a-decoration() {
border-bottom: 1px solid $link-bottom-color;
&:hover {
border-bottom-color: $link-bottom-hover-color;
}
}
source/css/_variables/index.styl
浏览文件 @ 3374ba2e
......@@ -53,11 +53,11 @@ $line-height-codeblock = 1.7 // can`t less 1.3
$font-size-rem = 20px // <html>
$font-size-base = 14px // <body>
$font-size-header = $font-size-base + 4px
$font-size-sidebar = $font-size-base
$font-size-main = $font-size-base
$font-size-footer = $font-size-base
$font-size-heading-base = 1.875em
$font-size-heading-step = .125em
$font-size-sidebar = $font-size-base + 2px
$font-size-main = $font-size-base + 2px
$font-size-footer = $font-size-base + 2px
// h1 h2 h3 h4 h5 h6
$font-size-headings = 2em 1.5em 1.25em 1em .875em .85em
// Font family
$font-family-chinese = 'PingFang SC', 'Microsoft YaHei'
......@@ -93,6 +93,7 @@ $link-bottom-hover-color = #7ebef1
// Heading ( <h1~6> )
$heading-color = #222
$heading-logo-color = $blue-light
$heading-line-color = #eaecef
// Horizon line ( <hr> )
$hr-color = #b8dcfd
......@@ -154,13 +155,15 @@ $sidebar-state-category-color = #5c5c5c
$sidebar-state-tag-color = #ff8956
// Post
$post-info-title-color = #444
$post-info-create-color = #666
$post-info-update-color = $blue-light
$post-info-word-count-color = #666
$post-info-reading-time-color = $blue-light
$post-info-reading-count-color = $orange-dark
$post-tags-icon-color = $blue-light
$post-title-color = #444
$post-create-color = #666
$post-update-color = $blue-light
$post-word-count-color = #666
$post-reading-time-color = $blue-light
$post-reading-count-color = $orange-dark
$post-end-color = #b6b6b6
$post-end-line-color = #e4e4e4
$post-tags-icon-color = $blue-light
// Post list (In the archive/tag/category page.)
$post-list-line-color = #c8edff
......@@ -177,6 +180,7 @@ $pagination-item-active-color = #f4f5f5
$pagination-item-active-bg-color = $blue-light
$pagination-arrow-color = $blue-light
$pagination-arrow-hover-color = $orange-dark
$pagination-line-color = #e8e8e8
// Reward
$reward-btn-color = #ff6868
......
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或