From 1448379d6cbec4f142a86c359d38545c87701642 Mon Sep 17 00:00:00 2001
From: tangly1024 <tlyong1992@hotmail.com>
Date: Sat, 6 Nov 2021 23:01:12 +0800
Subject: [PATCH] =?UTF-8?q?Fix:=20react-notion-x=E9=99=8D=E7=BA=A7:4.6.5?=
 =?UTF-8?q?=20=E5=BC=80=E5=90=AFmedia-zoom;=20notion-viewport=E5=A4=84?=
 =?UTF-8?q?=E7=90=86=E9=81=AE=E7=9B=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/Toc.js       | 11 ++++-------
 package.json            |  6 +++---
 pages/article/[slug].js |  2 +-
 styles/notion.css       |  5 +++--
 4 files changed, 11 insertions(+), 13 deletions(-)

diff --git a/components/Toc.js b/components/Toc.js
index 75900311..c850949f 100644
--- a/components/Toc.js
+++ b/components/Toc.js
@@ -1,7 +1,7 @@
 import React, { useCallback } from 'react'
 import throttle from 'lodash.throttle'
 import { uuidToId } from 'notion-utils'
-import { cs } from 'react-notion-x'
+// import { cs } from 'react-notion-x'
 
 /**
  * 目录导航组件
@@ -62,12 +62,9 @@ const Toc = ({ toc }) => {
           <a
             key={id}
             href={`#${id}`}
-            className={cs(
-              'notion-table-of-contents-item px-5',
-              `notion-table-of-contents-item-indent-level-${tocItem.indentLevel}`,
-              activeSection === id &&
-              ' font-bold text-black dark:text-white animate-pulse'
-            )}
+            className={`notion-table-of-contents-item px-5 
+            notion-table-of-contents-item-indent-level-${tocItem.indentLevel} 
+            ${activeSection === id && ' font-bold text-black dark:text-white animate-pulse'}`}
           >
                       <span
                         className='notion-table-of-contents-item-body'
diff --git a/package.json b/package.json
index ec229420..b487cab2 100644
--- a/package.json
+++ b/package.json
@@ -29,15 +29,15 @@
     "lodash.throttle": "^4.1.1",
     "memory-cache": "^0.2.0",
     "next": "10.2.0",
-    "notion-client": "4.9.3",
-    "notion-utils": "4.8.6",
+    "notion-client": "4.10.0",
+    "notion-utils": "4.10.0",
     "preact": "^10.5.13",
     "qrcode.react": "^1.0.1",
     "react": "17.0.2",
     "react-cookies": "^0.1.1",
     "react-cusdis": "^2.0.1",
     "react-dom": "17.0.2",
-    "react-notion-x": "^4.6.5",
+    "react-notion-x": "4.6.5",
     "use-ackee": "^3.0.0"
   },
   "devDependencies": {
diff --git a/pages/article/[slug].js b/pages/article/[slug].js
index 58c7ec6a..9934c5c8 100644
--- a/pages/article/[slug].js
+++ b/pages/article/[slug].js
@@ -137,7 +137,7 @@ const ArticleDetail = ({ post, blockMap, tags, prev, next, posts, categories })
 
           {post.tags && (
             <div className='flex flex-nowrap leading-8 p-1 py-4'>
-              <div className='hidden md:block'>标签：</div>
+              <div className='hidden md:block  dark:text-gray-300'>标签：</div>
               {post.tags.map(tag => (
                 <TagItem key={tag} tag={tag} />
               ))}
diff --git a/styles/notion.css b/styles/notion.css
index a24dc846..6e84d653 100644
--- a/styles/notion.css
+++ b/styles/notion.css
@@ -180,14 +180,15 @@
   min-height: 100vh;
 }
 
-/* .notion-viewport {
+.notion-viewport {
   position: fixed;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   z-index: -10;
-} */
+  pointer-events: none;
+}
 
 .medium-zoom-overlay {
   z-index: 300;