diff --git a/_config.yml b/_config.yml index 1f9d1ac..5f36f54 100755 --- a/_config.yml +++ b/_config.yml @@ -20,7 +20,7 @@ style: pure # pure: 导航栏和标题栏背景是白色 # 服务开关,如果你想禁用某些功能,直接设置为false或者注释掉,相关的js脚本就不会加载。 # 有些服务这里打开了也未必会生效,还需要额外的配置,详见文档。 services: - cdn: true + # cdn: true scrollreveal: true nodewaves: true busuanzi: true diff --git a/layout/_partial/header.ejs b/layout/_partial/header.ejs index c75762a..269871c 100755 --- a/layout/_partial/header.ejs +++ b/layout/_partial/header.ejs @@ -69,3 +69,4 @@ + diff --git a/layout/_partial/side.ejs b/layout/_partial/side.ejs index 453e494..ef2ac09 100755 --- a/layout/_partial/side.ejs +++ b/layout/_partial/side.ejs @@ -1,13 +1,15 @@ -<% if (config.widgets && config.widgets.length){ %> - <% - let supportWidgets = ['author', 'category', 'list', 'music', 'tagcloud', 'toc', 'plain', 'related_posts']; - %> - <% config.widgets.forEach(function(item){ %> - <% if (item.enable != false){ %> - <% let widget_name = item.widget ? item.widget : 'plain'; %> - <% if (supportWidgets.indexOf(widget_name) > -1){ %> - <%- partial('../_widget/' + item.widget, {item: item}) %> + diff --git a/layout/archive.ejs b/layout/archive.ejs index 76d1085..11826ab 100755 --- a/layout/archive.ejs +++ b/layout/archive.ejs @@ -1,48 +1,55 @@ -<% if (page.year || page.month) { %> - <%- partial('_partial/archive') %> -<% } else { %> -
-
- <% - var year = -1, postid = -1; - site.posts.sort('date', -1).each(function(post) { - post.year = date(post.date, 'YYYY'); - if (post.year && post.year !== year) { - year = post.year; - %> -
-

<%= year %>

-
-
- <% } %> -
- - - - <% if(post.title){ %> - <%- post.title %> - <% } else if (post.date) { %> - <%= date(post.date, config.date_format) %> - <% } %> - <% if(post.music){ %> -   - <% } %> - <% if(post.video){ %> -   - <% } %> - <% if (post.icon) { %> -   - <% } %> - <% (post.icons && post.icons||[]).forEach(function(icon){ %> -   - <% }) %> - - -
- <% }); %> -
-
-<% } %> +<%- partial('_partial/header', null, {cache: !config.relative_link, path: path}) %> + +
+ <% if (page.year || page.month) { %> + <%- partial('_partial/archive') %> + <% } else { %> +
+
+ <% + var year = -1, postid = -1; + site.posts.sort('date', -1).each(function(post) { + post.year = date(post.date, 'YYYY'); + if (post.year && post.year !== year) { + year = post.year; + %> +
+

<%= year %>

+
+
+ <% } %> +
+ + + + <% if(post.title){ %> + <%- post.title %> + <% } else if (post.date) { %> + <%= date(post.date, config.date_format) %> + <% } %> + <% if(post.music){ %> +   + <% } %> + <% if(post.video){ %> +   + <% } %> + <% if (post.icon) { %> +   + <% } %> + <% (post.icons && post.icons||[]).forEach(function(icon){ %> +   + <% }) %> + + +
+ <% }); %> +
+
+ <% } %> +
+<%- partial('_partial/side') %> + + <% diff --git a/layout/category.ejs b/layout/category.ejs index c2c550c..88c8cb2 100755 --- a/layout/category.ejs +++ b/layout/category.ejs @@ -1 +1,5 @@ -<%- partial('_partial/archive') %> +<%- partial('_partial/header', null, {cache: !config.relative_link, path: path}) %> +
+ <%- partial('_partial/archive') %> +
+<%- partial('_partial/side') %> diff --git a/layout/index.ejs b/layout/index.ejs index c2c550c..88c8cb2 100755 --- a/layout/index.ejs +++ b/layout/index.ejs @@ -1 +1,5 @@ -<%- partial('_partial/archive') %> +<%- partial('_partial/header', null, {cache: !config.relative_link, path: path}) %> +
+ <%- partial('_partial/archive') %> +
+<%- partial('_partial/side') %> diff --git a/layout/layout.ejs b/layout/layout.ejs index 271a2c9..90dd519 100755 --- a/layout/layout.ejs +++ b/layout/layout.ejs @@ -2,23 +2,16 @@ <%- partial('_partial/head') %> - <%- partial('_partial/header', null, {cache: !config.relative_link, path: path}) %> - -
-
-
- <%- body %> -
- - -
- -
- <%- partial('_partial/footer', null, {cache: !config.relative_link}) %> - - <%- partial('_partial/scripts') %> - +
+
+ <%- body %> + +
+ +
+ <%- partial('_partial/footer', null, {cache: !config.relative_link}) %> + + <%- partial('_partial/scripts') %> + diff --git a/layout/links.ejs b/layout/links.ejs index 2c69eb6..a3194ec 100755 --- a/layout/links.ejs +++ b/layout/links.ejs @@ -1,47 +1,52 @@ -
- <%- partial('_partial/meta',{post:page}) %> -
- <% if (page.links){ %> - <% (page.links||[]).forEach(function(group){ %> - <% if(group.items) { %> -
- <% if(group.group) { %> -

- <% if (group.icon) { %> - - <%} %> - <%= group.group %> -

- <%} %> -
- <% (group.items||[]).forEach(function(item){ %> - -
- -
-
-

<%- item.name %>

- <% if(item.tags){ %> -
- <% (item.tags||[]).forEach(function(tag){ %> -

<%= tag %>

- <% }) %> -
- <% } %> -
-
- <% }) %> +<%- partial('_partial/header', null, {cache: !config.relative_link, path: path}) %> +
+
- <%} %> - <% }) %> - <% } %> -

- <%- page.content %> -
-
+ <%} %> + <% }) %> + <% } %> +

+ <%- page.content %> + + -
+
-<%- partial('_third-party/comments') %> + <%- partial('_third-party/comments') %> + + +<%- partial('_partial/side') %> diff --git a/layout/page.ejs b/layout/page.ejs index bea6318..84ef495 100755 --- a/layout/page.ejs +++ b/layout/page.ejs @@ -1 +1,5 @@ -<%- partial('_partial/article', {post: page, index: false}) %> \ No newline at end of file +<%- partial('_partial/header', null, {cache: !config.relative_link, path: path}) %> +
+ <%- partial('_partial/article', {post: page, index: false}) %> +
+<%- partial('_partial/side') %> diff --git a/layout/post.ejs b/layout/post.ejs index 3020e1c..84ef495 100755 --- a/layout/post.ejs +++ b/layout/post.ejs @@ -1 +1,5 @@ -<%- partial('_partial/article', {post: page, index: false}) %> +<%- partial('_partial/header', null, {cache: !config.relative_link, path: path}) %> +
+ <%- partial('_partial/article', {post: page, index: false}) %> +
+<%- partial('_partial/side') %> diff --git a/layout/tag.ejs b/layout/tag.ejs index c0cdb27..88c8cb2 100755 --- a/layout/tag.ejs +++ b/layout/tag.ejs @@ -1 +1,5 @@ -<%- partial('_partial/archive') %> \ No newline at end of file +<%- partial('_partial/header', null, {cache: !config.relative_link, path: path}) %> +
+ <%- partial('_partial/archive') %> +
+<%- partial('_partial/side') %> diff --git a/source/less/_side.less b/source/less/_side.less index 646fee8..60ec74b 100755 --- a/source/less/_side.less +++ b/source/less/_side.less @@ -13,3 +13,317 @@ } } + +.l_side section{ + z-index: 0; + &:extend(.z-depth-main); + background: @theme_cardbg; + margin-top: @gap; + font-family: @fontfamily_base; + font-size: @fontsize_base; + &:first-child{ + margin-top: 0; + } + border-radius: @border_radius; + .enable-trans(); + &:hover { + box-shadow: @boxshadow_card_raised; + } + &:active { + box-shadow: @boxshadow_card_normal; + } + + width: @width_sidebar; + @media(max-width: @on_laptop) { + width: @width_sidebar_m; + } + @media(max-width: @on_pad) { + width: 100%; + } + @media(max-width: @on_phone) { + width: ~"calc(100% - 2 * @{gap})"; + margin: @gap @gap 0 @gap; + } + max-height: ~"calc(100% - @{height_navbar} - 4 * @{gap})"; + header{ + display: flex; + justify-content: space-between; + border-top-left-radius: @border_radius; + border-top-right-radius: @border_radius; + background-color: @color_bg_navbar; + color: @color_text_in_header; + font-weight: bold; + line-height: 1.5em; + padding: 8px @gap; + .rightBtn{ + color: @color_text_in_header; + &:hover { + color: darken(@color_text_highlight, 25%); + &.rotate90{ + transform: rotate(90deg); + } + } + } + &.pure{ + background-color: @theme_cardbg; + color: @theme_main; + padding-top: 14px; // 适合白色导航栏背景 + padding-bottom: 14px; // 适合白色导航栏背景 + .rightBtn{ + color: @theme_main; + &:hover { + color: darken(@color_text_highlight, 25%); + } + } + } + } + .content{ + text-align: justify; + padding: @gap/2; + max-height: ~"calc(100% - @{height_navbar} - 12.5 * @{gap})"; + ul > li{ + a{ + color: fade(@color_text_main, 80%); + padding: 0 @gap; + line-height: @height_cell; + display: flex; + justify-content: space-between; + align-content: center; + border-left: 2px solid transparent; + .enable-trans(); + .name{ + flex:auto; + &:extend(.txt-ellipsis); + color: fade(@color_text_main, 80%); + } + .badge{ + flex:none; + font-weight: normal; + font-size: @fontsize_small; + color: fade(@color_text_main, 70%); + } + &:hover{ + border-left: 4px solid @theme_main; + background: fade(@theme_main, 10%); + } + &:active{ + border-left: 8px solid @theme_main; + } + &.child{ + padding-left: @gap*2; + } + } + } + } + + + &.author{ + .enable-trans(); + .content{ + padding: 0; + div.avatar{ + display: flex; + justify-content: center; + } + img{ + padding: 0; + margin: 0; + display: flex; + justify-content: center; + width: @width_sidebar; + height: @width_sidebar; + border-top-left-radius: @border_radius; + border-top-right-radius: @border_radius; + @media(max-width: @on_laptop) { + width: @width_sidebar_m; + height: @width_sidebar_m; + } + @media(max-width: @on_pad){ + width: 96px; + height: 96px; + border-radius: 100%; + margin-top: @gap/2; + padding: @gap/2; + } + + } + h2{ + text-align: center; + font-weight: bold; + margin: @gap/2; + @media(max-width: @on_pad){ + margin: @gap/2; + } + } + p{ + font-size: @fontsize_base; + font-weight: bold; + text-align: center; + margin: @gap/2 @gap/2 0 @gap/2; + empty-cells: hide; + } + .social-wrapper{ + display: flex; + justify-content: space-between; + flex-wrap: wrap; + padding: 4px @gap/2; + a{ + color: fade(@color_text_main, 70%); + .enable-trans(); + &:hover{ + color: @color_text_highlight; + } + &.social { + display: flex; + justify-content: center; + align-items: center; + width: 32px; + height: 32px; + margin: 4px; + border-radius: 100px; + &:hover { + background: fade(@theme_main, 10%); + color: @theme_main; + } + } + } + @media(max-width: @on_pad){ + justify-content: center; + } + } + } + @media(max-width: @on_pad){ + box-shadow: none; + background: @theme_background; + margin-top: 2*@gap; + } + } + + &.plain{ + .content{ + font-size: @fontsize_small; + font-weight: bold; + word-break: break-all; + padding: @gap/2 @gap; + line-height: @fontsize_small + 8px; + &.pure{ + padding: 0 @gap @gap @gap; // 适合白色导航栏背景 + } + a{ + color: @color_text_link; + .enable-trans(); + &:hover { + color: @color_text_highlight; + text-decoration: underline; + } + &:active { + color: darken(@color_text_highlight, 25%); + } + } + } + } + + &.list{ + .content{ + padding: @gap/2 0; + &.pure{ + padding-top: 0; // 适合白色导航栏背景 + } + a{ + font-size: @fontsize_small; + font-weight: bold; + &:hover{ + text-decoration: none; + } + i{ + color: fade(@color_text_main,70%); + line-height: @height_cell; + margin-right: 3px; + } + img{ + display: inline; + vertical-align: middle; + height: 18px; + width: 18px; + margin-bottom: 4px; + &#round{ + border-radius: 100%; + } + } + } + } + } + + &.category{ + .content{ + padding: @gap/2 0; + font-size: @fontsize_small; + font-weight: bold; + &.pure{ + padding-top: 0; // 适合白色导航栏背景 + } + } + } + + &.tagcloud{ + .content{ + text-align: justify; + padding: @gap/2 @gap; + &.pure{ + padding: 0 @gap @gap @gap; // 适合白色导航栏背景 + } + a{ + display:inline-block; + .enable-trans(.1s); + line-height: 1.6em; + &:hover{ + color: @color_text_highlight !important; //to cover inline style. + text-decoration: underline + } + } + } + } + + &.music{ + header{ + &.pure{ + padding-bottom: @gap/4; // 适合白色导航栏背景 + } + } + .content{ + padding: @gap/2+4px; + padding-top: @gap/2; + &.pure{ + padding-top: @gap/4; // 适合白色导航栏背景 + } + .aplayer{ + border-radius: 4px; + color: #666; + font-family: @fontfamily_base; + } + } + } + + &.related_posts{ + .content{ + padding: @gap/2 0; + font-size: @fontsize_small; + font-weight: bold; + &.pure{ + padding-top: 0; // 适合白色导航栏背景 + } + h3{ + font-size: @fontsize_small; + font-weight: bold; + margin: 0; + a{ + // line-height: @fontsize_small*1.7; + line-height: inherit; + padding-top: 4px; + padding-bottom: 4px; + } + } + } + } + +} diff --git a/source/less/_widget.less b/source/less/_widget.less index 7b698bd..e69de29 100755 --- a/source/less/_widget.less +++ b/source/less/_widget.less @@ -1,313 +0,0 @@ -.l_side section{ - z-index: 0; - &:extend(.z-depth-main); - background: @theme_cardbg; - margin-top: @gap; - font-family: @fontfamily_base; - font-size: @fontsize_base; - &:first-child{ - margin-top: 0; - } - border-radius: @border_radius; - .enable-trans(); - &:hover { - box-shadow: @boxshadow_card_raised; - } - &:active { - box-shadow: @boxshadow_card_normal; - } - - width: @width_sidebar; - @media(max-width: @on_laptop) { - width: @width_sidebar_m; - } - @media(max-width: @on_pad) { - width: 100%; - } - @media(max-width: @on_phone) { - width: ~"calc(100% - 2 * @{gap})"; - margin: @gap @gap 0 @gap; - } - max-height: ~"calc(100% - @{height_navbar} - 4 * @{gap})"; - header{ - display: flex; - justify-content: space-between; - border-top-left-radius: @border_radius; - border-top-right-radius: @border_radius; - background-color: @color_bg_navbar; - color: @color_text_in_header; - font-weight: bold; - line-height: 1.5em; - padding: 8px @gap; - .rightBtn{ - color: @color_text_in_header; - &:hover { - color: darken(@color_text_highlight, 25%); - &.rotate90{ - transform: rotate(90deg); - } - } - } - &.pure{ - background-color: @theme_cardbg; - color: @theme_main; - padding-top: 14px; // 适合白色导航栏背景 - padding-bottom: 14px; // 适合白色导航栏背景 - .rightBtn{ - color: @theme_main; - &:hover { - color: darken(@color_text_highlight, 25%); - } - } - } - } - .content{ - text-align: justify; - padding: @gap/2; - max-height: ~"calc(100% - @{height_navbar} - 12.5 * @{gap})"; - ul > li{ - a{ - color: fade(@color_text_main, 80%); - padding: 0 @gap; - line-height: @height_cell; - display: flex; - justify-content: space-between; - align-content: center; - border-left: 2px solid transparent; - .enable-trans(); - .name{ - flex:auto; - &:extend(.txt-ellipsis); - color: fade(@color_text_main, 80%); - } - .badge{ - flex:none; - font-weight: normal; - font-size: @fontsize_small; - color: fade(@color_text_main, 70%); - } - &:hover{ - border-left: 4px solid @theme_main; - background: fade(@theme_main, 10%); - } - &:active{ - border-left: 8px solid @theme_main; - } - &.child{ - padding-left: @gap*2; - } - } - } - } - - - &.author{ - .enable-trans(); - .content{ - padding: 0; - div.avatar{ - display: flex; - justify-content: center; - } - img{ - padding: 0; - margin: 0; - display: flex; - justify-content: center; - width: @width_sidebar; - height: @width_sidebar; - border-top-left-radius: @border_radius; - border-top-right-radius: @border_radius; - @media(max-width: @on_laptop) { - width: @width_sidebar_m; - height: @width_sidebar_m; - } - @media(max-width: @on_pad){ - width: 96px; - height: 96px; - border-radius: 100%; - margin-top: @gap/2; - padding: @gap/2; - } - - } - h2{ - text-align: center; - font-weight: bold; - margin: @gap/2; - @media(max-width: @on_pad){ - margin: @gap/2; - } - } - p{ - font-size: @fontsize_base; - font-weight: bold; - text-align: center; - margin: @gap/2 @gap/2 0 @gap/2; - empty-cells: hide; - } - .social-wrapper{ - display: flex; - justify-content: space-between; - flex-wrap: wrap; - padding: 4px @gap/2; - a{ - color: fade(@color_text_main, 70%); - .enable-trans(); - &:hover{ - color: @color_text_highlight; - } - &.social { - display: flex; - justify-content: center; - align-items: center; - width: 32px; - height: 32px; - margin: 4px; - border-radius: 100px; - &:hover { - background: fade(@theme_main, 10%); - color: @theme_main; - } - } - } - @media(max-width: @on_pad){ - justify-content: center; - } - } - } - @media(max-width: @on_pad){ - box-shadow: none; - background: @theme_background; - margin-top: 2*@gap; - } - } - - &.plain{ - .content{ - font-size: @fontsize_small; - font-weight: bold; - word-break: break-all; - padding: @gap/2 @gap; - line-height: @fontsize_small + 8px; - &.pure{ - padding: 0 @gap @gap @gap; // 适合白色导航栏背景 - } - a{ - color: @color_text_link; - .enable-trans(); - &:hover { - color: @color_text_highlight; - text-decoration: underline; - } - &:active { - color: darken(@color_text_highlight, 25%); - } - } - } - } - - &.list{ - .content{ - padding: @gap/2 0; - &.pure{ - padding-top: 0; // 适合白色导航栏背景 - } - a{ - font-size: @fontsize_small; - font-weight: bold; - &:hover{ - text-decoration: none; - } - i{ - color: fade(@color_text_main,70%); - line-height: @height_cell; - margin-right: 3px; - } - img{ - display: inline; - vertical-align: middle; - height: 18px; - width: 18px; - margin-bottom: 4px; - &#round{ - border-radius: 100%; - } - } - } - } - } - - &.category{ - .content{ - padding: @gap/2 0; - font-size: @fontsize_small; - font-weight: bold; - &.pure{ - padding-top: 0; // 适合白色导航栏背景 - } - } - } - - &.tagcloud{ - .content{ - text-align: justify; - padding: @gap/2 @gap; - &.pure{ - padding: 0 @gap @gap @gap; // 适合白色导航栏背景 - } - a{ - display:inline-block; - .enable-trans(.1s); - line-height: 1.6em; - &:hover{ - color: @color_text_highlight !important; //to cover inline style. - text-decoration: underline - } - } - } - } - - &.music{ - header{ - &.pure{ - padding-bottom: @gap/4; // 适合白色导航栏背景 - } - } - .content{ - padding: @gap/2+4px; - padding-top: @gap/2; - &.pure{ - padding-top: @gap/4; // 适合白色导航栏背景 - } - .aplayer{ - border-radius: 4px; - color: #666; - font-family: @fontfamily_base; - } - } - } - - &.related_posts{ - .content{ - padding: @gap/2 0; - font-size: @fontsize_small; - font-weight: bold; - &.pure{ - padding-top: 0; // 适合白色导航栏背景 - } - h3{ - font-size: @fontsize_small; - font-weight: bold; - margin: 0; - a{ - // line-height: @fontsize_small*1.7; - line-height: inherit; - padding-top: 4px; - padding-bottom: 4px; - } - } - } - } - -} diff --git a/source/style.less b/source/style.less index b1df078..aab2f39 100755 --- a/source/style.less +++ b/source/style.less @@ -7,7 +7,6 @@ @import "less/_main.less"; @import "less/_side.less"; @import "less/_toc.less"; -@import "less/_widget.less"; @import "less/_archive.less"; @import "less/_article.less"; @import "less/_pagination.less";