...

_config.yml

@@ -22,3 +22,15 @@ stylesheets:
 # scripts loaded in the end of the body
 scripts:
 - /js/hexo-theme-yorha.js
+
+wordcount:
+  enable: true
+  post_wordcount: true
+  min2read: true
+  total_wordcount: true
+
+social:
+  Github: lensferno || https://github.com/lensferno
+  Email: lensferno@outlook.com || mailto:lensferno@outlook.com
+  Twitter: lensfrex || https://www.twitter.com
+  Bilibili: lensfrex || https://bilibili.com

layout/includes/_partials/data_row.pug

@@ -1,4 +1,8 @@
-mixin data_row(name, value)
+mixin data_row(name, value, target_href)
   .data-row
     span.data-name=name
+    if target_href
+      span.data-value
+        a(href=target_href target='_balnk')=value
+    else
       span.data-value=value

layout/includes/_partials/information_card.pug

@@ -1,6 +1,8 @@
 include titled_card.pug
 include data_row.pug 
+include button.pug
 
+mixin information_card(...extendData)
   .information-card
     +titled_card("Status")
       .information-content
@@ -12,24 +14,25 @@ include data_row.pug
             span.sign= config.description
 
         hr
-
-      +data_row("页面创建", page.date)
-      +data_row("页面更新", page.updated)
-      
-      hr
-
         +data_row("文章", site.posts.length)
         +data_row("页面", site.pages.length)
         +data_row("标签", site.tags.length)
         +data_row("分类", site.categories.length)
 
+        if theme.social
           hr
-
-      +data_row("文章数", 12)
-      +data_row("总字数", "16k")
-      +data_row("全站访问次数", "16k")
+          each value, name in theme.social
+            - const splitValue = value.split('||')
+            - const displayValue = splitValue[0]
+            - const link = splitValue[1]
+              +data_row(name, displayValue, link)
 
         hr
+        if extendData
+          each data in extendData
+            +data_row(data.name, data.value)
         
-      span.no-error-declaration NO ERROR
+        +data_row("运行时间", "421天")
 
+        hr
+        span.no-error-declaration NO ERROR

layout/includes/layout.pug

@@ -12,6 +12,7 @@ html(lang=config.language)
   head
     meta(charset='UTF-8')
     title= pageTitle
+    script(src="js/lazyload.min.js") 
     if theme.stylesheets !== undefined && theme.stylesheets.length > 0
       //- stylesheets list from _config.yml
       each url in theme.stylesheets

layout/index.pug

@@ -1,10 +1,27 @@
 extends includes/layout.pug
+include includes/_partials/information_card.pug
+include includes/_partials/post_list/post_item.pug
 
 block content
   .index-content
     .left-content
-      include ./includes/_partials/left_declaration.pug
+      include includes/_partials/left_declaration.pug
       .post-list
+        - const posts = page.posts
+        - posts.each(function(post) {
+            - const date = moment(post.date).format('MM/DD/YYYY')
+            - const time = moment(post.date).format('HH:mm:ss')
+            - let summary = ''
+            if post.description
+              summary = post.description 
+            else if post.more
+              - const strip = strip_html(post.more).substr(0, 128)
+              - summary = strip.length < 128 ? strip : strip + '...'
+            else 
+              - const strip = strip_html(post.content).substr(0, 128)
+              - summary = strip.length < 128 ? strip : strip + '...'
+            +post_item(post.title, post.cover, date , summary, time)
+        - })
           
     .right-content
-      include includes/_partials/information_card.pug
+      +information_card({name: '全站总字数', value: totalcount(site)})

source/css/_partials/button.styl

@@ -17,7 +17,6 @@
       display: flex
       flex-direction: column
       color: rgb(74, 71, 62)
-      align-items: flex-start
       background-image: linear-gradient(90deg, rgb(180, 175, 154) 50%, rgb(180, 175, 154) 50%, rgb(74, 71, 62) 50%, rgb(74, 71, 62) 100%)
       background-size: 200%
       transition: all 0.2s linear 0s

source/css/_partials/data_row.styl

@@ -1,3 +1,6 @@
 .data-row
   display: flex
   flex-direction: row
+  .data-value a
+    text-decoration: none
+    color: rgb(74, 71, 62)

source/css/_partials/index.styl

@@ -7,11 +7,15 @@
     width: 73%;
     display: flex;
     flex-direction: row;
-    gap: 16px;
     .post-list
       background-color: rgba(231, 225, 199, 0.5);
       height: auto
+      display: flex;
+      flex-direction: column;
+      gap: 16px;
       width: 100%
+      // overflow-y: scroll
+      overflow-x: hidden
 
   .right-content
     width: 24%

source/css/_partials/information_card.styl

@@ -30,7 +30,6 @@
   span.no-error-declaration
     margin: 32px 0
     text-align: center
-    font-weight: bold
     font-size: 20px
     user-select: none
     letter-spacing: 2px

source/css/common.styl

@@ -1,7 +1,10 @@
-$backgroundColor=#c6c2a5
+$backgroundColor=rgb(197, 194, 165)
+
+$light=rgb(231, 225, 199)
+$dark=rgb(74, 71, 62)
 
 body
-  background-color: #c6c2a5
+  background-color: rgb(197, 194, 165)
   background-image:
     linear-gradient(90deg, #c6c2a5 2px, rgba(255 255 255 0) 0), 
     linear-gradient(180deg, #c6c2a5 2px, rgb(209 205 178) 0)
@@ -46,11 +49,15 @@ span::selection
     background-color: rgb(74 71 62);
     width: 10px;
     height: 10px;
+  &::-webkit-scrollbar-corner
+    background-color: rgb(197, 194, 165);
   &::-webkit-scrollbar-thumb 
     border-radius: 0px;
     background: rgb(74 71 62);
   &::-webkit-scrollbar
     width: 10px;
+    height: 10px;
 
 @import '_partials/header/*'
+@import '_partials/post_list/*'
 @import '_partials/*'