feature:

为了medium-zoom暂时回滚4.6.5的react-notion-x

components/ArticleDetail.js

@@ -43,7 +43,7 @@ export default function ArticleDetail ({ post, blockMap, recommendPosts, prev, n
           >
             <header>
                 {post.type && !post.type.includes('Page') && post?.page_cover && (
-                          <div className="w-full h-60 lg:h-96 transform duration-200 md:flex-shrink-0 overflow-hidden">
+                          <div className="w-full h-60 relative lg:h-96 transform duration-200 md:flex-shrink-0 overflow-hidden">
                             <Image
                               src={post?.page_cover}
                               loading="eager"

package.json

@@ -33,15 +33,15 @@
     "lodash.throttle": "^4.1.1",
     "memory-cache": "^0.2.0",
     "next": "^12.0.5",
-    "notion-client": "^4.10.0",
-    "notion-utils": "^4.10.0",
+    "notion-client": "^4.12.0",
+    "notion-utils": "^4.12.0",
     "preact": "^10.5.15",
     "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.11.0",
+    "react-notion-x": "4.6.5",
     "smoothscroll-polyfill": "^0.4.4",
     "typed.js": "^2.0.12",
     "use-ackee": "^3.0.0"

pages/_app.js

@@ -1,9 +1,16 @@
 import BLOG from 'blog.config'
 import 'animate.css'
-import '@/styles/notion.css'
 import '@/styles/globals.css'
+// custom
+// core styles shared by all of react-notion-x (required)
+import 'react-notion-x/src/styles.css'
+import '@/styles/notion.css' //  重写部分样式
+
+// used for collection views (optional)
 import 'rc-dropdown/assets/index.css'
+// used for code syntax highlighting (optional)
 import 'prismjs/themes/prism-okaidia.css'
+// used for rendering equations (optional)
 import 'katex/dist/katex.min.css'
 import dynamic from 'next/dynamic'
 import { GlobalContextProvider } from '@/lib/global'