update

6 years ago · 7bd612de61
parent 41eee56056
commit 7bd612de61
21 changed files with 147 additions and 128 deletions
--- a/_config.yml
+++ b/_config.yml
@ -23,7 +23,7 @@ widgets:
    title: "博文分类"
  # 文章标签的默认配置
  tagcloud:
-    icon: fas fa-tags
+    icon: fas fa-fire
    title: "热门话题"
  # 文章目录的默认配置
  toc:
--- a/layout/_partial/article.ejs
+++ b/layout/_partial/article.ejs
@ -92,7 +92,7 @@

 <br>

-<%- partial('comments') %>
+<%- partial('../_third-party/comments') %>

 <script>
    window.subData = {
--- a/layout/_partial/meta.ejs
+++ b/layout/_partial/meta.ejs
@ -5,15 +5,10 @@
 } %>
 <section class='meta'>
  <% if((!isPostList && post.music && post.music.enable) || (isPostList && post.music && post.music.enable == true)){ %>
-    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/aplayer@1.7.0/dist/APlayer.min.css">
-    <div class="aplayer" data-mini=true
-      data-mode="circulation" data-volume="0.7"
-      data-server="<%= post.music.server %>"
-      data-type="<%= post.music.type %>"
-      data-id="<%= post.music.id %>">
-    </div>
-    <script src="https://cdn.jsdelivr.net/npm/aplayer@1.7.0/dist/APlayer.min.js"></script>
-    <script src="https://cdn.jsdelivr.net/npm/meting@1.1.0/dist/Meting.min.js"></script>
+    <%- partial('../_third-party/aplayer',
+    {aplayer_theme: '', aplayer_mini: true, aplayer_mode: 'circulation',
+    aplayer_server: post.music.server, aplayer_type: post.music.type, aplayer_id: post.music.id,
+    aplayer_volume: '0.7', aplayer_autoplay: false }) %>
  <% } %>
  <div class="meta" id="header-meta">
    <% if(isPostList){ %>
--- a/layout/_partial/scripts.ejs
+++ b/layout/_partial/scripts.ejs
@ -74,7 +74,6 @@
            <% } else { %>
              <%- js('js/volantis.js') %>
            <% } %>
-
            <script>
            var GUEST_INFO = ['nick','mail','link'];
            var guest_info = '<%= config.valine.guest_info %>'.split(',').filter(function(item){
--- a/layout/_partial/side.ejs
+++ b/layout/_partial/side.ejs
@ -1,43 +1,12 @@
 <% if (config.widgets){ %>
+  <%
+  let supportWidgets = ['author', 'category', 'list', 'music', 'tagcloud', 'toc', 'plain'];
+  %>
  <% (config.widgets||[]).forEach(function(item){ %>
    <% if (item.enable != false){ %>
-      <%
-      let widget_name = item.widget ? item.widget : 'plain';
-      var needDisplay = true;
-      if (needDisplay == true && widget_name == 'toc') {
-        if (page.layout != 'post' || !page.content || page.toc == false || toc(page.content).length == 0) {
-          needDisplay = false;
-        }
-      }
-      if (needDisplay == true && widget_name == 'music') {
-        if (page.layout != 'post' || !page.content || page.toc == false || toc(page.content).length == 0) {
-          needDisplay = false;
-        }
-      }
-      if (needDisplay) {
-        needDisplay = ((widget_name != 'toc') || (page.layout == 'post' && page.content && page.toc!==false && toc(page.content).length > 0));
-      }
-      %>
-      <% if (needDisplay){ %>
-        <section class='<%- widget_name == 'toc' ? 'toc-wrapper' : widget_name %>'>
-          <% if (widget_name != 'author'){ %>
-            <header class='<%= theme.style %>'>
-              <div><i class="<%- item.icon %> fa-fw" aria-hidden="true"></i>&nbsp;&nbsp;<%- item.title %></div>
-              <% if (widget_name == 'toc') { %>
-                <div class='wrapper'><a class="s-toc rightBtn" title="固定到顶部" rel="external nofollow noopener noreferrer" href="javascript:void(0)"><i class="fas fa-thumbtack fa-fw"></i></a></div>
-              <% } else if(item.more && item.more.url) { %>
-                <a class="rightBtn<%- item.more.animate ? ' ' + item.more.animate : '' %>" target="_blank"
-                rel="external nofollow noopener noreferrer"
-                href="<%- url_for(item.more.url) %>"
-                title="<%- item.more.url %>">
-                <i class="<%- item.more.icon?item.more.icon:'fas fa-question-circle' %> fa-fw"></i></a>
-              <% } %>
-            </header>
-          <% } %>
-          <div class='content <%= theme.style %>'>
-            <%- partial('../_widget/' + widget_name, {item: item}) %>
-          </div>
-        </section>
+      <% let widget_name = item.widget ? item.widget : 'plain'; %>
+      <% if (supportWidgets.indexOf(widget_name) > -1){ %>
+        <%- partial('../_widget/' + item.widget, {item: item}) %>
      <% } %>
    <% } %>
  <% }) %>
--- a/layout/_third-party/aplayer.ejs
+++ b/layout/_third-party/aplayer.ejs
@ -0,0 +1,13 @@
+<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/aplayer@1.7.0/dist/APlayer.min.css">
+<div class="aplayer"
+  data-theme="<%- aplayer_theme %>"
+  <%if(aplayer_mini){%>data-mini=true <%}%>
+  <%if(aplayer_autoplay){%>data-autoplay=true <%}%>
+  data-mode="<%- aplayer_mode %>"
+  data-server="<%= aplayer_server %>"
+  data-type="<%= aplayer_type %>"
+  data-id="<%= aplayer_id %>"
+  data-volume="<%= aplayer_volume %>">
+</div>
+<script src="https://cdn.jsdelivr.net/npm/aplayer@1.7.0/dist/APlayer.min.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/meting@1.1.0/dist/Meting.min.js"></script>
--- a/layout/_third-party/comments.ejs
+++ b/layout/_third-party/comments.ejs
@ -39,7 +39,6 @@
                    <% } %>
                <% } %>
            <% } %>
-
        </section>
    </article>
 <% } %>
--- a/layout/_third-party/recommended_posts.ejs
+++ b/layout/_third-party/recommended_posts.ejs
--- a/layout/_widget/author.ejs
+++ b/layout/_widget/author.ejs
@ -1,24 +1,29 @@
-<% if(item.avatar) { %>
-  <div class='avatar'>
-    <img class='avatar' src='<%- url_for(item.avatar) %>'/>
-  </div>
-<%} %>
-<% if (item.title || item.body) { %>
-  <div class='text'>
-    <% if (item.title){ %>
-      <h2><%- item.title %></h2>
+<section class='<%- item.widget %>'>
+  <div class='content <%= theme.style %>'>
+    <% if(item.avatar) { %>
+      <div class='avatar'>
+        <img class='avatar' src='<%- url_for(item.avatar) %>'/>
+      </div>
+    <%} %>
+    <% if (item.title || item.body) { %>
+      <div class='text'>
+        <% if (item.title){ %>
+          <h2><%- item.title %></h2>
+        <% } %>
+        <% if (item.body){ %>
+          <%- markdown(item.body) %>
+        <% } %>
+      </div>
    <% } %>
-    <% if (item.body){ %>
-      <%- markdown(item.body) %>
+    <% if (item.social == true && config.social) { %>
+      <div class="social-wrapper">
+        <% (config.social||[]).forEach(function(value){ %>
+          <% if (value.url && value.icon) { %>
+            <a href="<%- url_for(value.url) %>" class="social flat-btn" target="_blank" rel="external"><i class="social <%- value.icon %>" aria-hidden="true"></i></a>
+          <%}%>
+        <%})%>
+      </div>
    <% } %>
  </div>
-<% } %>
-<% if (item.social == true && config.social) { %>
-  <div class="social-wrapper">
-    <% (config.social||[]).forEach(function(value){ %>
-      <% if (value.url && value.icon) { %>
-        <a href="<%- url_for(value.url) %>" class="social flat-btn" target="_blank" rel="external"><i class="social <%- value.icon %>" aria-hidden="true"></i></a>
-      <%}%>
-    <%})%>
-  </div>
-<% } %>
+
+</section>
--- a/layout/_widget/category.ejs
+++ b/layout/_widget/category.ejs
@ -1,7 +1,12 @@
 <% if (site.categories.length){ %>
-  <ul class="entry">
-    <% site.categories.sort('name').each(function(category){ %>
-      <li><a class="flat-box" title="<%- url_for(category.path) %>" href="<%- url_for(category.path) %>"><div class='name'><%- category.name %></div><div class='badge'>(共<%- category.posts.length %>篇)</div></a></li>
-    <% }) %>
-  </ul>
+  <section class='<%- item.widget %>'>
+    <%- partial('header', {item: item, defIcon: theme.widgets.category.icon, defTitle: theme.widgets.category.title}) %>
+    <div class='content <%= theme.style %>'>
+      <ul class="entry">
+        <% site.categories.sort('name').each(function(category){ %>
+          <li><a class="flat-box" title="<%- url_for(category.path) %>" href="<%- url_for(category.path) %>"><div class='name'><%- category.name %></div><div class='badge'>(共<%- category.posts.length %>篇)</div></a></li>
+        <% }) %>
+      </ul>
+    </div>
+  </section>
 <% } %>
--- a/layout/_widget/header.ejs
+++ b/layout/_widget/header.ejs
@ -0,0 +1,16 @@
+<%
+  let icon = item.icon ? item.icon : defIcon;
+  let title = item.title ? item.title : defTitle;
+%>
+<header class='<%= theme.style %>'>
+  <div><i class="<%- icon %> fa-fw" aria-hidden="true"></i>&nbsp;&nbsp;<%- title %></div>
+  <% if (item.widget == 'toc') { %>
+    <div class='wrapper'><a class="s-toc rightBtn" title="固定到顶部" rel="external nofollow noopener noreferrer" href="javascript:void(0)"><i class="fas fa-thumbtack fa-fw"></i></a></div>
+  <% } else if(item.more && item.more.url) { %>
+    <a class="rightBtn<%- item.more.animate ? ' ' + item.more.animate : '' %>" target="_blank"
+    rel="external nofollow noopener noreferrer"
+    href="<%- url_for(item.more.url) %>"
+    title="<%- item.more.url %>">
+    <i class="<%- item.more.icon?item.more.icon:'fas fa-question-circle' %> fa-fw"></i></a>
+  <% } %>
+</header>
--- a/layout/_widget/list.ejs
+++ b/layout/_widget/list.ejs
@ -1,19 +1,24 @@
-<ul class="entry">
-  <% (item.rows||[]).forEach(function(row){ %>
-    <li><a class="flat-box" title="<%- row.url %>" href="<%= url_for(row.url) %>">
-      <div class='name'>
-        <% if(row.img) { %>
-          <img src="<%- row.img %>">
-        <% } else if(row.avatar) { %>
-          <img src="<%- row.avatar %>" id="round">
-        <% } else { %>
-          <i class="<%= row.icon %>" aria-hidden="true"></i>
-        <% } %>
-        &nbsp;&nbsp;<%- row.name %>
-      </div>
-      <% if(row.desc) { %>
-        <div class='badge'>(<%- row.desc %>)</div>
-      <% } %>
-    </a></li>
-  <% }) %>
-</ul>
+<section class='<%- item.widget %>'>
+  <%- partial('header', {item: item, defIcon: '', defTitle: ''}) %>
+  <div class='content <%= theme.style %>'>
+    <ul class="entry">
+      <% (item.rows||[]).forEach(function(row){ %>
+        <li><a class="flat-box" title="<%- row.url %>" href="<%= url_for(row.url) %>">
+          <div class='name'>
+            <% if(row.img) { %>
+              <img src="<%- row.img %>">
+            <% } else if(row.avatar) { %>
+              <img src="<%- row.avatar %>" id="round">
+            <% } else { %>
+              <i class="<%= row.icon %>" aria-hidden="true"></i>
+            <% } %>
+            &nbsp;&nbsp;<%- row.name %>
+          </div>
+          <% if(row.desc) { %>
+            <div class='badge'>(<%- row.desc %>)</div>
+          <% } %>
+        </a></li>
+      <% }) %>
+    </ul>
+  </div>
+</section>
--- a/layout/_widget/music.ejs
+++ b/layout/_widget/music.ejs
@ -39,14 +39,13 @@ if (theme.widgets.music && theme.widgets.music.display) {
 %>

 <% if (needDisplay == true) { %>
-  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/aplayer@1.7.0/dist/APlayer.min.css">
-  <div class="aplayer" data-theme="<%= item.color %>"
-    data-mode="<%= item.mode %>"
-    data-server="<%= item.server %>"
-    data-type="<%= item.type %>"
-    data-id="<%= item.id %>"
-    data-volume="<%= item.volume %>">
-  </div>
-  <script src="https://cdn.jsdelivr.net/npm/aplayer@1.7.0/dist/APlayer.min.js"></script>
-  <script src="https://cdn.jsdelivr.net/npm/meting@1.1.0/dist/Meting.min.js"></script>
+  <section class='<%- item.widget %>'>
+    <%- partial('header', {item: item, defIcon: '', defTitle: ''}) %>
+    <div class='content <%= theme.style %>'>
+      <%- partial('../_third-party/aplayer',
+      {aplayer_theme: item.color, aplayer_mini: false, aplayer_mode: item.mode,
+      aplayer_server: item.server, aplayer_type: item.type, aplayer_id: item.id,
+      aplayer_volume: item.volume, aplayer_autoplay: item.autoplay?item.autoplay:false }) %>
+    </div>
+  </section>
 <% } %>
--- a/layout/_widget/plain.ejs
+++ b/layout/_widget/plain.ejs
@ -1 +1,6 @@
-<%- markdown(item.body) %>
+<section class='<%- item.widget?item.widget:'plain' %>'>
+  <%- partial('header', {item: item, defIcon: '', defTitle: ''}) %>
+  <div class='content <%= theme.style %>'>
+    <%- markdown(item.body) %>
+  </div>
+</section>
--- a/layout/_widget/tagcloud.ejs
+++ b/layout/_widget/tagcloud.ejs
@ -1,7 +1,14 @@
-<%- tagcloud(site.tags, {
-    min_font: 14,
-    max_font: 24,
-    color: true,
-    start_color: '#999',
-    end_color: '#555',
-}) %>
+<% if (site.tags.length){ %>
+  <section class='<%- item.widget %>'>
+    <%- partial('header', {item: item, defIcon: theme.widgets.tagcloud.icon, defTitle: theme.widgets.tagcloud.title}) %>
+    <div class='content <%= theme.style %>'>
+      <%- tagcloud(site.tags, {
+          min_font: 14,
+          max_font: 24,
+          color: true,
+          start_color: '#999',
+          end_color: '#555',
+      }) %>
+    </div>
+  </section>
+<% } %>
--- a/layout/_widget/toc.ejs
+++ b/layout/_widget/toc.ejs
@ -1,5 +1,8 @@
 <% if(page.layout == 'post' && page.content && page.toc!==false && toc(page.content).length > 0){ %>
-  <div class='content <%= theme.style %>'>
-    <%- toc(page.content, {list_number: false}) %>
-  </div>
+  <section class='toc-wrapper'>
+    <%- partial('header', {item: item, defIcon: theme.widgets.toc.icon, defTitle: theme.widgets.toc.title}) %>
+    <div class='content <%= theme.style %>'>
+      <%- toc(page.content, {list_number: false}) %>
+    </div>
+  </section>
 <% } %>
--- a/layout/links.ejs
+++ b/layout/links.ejs
@ -44,4 +44,4 @@

 <br>

-<%- partial('_partial/comments') %>
+<%- partial('_third-party/comments') %>
--- a/source/less/_color.less
+++ b/source/less/_color.less
@ -1,11 +1,12 @@
 // 如果你只想简单地换个风格，可以只改这里的几项：
 // 网页背景颜色
-@theme_background: #efefef;   // 暗色主题示例：#454545;
+@theme_background: #EFEFEF;
+// @theme_background: #454545; // 暗色主题
 // 主题色
@theme_main: #1BC3FB;
 // 卡片背景颜色
-@theme_cardbg: white;         // 暗色主题示例：#555;
-
+@theme_cardbg: white;
+// @theme_cardbg: #555; // 暗色主题



@ -34,4 +35,5 @@
 // 在主题色中显示的文本（一般为白或深灰）
@color_text_in_header: white;
 // 正文文字颜色
-@color_text_main: @dark;     // 暗色主题示例：white;
+@color_text_main: @dark;
+// @color_text_main: white; // 暗色主题
--- a/source/less/_header.less
+++ b/source/less/_header.less
@ -91,12 +91,12 @@
            padding: 0 8px;
            &:hover{
                color: @color_text_in_header;
-                border-bottom: 4px solid @theme_cardbg;
+                border-bottom: @loading_height solid @theme_cardbg;
                background: fade(@theme_cardbg, 10%);
            }
            &:active,&.active{
                color: @color_text_in_header;
-                border-bottom: 4px solid @theme_cardbg;
+                border-bottom: @loading_height solid @theme_cardbg;
            }
        }
        @media(max-width: @on_phone){
--- a/source/less/_main.less
+++ b/source/less/_main.less
@ -148,10 +148,7 @@
            margin: 8px 8px 0 8px;
            .emoji{
              height: 24px;
-              // &.aru{
-              //   height: 18px;
-              //   margin-top: 3px;
-              // }
+              margin-top: 6px;
            }
          }
        }
--- a/source/less/_widget.less
+++ b/source/less/_widget.less
@ -247,7 +247,7 @@
          text-align: justify;
          padding: @gap/2 @gap;
          &.pure{
-            padding-top: 0; // 适合白色导航栏背景
+            padding: 0 @gap @gap @gap; // 适合白色导航栏背景
          }
          a{
            display:inline-block;