From b0ab16a4e86e6aada3601db0b6e3032e62027352 Mon Sep 17 00:00:00 2001 From: tangly1024 Date: Thu, 6 Jan 2022 16:53:13 +0800 Subject: [PATCH 1/2] =?UTF-8?q?medium-zoom=20=E9=81=AE=E7=BD=A9=E5=B1=82?= =?UTF-8?q?=E6=A0=B7=E5=BC=8F=E8=B0=83=E6=95=B4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- styles/globals.css | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/styles/globals.css b/styles/globals.css index 2b5e0411..b5365ede 100644 --- a/styles/globals.css +++ b/styles/globals.css @@ -159,4 +159,8 @@ nav { background: rgba(31, 41, 55, .75); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); +} + +.medium-zoom-overlay{ + background: none !important; } \ No newline at end of file From bf4dd19aaa757953e85b550b92743482c6e30aa5 Mon Sep 17 00:00:00 2001 From: tangly1024 Date: Thu, 6 Jan 2022 16:54:20 +0800 Subject: [PATCH 2/2] =?UTF-8?q?=E5=8D=87=E7=BA=A7notion-client=E3=80=81?= =?UTF-8?q?=E5=8D=87=E7=BA=A7react-notion-x=EF=BC=9B=E6=89=8B=E5=8A=A8?= =?UTF-8?q?=E5=90=AF=E7=94=A8medium-zoom?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/ArticleDetail.js | 34 ++++++++++++++++++++++++---------- lib/notion/getAllPageIds.js | 2 +- package.json | 4 ++-- 3 files changed, 27 insertions(+), 13 deletions(-) diff --git a/components/ArticleDetail.js b/components/ArticleDetail.js index 66245caa..6ef528fe 100644 --- a/components/ArticleDetail.js +++ b/components/ArticleDetail.js @@ -19,7 +19,7 @@ import 'prismjs/components/prism-javascript' import 'prismjs/components/prism-markup' import 'prismjs/components/prism-python' import 'prismjs/components/prism-typescript' -import { useRef } from 'react' +import { useEffect, useRef } from 'react' import { Code, Collection, CollectionRow, Equation, NotionRenderer } from 'react-notion-x' import ArticleCopyright from './ArticleCopyright' import Live2D from './Live2D' @@ -43,26 +43,40 @@ export default function ArticleDetail ({ post, blockMap, recommendPosts, prev, n margin: getMediumZoomMargin() }) const zoomRef = useRef(zoom ? zoom.clone() : null) - function attachZoom (image) { - if (zoomRef.current) { - (zoomRef.current).attach(image) + + useEffect(() => { + // 将所有container下的所有图片添加medium-zoom + const container = document.getElementById('container') + const imgList = container.getElementsByTagName('img') + if (imgList && zoomRef.current) { + for (let i = 0; i < imgList.length; i++) { + (zoomRef.current).attach(imgList[i]) + } } - } - const attachZoomRef = attachZoom + }) return (<> -
+
- {post.type && !post.type.includes('Page') && post?.page_cover && ( + {post.type && !post.type.includes('Page') && post?.page_cover && (
{/* eslint-disable-next-line @next/next/no-img-element */} - {post.title} + {post.title} + {/*
+ {post.title} +
*/}
- )} + )} {/* 文章Title */}
diff --git a/lib/notion/getAllPageIds.js b/lib/notion/getAllPageIds.js index 6821925e..f70e7f9a 100644 --- a/lib/notion/getAllPageIds.js +++ b/lib/notion/getAllPageIds.js @@ -15,7 +15,7 @@ export default function getAllPageIds (collectionQuery, viewId) { } else { const pageSet = new Set() Object.values(views).forEach(view => { - view?.blockIds?.forEach(id => pageSet.add(id)) + view?.collection_group_results?.blockIds?.forEach(id => pageSet.add(id)) }) pageIds = [...pageSet] } diff --git a/package.json b/package.json index 869f099a..3328bd09 100644 --- a/package.json +++ b/package.json @@ -33,7 +33,7 @@ "lodash.throttle": "^4.1.1", "memory-cache": "^0.2.0", "next": "^12.0.5", - "notion-client": "4.12.0", + "notion-client": "4.13.0", "notion-utils": "4.12.0", "preact": "^10.5.15", "qrcode.react": "^1.0.1", @@ -41,7 +41,7 @@ "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.13.0", "smoothscroll-polyfill": "^0.4.4", "typed.js": "^2.0.12", "use-ackee": "^3.0.0"