From 2fa0554eddc62c6a503dc25a83c5b83fb5cce2e7 Mon Sep 17 00:00:00 2001 From: xaoxuu Date: Mon, 12 Nov 2018 23:43:43 +0800 Subject: [PATCH] update --- layout/_partial/side.ejs | 6 +-- layout/_widget/author.ejs | 7 +-- layout/_widget/categories.ejs | 4 +- layout/_widget/links.ejs | 11 ++-- layout/_widget/music.ejs | 5 +- layout/_widget/tagcloud.ejs | 4 +- layout/_widget/toc.ejs | 5 +- source/less/_main.less | 4 +- source/less/_toc.less | 51 +++++++++++------- source/less/_widget.less | 98 ++++++++++++++++++++--------------- 10 files changed, 114 insertions(+), 81 deletions(-) diff --git a/layout/_partial/side.ejs b/layout/_partial/side.ejs index 64a39f7..21c00c4 100755 --- a/layout/_partial/side.ejs +++ b/layout/_partial/side.ejs @@ -8,13 +8,13 @@ <% if (config.widgets.tagcloud){ %> <%- partial('../_widget/tagcloud') %> <% } %> + <% if (config.widgets.toc){ %> + <%- partial('../_widget/toc') %> + <% } %> <% if (config.widgets.musicid){ %> <%- partial('../_widget/music') %> <% } %> <% if (config.widgets.links){ %> <%- partial('../_widget/links') %> <% } %> - <% if (config.widgets.toc){ %> - <%- partial('../_widget/toc') %> - <% } %> <% } %> diff --git a/layout/_widget/author.ejs b/layout/_widget/author.ejs index 38015f1..6c7b43a 100755 --- a/layout/_widget/author.ejs +++ b/layout/_widget/author.ejs @@ -2,7 +2,7 @@
<% if(config.widgets.author.avatar || config.avatar) { %>
- +
<%} %> <% if (config.widgets.author.title || config.widgets.author.motto){ %> @@ -11,10 +11,7 @@

<%= config.widgets.author.title %>

<% } %> <% if (config.widgets.author.motto){ %> -
- - <%= config.widgets.author.motto %> -
+

<%= config.widgets.author.motto %>

<% } %> <% } %> diff --git a/layout/_widget/categories.ejs b/layout/_widget/categories.ejs index aa8355d..1b11fe0 100755 --- a/layout/_widget/categories.ejs +++ b/layout/_widget/categories.ejs @@ -1,5 +1,7 @@
-
  分类
+
+
  分类
+
<% if (site.categories.length){ %>
    diff --git a/layout/_widget/links.ejs b/layout/_widget/links.ejs index 4ea4a3c..bc94ba6 100755 --- a/layout/_widget/links.ejs +++ b/layout/_widget/links.ejs @@ -1,9 +1,10 @@
    -
      友链
    - <% if(config.email) { %> - - <%} %> -
    +
    +
      友链
    + <% if(config.email) { %> + + <%} %> +
      <% (config.widgets.links||[]).forEach(function(item){ %> diff --git a/layout/_widget/music.ejs b/layout/_widget/music.ejs index dcb9dbd..730dd34 100755 --- a/layout/_widget/music.ejs +++ b/layout/_widget/music.ejs @@ -1,5 +1,8 @@
      -
        音乐
      +
      +
        音乐
      + +
      diff --git a/layout/_widget/tagcloud.ejs b/layout/_widget/tagcloud.ejs index 4cfbb17..b941c33 100755 --- a/layout/_widget/tagcloud.ejs +++ b/layout/_widget/tagcloud.ejs @@ -1,6 +1,8 @@ <% if (site.tags.length){ %>
      -
        标签
      +
      +
        标签
      +
      <%- tagcloud(site.tags, { min_font: 14, diff --git a/layout/_widget/toc.ejs b/layout/_widget/toc.ejs index 2a9fcc1..f8d4b2e 100755 --- a/layout/_widget/toc.ejs +++ b/layout/_widget/toc.ejs @@ -1,6 +1,9 @@ <% if(page.content && page.toc!==false && toc(page.content).length > 0){ %>
      -
        目录
      +
      +
        目录
      +
      +
      <%- toc(page.content, {list_number: false}) %>
      diff --git a/source/less/_main.less b/source/less/_main.less index 21e0b94..5cf4015 100755 --- a/source/less/_main.less +++ b/source/less/_main.less @@ -276,8 +276,8 @@ } } .categories { - // font-weight: bold; - color: fade(@theme_text_main, 50%); + font-weight: normal; + color: fade(@theme_text_main, 70%); // color: @theme_text_link; } .tag{ diff --git a/source/less/_toc.less b/source/less/_toc.less index 394beef..d8090c9 100755 --- a/source/less/_toc.less +++ b/source/less/_toc.less @@ -1,25 +1,50 @@ .m_widget.toc-wrapper{ + z-index: 1; overflow: auto; border-radius: @border_radius; position: sticky; top: @height_navbar + 1*@gap; + // bottom: @gap; + // max-height: ~"calc(100% - 2 * @{gap} - @{height_navbar})"; + // max-height: 600px; .enable-trans(); + .header{ + position: sticky; + width: 100%; + top: 0; + } .content{ padding: @gap/2 0; + padding-top: 0; // 适合白色导航栏背景 + a { + border-left: 4px solid transparent; + &:hover{ + color: fade(@theme_text_main, 100%); + border-left: 4px solid @theme_bg_quote; + } + &:active{ + border-left: 8px solid @theme_bg_quote; + } + &.active{ + color: fade(@theme_text_main, 100%); + border-left: 4px solid @theme_bg_quote; + background: fade(@theme_bg_quote, 10%); + } + } } &.active{ position: fixed; box-shadow: @boxshadow_card_raised; + .header{ + .s-toc{ + display: none; + } + } } - .header{ - position: sticky; - width: 100%; - top: 0; - } @media(max-width: @on_phone){ position: fixed; - width: 100% - 0.5 * @gap; + width: ~"calc(100% - 2 * @{gap})"; top: @height_navbar + @gap; left: @gap; box-shadow: @boxshadow_card_raised; @@ -35,20 +60,6 @@ color: fade(@theme_text_main, 60%); font-size: @fontsize_small; display: inline-block; - border-left: 4px solid transparent; - &:hover{ - color: fade(@theme_text_main, 100%); - border-left: 4px solid @theme_bg_quote; - } - &:active{ - border-left: 8px solid @theme_bg_quote; - } - &.active{ - color: fade(@theme_text_main, 100%); - border-left: 4px solid @theme_bg_quote; - background: fade(@theme_bg_quote, 10%); - } - } ol{ .toc-item.toc-level-1 { diff --git a/source/less/_widget.less b/source/less/_widget.less index 04ae810..01bf816 100755 --- a/source/less/_widget.less +++ b/source/less/_widget.less @@ -1,4 +1,5 @@ .m_widget{ + z-index: 0; &:extend(.z-depth-main); background: @theme_bg_card; margin-top: @gap; @@ -27,6 +28,8 @@ width: @width_sidebar; 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; @media(max-width: @on_phone) { @@ -36,44 +39,51 @@ color: @theme_text_in_header; font-weight: bold; line-height: 1.5em; - // padding: 8px @gap; // 适合深色导航栏背景 - padding: 14px @gap 2px @gap; // 适合白色导航栏背景 - // letter-spacing: .08em; - + padding: 8px @gap; + padding-top: 14px; // 适合白色导航栏背景 + padding-bottom: 14px; // 适合白色导航栏背景 + .rightBtn{ + color: @theme_text_in_header; + &:hover { + color: darken(@theme_text_highlight, 25%); + } + } } .content{ text-align: justify; padding: @gap/2; - max-height: ~"calc(100% - @{height_navbar} - 2.5 * @{gap})"; + // padding-top: 0; // 适合白色导航栏背景 + max-height: ~"calc(100% - @{height_navbar} - 12.5 * @{gap})"; + ul.entry > li > a{ + padding: 0 @gap; + line-height:@height_cell; + 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(@theme_text_main,70%); + } + .badge{ + flex:none; + font-size: @fontsize_small; + color: fade(@theme_text_main, 50%); + } + &:hover{ + border-left: 4px solid @theme_bg_quote; + background: fade(@theme_bg_quote, 10%); + } + &:active{ + border-left: 8px solid @theme_bg_quote; + } + } } - ul.entry > li > a{ - padding: 0 @gap; - line-height:@height_cell; - 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(@theme_text_main,70%); - } - .badge{ - flex:none; - font-size: @fontsize_small; - color: fade(@theme_text_main, 50%); - } - &:hover{ - border-left: 4px solid @theme_bg_quote; - background: fade(@theme_bg_quote, 10%); - } - &:active{ - border-left: 8px solid @theme_bg_quote; - } - } + } .m_widget.author{ .enable-trans(); @@ -104,8 +114,14 @@ border-top-right-radius: @border_radius; } .content{ + p{ + font-size: @fontsize_base; + text-align: center; + } + text-align: center; font-weight: bold; padding-bottom: 0; + padding: @gap/2 @gap 0 @gap; @media(max-width: @on_phone){ padding: @gap/2 @gap; } @@ -141,6 +157,7 @@ .m_widget.categories{ .content{ padding: @gap/2 0; + padding-top: 0; // 适合白色导航栏背景 } } @@ -148,6 +165,7 @@ .content{ text-align: justify; padding: @gap/2 @gap; + padding-top: 0; // 适合白色导航栏背景 a{ display:inline-block; .enable-trans(.1s); @@ -162,26 +180,22 @@ .m_widget.contacts{ .content{ padding: @gap/2 0; + padding-top: 0; // 适合白色导航栏背景 } } .m_widget.music{ + .header{ + padding-bottom: @gap/4; // 适合白色导航栏背景 + } .content{ padding: @gap/2; + padding-top: 0; // 适合白色导航栏背景 } } .m_widget.links{ - .header{ - display: flex; - justify-content: space-between; - .addlink{ - color: @theme_text_in_header; - &:hover { - color: darken(@theme_text_highlight, 25%); - } - } - } .content{ padding: @gap/2 0; + padding-top: 0; // 适合白色导航栏背景 .name{ img{ display: inline;