From 0c719be17e8affb28dd42c9c8bfb52e3e21d9790 Mon Sep 17 00:00:00 2001
From: MHuiG <616001163@qq.com>
Date: Mon, 15 Aug 2022 08:49:13 +0800
Subject: [PATCH] fix(#781): content_visibility: false

---
 _config.yml                           |  4 +++
 layout/_partial/scripts/index.ejs     |  4 ++-
 scripts/filters/content-visibility.js | 38 ++++++++++++++-------------
 source/css/first.styl                 | 24 +++++++++--------
 4 files changed, 40 insertions(+), 30 deletions(-)

diff --git a/_config.yml b/_config.yml
index 3d0288c6f..84b59b8da 100755
--- a/_config.yml
+++ b/_config.yml
@@ -61,6 +61,10 @@ cdn_version: false
 # https://github.com/volantis-x/volantis-static
 volantis_static_cdn: https://unpkg.com/volantis-static@0.0.1654736714924/
 ########################################################################
+#  https://web.dev/content-visibility/
+#  https://www.caniuse.com/?search=content-visibility
+content_visibility: false
+
 # 全局页面字符串替换  A => B (可用于临时修改错字等)
 replace:
   - https://cdn.jsdelivr.net/npm/ => https://unpkg.com/
diff --git a/layout/_partial/scripts/index.ejs b/layout/_partial/scripts/index.ejs
index 41da2ae9a..c7920a85c 100644
--- a/layout/_partial/scripts/index.ejs
+++ b/layout/_partial/scripts/index.ejs
@@ -136,7 +136,9 @@
 
 <%- partial('toc') %>
 
-<%- partial('content-visibility-scroll-fix') %>
+<% if (theme.content_visibility) { %>
+  <%- partial('content-visibility-scroll-fix') %>
+<% } %>
 
 <%- partial('../../_plugins/slow-network/script') %>
 
diff --git a/scripts/filters/content-visibility.js b/scripts/filters/content-visibility.js
index c7d5fcc12..a0d3d2f60 100644
--- a/scripts/filters/content-visibility.js
+++ b/scripts/filters/content-visibility.js
@@ -2,24 +2,26 @@
 // https://www.caniuse.com/?search=content-visibility
 // 在文章内容渲染时将每两个 <h2> 之间的内容分为一块 用 <div class="post-story"></div> 包裹起来。然后为 .post-story 声明 content-visibility: auto
 hexo.extend.filter.register('after_post_render', function (data) {
-  let dataList = data.content.split('\n')
-  let mydata = ``
-  let flag = 1
-  dataList.forEach(e => {
-    let yy = e.replace(/<h2.*?>.*?<\/h2>/, function (str) {
-      if (flag) {
-        flag = 0
-        return `<div class="story post-story">` + str
-      } else {
-        return `</div><div class="story post-story">` + str
-      }
-    })
-    mydata += yy
-    mydata += "\n"
-  });
-  if (!flag) {
-    mydata += `</div>`
+  if (this.theme.config.content_visibility) {
+    let dataList = data.content.split('\n')
+    let mydata = ``
+    let flag = 1
+    dataList.forEach(e => {
+      let yy = e.replace(/<h2.*?>.*?<\/h2>/, function (str) {
+        if (flag) {
+          flag = 0
+          return `<div class="story post-story">` + str
+        } else {
+          return `</div><div class="story post-story">` + str
+        }
+      })
+      mydata += yy
+      mydata += "\n"
+    });
+    if (!flag) {
+      mydata += `</div>`
+    }
+    data.content = mydata
   }
-  data.content = mydata
   return data;
 });
\ No newline at end of file
diff --git a/source/css/first.styl b/source/css/first.styl
index 4fad2791e..2b8838022 100644
--- a/source/css/first.styl
+++ b/source/css/first.styl
@@ -1,17 +1,19 @@
 #safearea {
   display: none
 }
-// https://web.dev/content-visibility/
-// https://www.caniuse.com/?search=content-visibility
-/*
-  * Workaround for Chrome bug, part 1
-  * Chunk rendering for all but the first article.
-  * /layout/_partial/scripts/content-visibility-scroll-fix.ejs
-*/
-.post-story + .post-story{
-  content-visibility: auto;
-  contain-intrinsic-size: 10px 500px;
-}
+
+if hexo-config('content_visibility')
+  // https://web.dev/content-visibility/
+  // https://www.caniuse.com/?search=content-visibility
+  /*
+    * Workaround for Chrome bug, part 1
+    * Chunk rendering for all but the first article.
+    * /layout/_partial/scripts/content-visibility-scroll-fix.ejs
+  */
+  .post-story + .post-story{
+    content-visibility: auto;
+    contain-intrinsic-size: 10px 500px;
+  }
 
 @import '_defines/*'