From efe9d9b64b51585baa44cc572cb244066fbcd831 Mon Sep 17 00:00:00 2001
From: XPoet <i@xpoet.cn>
Date: Wed, 28 Oct 2020 22:25:26 +0800
Subject: [PATCH] perf: article content page

---
 layout/_partial/comments/valine.ejs    | 15 +++++++++++++--
 layout/article-content.ejs             | 10 ++++++++--
 source/css/layout/article-content.styl | 16 +++++++++-------
 3 files changed, 30 insertions(+), 11 deletions(-)

diff --git a/layout/_partial/comments/valine.ejs b/layout/_partial/comments/valine.ejs
index 2004116..9fd491e 100755
--- a/layout/_partial/comments/valine.ejs
+++ b/layout/_partial/comments/valine.ejs
@@ -19,13 +19,24 @@
             });
 
 
-            // Valine 评论列表增加"作者"标识
+            // Valine 评论列表增加"博主"标识
             const getValineDomTimer = setInterval(() => {
                 const vcards = document.querySelectorAll('#vcomments .vcards .vcard');
                 if (vcards.length > 0) {
+
+                    let author = '<%= theme.base_info.author || config.author %>';
+                    if (author) {
+                        author = author.toLocaleLowerCase();
+                    }
+
+                    let email = '<%= theme.base_info.email %>';
+                    if (email) {
+                        email = email.toLocaleLowerCase();
+                    }
+
                     for (let vcard of vcards) {
                         const vnick = vcard.querySelector('.vhead .vnick');
-                        if (vnick.innerHTML.toLocaleLowerCase() === '<%= config.author %>'.toLocaleLowerCase()) {
+                        if (vnick.innerHTML.toLocaleLowerCase() === author) {
                             vcard.classList.add('author');
                         }
                     }
diff --git a/layout/article-content.ejs b/layout/article-content.ejs
index 1533c5c..e0d0ff5 100644
--- a/layout/article-content.ejs
+++ b/layout/article-content.ejs
@@ -5,14 +5,14 @@
             <span class="title-hover-animation"><%= page.title %></span>
         </div>
 
-        <% if (theme.style.avatar && config.author) { %>
+        <% if (theme.style.avatar && (theme.base_info.author || config.author)) { %>
             <div class="article-header">
                 <div class="avatar">
                     <%- image_tag(theme.style.avatar) %>
                 </div>
                 <div class="info">
                     <div class="author">
-                        <span><%= config.author %></span>
+                        <span><%= theme.base_info.author || config.author %></span>
                         <span class="level">Lv<%- getLevel(site.posts.length) %></span>
                     </div>
                     <div class="meta-info">
@@ -20,6 +20,12 @@
                     </div>
                 </div>
             </div>
+        <% } else { %>
+            <div class="article-header-meta-info">
+                <div class="meta-info">
+                    <%- partial('_partial/article-meta-info', {articleObject: page, index: true}) %>
+                </div>
+            </div>
         <% } %>
 
         <div class="article-content markdown-body">
diff --git a/source/css/layout/article-content.styl b/source/css/layout/article-content.styl
index 7e1c5c2..9670175 100644
--- a/source/css/layout/article-content.styl
+++ b/source/css/layout/article-content.styl
@@ -25,20 +25,13 @@ $avatarWidth = 46px;
     }
   }
 
-
   .article-header {
-    margin-top: 16px;
     position: relative;
     padding-left: $avatarWidth;
     width: 100%;
     height: $avatarWidth;
     box-sizing: border-box;
 
-    +ils-tablet() {
-      transform: scale(0.9);
-      transform-origin: left top;
-    }
-
     .avatar {
       position: absolute;
       top: 0
@@ -90,6 +83,15 @@ $avatarWidth = 46px;
   }
 
 
+  .article-header,
+  .article-header-meta-info {
+    margin-top: 16px;
+    +ils-tablet() {
+      transform: scale(0.88);
+      transform-origin: left top;
+    }
+  }
+
   .article-content {
     margin-top: 30px;
     text-align: justify;