feat: 添加 artitalk 説説插件

style: 主題文件分類調正

_config.yml

@@ -751,6 +751,13 @@ note:
 # other
 # --------------------------------------
 
+# Artitalk
+# see https://artitalk.js.org/
+artitalk:
+  appId:
+  appKey:
+  option:
+
 # Pjax [Beta]
 # It may contain bugs and unstable, give feedback when you find the bugs.
 # https://github.com/MoOx/pjax
@@ -910,3 +917,5 @@ CDN:
   prismjs_js: https://cdn.jsdelivr.net/npm/prismjs/prism.min.js
   prismjs_lineNumber_js: https://cdn.jsdelivr.net/npm/prismjs/plugins/line-numbers/prism-line-numbers.min.js
   prismjs_autoloader: https://cdn.jsdelivr.net/npm/prismjs/plugins/autoloader/prism-autoloader.min.js
+
+  artitalk: https://cdn.jsdelivr.net/npm/artitalk

layout/flink.pug

@@ -1,24 +0,0 @@
-#page
-  .flink#article-container
-    if site.data.link
-      each i in site.data.link
-        if i.class_name
-          h2!= i.class_name
-        if i.class_desc
-          .flink-desc!=i.class_desc
-        .flink-list
-          each item in i.link_list
-            .flink-list-item
-              a(href=url_for(item.link)  title=item.name target="_blank")
-                if theme.lazyload.enable
-                  img(data-lazy-src=url_for(item.avatar) onerror=`this.onerror=null;this.src='` + url_for(theme.error_img.flink) + `'` alt=item.name )
-                else
-                  img(src=url_for(item.avatar) onerror=`this.onerror=null;this.src='` + url_for(theme.error_img.flink) + `'` alt=item.name )
-                span.flink-item-name= item.name 
-                span.flink-item-desc(title=item.descr)= item.descr
-    != page.content
-  if page.comments !== false && theme.comments && theme.comments.use
-    - var commentsJsLoad = true
-    !=partial('includes/third-party/comments/index', {}, {cache:theme.fragment_cache})
-
-

layout/includes/additional-js.pug

@@ -35,6 +35,9 @@ div
   .js-pjax
     if theme.subtitle.enable && is_home() && theme.index_img !== false
       include ./third-party/subtitle.pug
+    
+    if page.type === 'artitalk'
+      include ./third-party/artitalk.pug
 
     include ./third-party/math/index.pug
 

layout/includes/page/artitalk.pug

@@ -0,0 +1 @@
+#artitalk_main

layout/includes/page/categories.pug

@@ -0,0 +1,5 @@
+.category-lists
+  .category-title.is-center= _p('page.category')
+    |  - 
+    span.category-amount= site.categories.length
+  div!= list_categories()

layout/includes/page/default-page.pug

@@ -0,0 +1,6 @@
+if theme.douban && theme.douban.meta && doubanExist
+  meta(name="referrer" content="no-referrer")
+#article-container
+  if top_img === false
+    h1.page-title= page.title
+  != page.content

layout/includes/page/flink.pug

@@ -0,0 +1,19 @@
+.flink#article-container
+  if site.data.link
+    each i in site.data.link
+      if i.class_name
+        h2!= i.class_name
+      if i.class_desc
+        .flink-desc!=i.class_desc
+      .flink-list
+        each item in i.link_list
+          .flink-list-item
+            a(href=url_for(item.link)  title=item.name target="_blank")
+              if theme.lazyload.enable
+                img(data-lazy-src=url_for(item.avatar) onerror=`this.onerror=null;this.src='` + url_for(theme.error_img.flink) + `'` alt=item.name )
+              else
+                img(src=url_for(item.avatar) onerror=`this.onerror=null;this.src='` + url_for(theme.error_img.flink) + `'` alt=item.name )
+              span.flink-item-name= item.name 
+              span.flink-item-desc(title=item.descr)= item.descr
+  != page.content
+

layout/includes/page/tags.pug

@@ -0,0 +1,5 @@
+.tag-cloud-title.is-center= _p('page.tag')
+  |  - 
+  span.tag-cloud-amount= site.tags.length
+.tag-cloud-list.is-center
+  !=cloudTags({source: site.tags, minfontsize: 1.2, maxfontsize: 2.1, limit: 0, unit: 'em'})

layout/includes/third-party/artitalk.pug

@@ -0,0 +1,24 @@
+- let option = theme.artitalk.option ? JSON.stringify(theme.artitalk.option) : false
+
+script.
+  (()=>{
+    let setting = {
+      appId: '!{theme.artitalk.appId}',
+      appKey: '!{theme.artitalk.appKey}',
+    }
+
+    if (!{Boolean(option)}) {
+      const otherSetting = !{option}
+      setting = Object.assign({}, setting, otherSetting)
+    }
+
+    const init = () => {
+      new Artitalk(setting)
+    }
+
+    if (typeof Artitalk === 'function') {
+      init()
+    } else {
+      $.getScript('!{theme.CDN.artitalk}',init)
+    }
+  })()

layout/page.pug

@@ -1,36 +1,19 @@
 extends includes/layout.pug
 
 block content
-  if page.type === 'tags'
-    .tag-cloud
-      .tag-cloud__title= _p('page.tag')
-        |  - 
-        span.tag-cloud__amount= site.tags.length
-      .tag-cloud-tags
-        !=cloudTags({source: site.tags, minfontsize: 1.2, maxfontsize: 2.1, limit: 0, unit: 'em'})
-      if page.comments !== false && theme.comments && theme.comments.use
-        - var commentsJsLoad = true
-        !=partial('includes/third-party/comments/index', {}, {cache:theme.fragment_cache})
-  else if page.type === 'link'
-    include flink.pug
-  else if page.type === 'categories'    
-    .category-content
-      .category-lists
-        .category__title= _p('page.category')
-          |  - 
-          span.category__amount= site.categories.length
-        div!= list_categories()
-      if page.comments !== false && theme.comments && theme.comments.use
-        - var commentsJsLoad = true
-        !=partial('includes/third-party/comments/index', {}, {cache:theme.fragment_cache})
-  else
-    #page
-      if theme.douban && theme.douban.meta && doubanExist
-        meta(name="referrer" content="no-referrer")
-      #article-container
-        if top_img === false
-          h1.page-title= page.title
-        != page.content
-      if page.comments !== false && theme.comments && theme.comments.use
-        - var commentsJsLoad = true
-        !=partial('includes/third-party/comments/index', {}, {cache:theme.fragment_cache})
+  #page
+    case page.type
+      when 'tags'
+        include includes/page/tags.pug
+      when 'link'
+        include includes/page/flink.pug
+      when 'categories'
+        include includes/page/categories.pug
+      when 'artitalk'
+        include includes/page/artitalk.pug
+      default
+        include includes/page/default-page.pug
+
+    if page.comments !== false && theme.comments && theme.comments.use
+      - var commentsJsLoad = true
+      !=partial('includes/third-party/comments/index', {}, {cache:theme.fragment_cache})

package.json

@@ -1,6 +1,6 @@
 {
   "name": "hexo-theme-butterfly",
-  "version": "3.2.0-b4",
+  "version": "3.2.0-b5",
   "description": "A Simple and Card UI Design theme for Hexo",
   "main": "package.json",
   "scripts": {

source/css/_mode/darkmode.styl

@@ -162,3 +162,8 @@ if hexo-config('darkmode.enable') || hexo-config('display_mode') == 'dark'
 
           blockquote
             color: alpha(#FFFFFF, .7)
+
+    #artitalk_main #lazy
+      background: #121212
+    #operare_artitalk .c2
+      background: #121212

source/css/_page/categories.styl

@@ -1,12 +1,11 @@
-.category-content
+#page
   .category-lists
     padding: 1rem 0 1.5rem
 
     +maxWidth768()
       padding: 0
 
-    .category__title
-      text-align: center
+    .category-title
       font-size: 2.57em
 
       +maxWidth768()

source/css/_page/common.styl

@@ -39,13 +39,8 @@
   &:hover
     box-shadow: 0 4px 12px 12px rgba(7, 17, 27, .15)
 
-+minWidth900()
-  if hexo-config('aside.position') == 'left'
-    #recent-posts,
-    #page,
-    .category-content,
-    #archive,
-    .tag-cloud,
-    #tag,
-    #category
-      order: 2
+if hexo-config('aside.position') == 'left'
+  +minWidth900()
+    .layout_page
+      & > div:first-child
+        order: 2

source/css/_page/tags.styl

@@ -1,19 +1,18 @@
 .tag-cloud
-  text-align: center
+  &-list
+    a
+      display: inline-block
+      padding: 0 .4rem
+      transition: all .3s
 
-  a
-    display: inline-block
-    padding: 0 .4rem
-    transition: all .3s
+      &:hover
+        color: $text-hover !important
+        transform: scale(1.1)
 
-    &:hover
-      color: $text-hover !important
-      transform: scale(1.1)
+      +maxWidth768()
+        zoom: .85
 
-    +maxWidth768()
-      zoom: .85
-
-  &__title
+  &-title
     font-size: 2.57em
 
     +maxWidth768()