diff --git a/README.md b/README.md index 5621da75..6e531429 100644 --- a/README.md +++ b/README.md @@ -2,7 +2,7 @@ 访问帮助：[NotionNext帮助手册](https://docs.tangly1024.com/) -> 本项目教程为免费、公开资源，仅限个人学习使用。严禁任何个人或组织将本教程用于商业用途，包括但不限于直接售卖、间接收费、或其他变相盈利行为。转载、复制或介绍本教程内容时，须保留作者信息并明确注明来源。 +> 本项目教程为免费、公开资源，仅限个人学习使用，禁止利用本教程建立的博客发布非法内容、进行违法犯罪活动。严禁任何个人或组织将本教程用于商业用途，包括但不限于直接售卖、间接收费、或其他变相盈利行为。转载、复制或介绍本教程内容时，须保留作者信息并明确注明来源。 > 本项目仅提供由作者团队授权的付费咨询服务，请注意辨别，谨防诈骗行为。任何未经授权的收费服务均可能存在法律风险。 Notion是一个能让效率暴涨的生产力引擎，可以帮你书写文档、管理笔记，搭建知识库，甚至可以为你规划项目、时间管理、组织团队、提高生产力、还有当前最强大的AI技术加持。 @@ -52,142 +52,9 @@ Notion是一个能让效率暴涨的生产力引擎，可以帮你书写文档 ## 贡献者 - - - - - - - +感谢所有为 NotionNext 做出贡献的人！ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
- tangly1024
tangly1024
🎫 🔧 🐛 - 		- uWayLu
uWayLu
🔧 🐛 - 		- txs
txs
🔧 🐛 - 		- yuzhanglong
yuzhanglong
🔧 🐛 - 		- Hscpro
Hscpro
🔧 🐛 - 		- JensonMiao
JensonMiao
🔧 🐛 - 		- haixin1225
haixin1225
🔧 🐛 - 		- mouyase
mouyase
🔧 🐛 - 		- qfdk
qfdk
🔧 🐛 - 		- ifyz
ifyz
🔧 🐛 - 		- Liqun Zhao
Liqun Zhao
🔧 🐛 - 		- Ylarod
Ylarod
🔧 🐛 - 		- Etherrreal.
Etherrreal.
🔧 🐛 - 		- Joshua Astray
Joshua Astray
🔧 🐛 - 		- Vixcity
Vixcity
🔧 🐛 - 		- ipatpat
ipatpat
🔧 🐛 - 		- xloong
xloong
🔧 🐛 - 		- expoli
expoli
🔧 🐛 - 		- SuperHuangXu
bUBBLE
🔧 🐛 - 		- Pylogmon
派了个萌
🔧 🐛 - 		- SkysCrystal
Simon Shi
🔧 🐛 - 		- S.Y. Lee
S.Y. Lee
🔧 🐛 - 		- fighting-buf
fighting-buf
🔧 🐛 - 		- cliouo
cliouo
🔧 🐛 - 		- Sude Akgün
Sude Akgün
🔧 🐛 - 		- Ray
Ray
🔧 🐛 - 		- Hongzzz
Hongzzz
🔧 🐛 - 		- RedhairHambagu
RedhairHambagu
🔧 🐛 - 		- Allen
Allen
🔧 🐛 - 		- zdf1230
zdf
🔧 🐛 - 		- emengweb
emengweb
🔧 🐛 - 		- kitety
kitety
🔧 🐛 - 		- Jiaxin Peng
Jiaxin Peng
🔧 🐛 -
+[![Contributors](https://contrib.rocks/image?repo=tangly1024/NotionNext)](https://github.com/tangly1024/NotionNext/graphs/contributors) ## 引用技术 diff --git a/README_EN.md b/README_EN.md index 488565ac..0e56f9a8 100644 --- a/README_EN.md +++ b/README_EN.md @@ -53,123 +53,9 @@ Special thanks to Craig Hart for initiating the Nobelium project. ## Contributors - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
- tangly1024
tangly1024
🎫 🔧 🐛 - 		- uWayLu
uWayLu
🔧 🐛 - 		- txs
txs
🔧 🐛 - 		- yuzhanglong
yuzhanglong
🔧 🐛 - 		- Hscpro
Hscpro
🔧 🐛 - 		- JensonMiao
JensonMiao
🔧 🐛 - 		- haixin1225
haixin1225
🔧 🐛 - 		- mouyase
mouyase
🔧 🐛 - 		- qfdk
qfdk
🔧 🐛 - 		- ifyz
ifyz
🔧 🐛 - 		- Liqun Zhao
Liqun Zhao
🔧 🐛 - 		- Ylarod
Ylarod
🔧 🐛 - 		- Etherrreal.
Etherrreal.
🔧 🐛 - 		- Joshua Astray
Joshua Astray
🔧 🐛 - 		- Vixcity
Vixcity
🔧 🐛 - 		- ipatpat
ipatpat
🔧 🐛 - 		- xloong
xloong
🔧 🐛 - 		- expoli
expoli
🔧 🐛 - 		- SuperHuangXu
bUBBLE
🔧 🐛 - 		- Pylogmon
派了个萌
🔧 🐛 - 		- SkysCrystal
Simon Shi
🔧 🐛 - 		- S.Y. Lee
S.Y. Lee
🔧 🐛 - 		- fighting-buf
fighting-buf
🔧 🐛 - 		- cliouo
cliouo
🔧 🐛 - 		- Sude Akgün
Sude Akgün
🔧 🐛 - 		- Ray
Ray
🔧 🐛 - 		- Hongzzz
Hongzzz
🔧 🐛 - 		- RedhairHambagu
RedhairHambagu
🔧 🐛 -
+This project exists thanks to all the people who contribute. +[![Contributors](https://contrib.rocks/image?repo=tangly1024/NotionNext)](https://github.com/tangly1024/NotionNext/graphs/contributors) ## Technologies Used diff --git a/components/DebugPanel.js b/components/DebugPanel.js index 845da502..a0264eb1 100644 --- a/components/DebugPanel.js +++ b/components/DebugPanel.js @@ -1,10 +1,10 @@ -import { useEffect, useState } from 'react' -import Select from './Select' +import { siteConfigMap } from '@/lib/config' import { useGlobal } from '@/lib/global' +import { getQueryParam } from '@/lib/utils' import { THEMES } from '@/themes/theme' import { useRouter } from 'next/router' -import { siteConfigMap } from '@/lib/config' -import { getQueryParam } from '@/lib/utils' +import { useEffect, useState } from 'react' +import Select from './Select' /** * @@ -50,79 +50,83 @@ const DebugPanel = () => { } return ( - <> - {/* 调试按钮 */} -
-
- {show - ?  {locale.COMMON.DEBUG_CLOSE} - :  {locale.COMMON.DEBUG_OPEN}} -
-
+ <> + {/* 调试按钮 */} +
+
+ {show ? ( +  {locale.COMMON.DEBUG_CLOSE} + ) : ( +  {locale.COMMON.DEBUG_OPEN} + )} +
+
- {/* 调试侧拉抽屉 */} + {/* 调试侧拉抽屉 */} +
+
+
+ -
- -
-
- -
- -
-
- -
- {/*
-
- 主题配置{`config_${debugTheme}.js`}: -
-
- {Object.keys(themeConfig).map(k => ( -
- - {k} - - - {filterResult(themeConfig[k] + '')} - -
- ))} -
-
*/} -
- 站点配置[blog.config.js] -
-
- {siteConfig && Object.keys(siteConfig).map(k => ( -
- - {k} - - - {filterResult(siteConfig[k] + '')} - -
- ))} -
-
- + className='p-2 cursor-pointer' + onClick={handleChangeDebugTheme}> +
- + + +
+ +
+ + +
+ {/* +
+
+ 主题配置{`config_${debugTheme}.js`}: +
+
+ {Object.keys(themeConfig).map(k => ( +
+ + {k} + + + {filterResult(themeConfig[k] + '')} + +
+ ))} +
+
+ */} +
+ 站点配置[blog.config.js] +
+
+ {siteConfig && + Object.keys(siteConfig).map(k => ( +
+ + {k} + + + {filterResult(siteConfig[k] + '')} + +
+ ))} +
+
+ + ) } export default DebugPanel diff --git a/components/ExternalPlugins.js b/components/ExternalPlugins.js index c2bf54d5..ca058428 100644 --- a/components/ExternalPlugins.js +++ b/components/ExternalPlugins.js @@ -10,6 +10,7 @@ import { initGoogleAdsense } from './GoogleAdsense' import Head from 'next/head' import ExternalScript from './ExternalScript' import WebWhiz from './Webwhiz' +import IconFont from './IconFont' /** * 各种插件脚本 @@ -124,6 +125,8 @@ const ExternalPlugin = props => { NOTION_CONFIG ) + const ENABLE_ICON_FONT = siteConfig('ENABLE_ICON_FONT', false) + // 自定义样式css和js引入 if (isBrowser) { // 初始化AOS动画 @@ -165,7 +168,7 @@ const ExternalPlugin = props => { } setTimeout(() => { - // 映射url + // 将notion-id格式的url转成自定义slug convertInnerUrl(props?.allNavPages) }, 500) }, [router]) @@ -184,6 +187,7 @@ const ExternalPlugin = props => { <> {/* 全局样式嵌入 */} + {ENABLE_ICON_FONT && } {MOUSE_FOLLOW && } {THEME_SWITCH && } {DEBUG && } diff --git a/components/IconFont.js b/components/IconFont.js new file mode 100644 index 00000000..ddf15d48 --- /dev/null +++ b/components/IconFont.js @@ -0,0 +1,54 @@ +import { siteConfig } from '@/lib/config' +import { loadExternalResource } from '@/lib/utils' +import { useRouter } from 'next/router' +import { useEffect } from 'react' + +/** + * iconfont + */ +export default function IconFont() { + const router = useRouter() + + useEffect(() => { + loadExternalResource('/webfonts/iconfont.js').then(u => { + console.log('iconfont loaded') + + // 查找所有 标签且 class 包含 'icon-' + const iElements = document.querySelectorAll('i[class*="icon-"]'); + iElements.forEach(element => { + const className = Array.from(element.classList).find(cls => cls.startsWith('icon-')); + if (className) { + // 创建新的 元素 + const svgElement = document.createElementNS('http://www.w3.org/2000/svg', 'svg'); + svgElement.setAttribute('class', 'icon'); + svgElement.setAttribute('aria-hidden', 'true'); + + const useElement = document.createElementNS('http://www.w3.org/2000/svg', 'use'); + useElement.setAttributeNS('http://www.w3.org/1999/xlink', 'xlink:href', `#${className}`); + svgElement.appendChild(useElement); + + // 替换原来的 元素 + element.replaceWith(svgElement); + console.log(`Replaced with class "${className}" to `); + } + }); + }) + }, [router]) + + return +} diff --git a/components/NotionPage.js b/components/NotionPage.js index eace0637..1e5bd607 100644 --- a/components/NotionPage.js +++ b/components/NotionPage.js @@ -98,6 +98,22 @@ const NotionPage = ({ post, className }) => { }) }) } + + // 查找所有具有 'notion-collection-page-properties' 类的元素,删除notion自带的页面properties + const timer = setTimeout(() => { + // 查找所有具有 'notion-collection-page-properties' 类的元素 + const elements = document.querySelectorAll( + '.notion-collection-page-properties' + ) + + // 遍历这些元素并将其从 DOM 中移除 + elements?.forEach(element => { + element?.remove() + }) + }, 1000) // 1000 毫秒 = 1 秒 + + // 清理定时器，防止组件卸载时执行 + return () => clearTimeout(timer) }, [post]) return ( diff --git a/components/PrismMac.js b/components/PrismMac.js index 5d04fb22..7e81fc01 100644 --- a/components/PrismMac.js +++ b/components/PrismMac.js @@ -43,9 +43,15 @@ const PrismMac = () => { loadExternalResource('/css/prism-mac-style.css', 'css') } // 加载prism样式 - loadPrismThemeCSS(isDarkMode, prismThemeSwitch, prismThemeDarkPath, prismThemeLightPath, prismThemePrefixPath) + loadPrismThemeCSS( + isDarkMode, + prismThemeSwitch, + prismThemeDarkPath, + prismThemeLightPath, + prismThemePrefixPath + ) // 折叠代码 - loadExternalResource(prismjsAutoLoader, 'js').then((url) => { + loadExternalResource(prismjsAutoLoader, 'js').then(url => { if (window?.Prism?.plugins?.autoloader) { window.Prism.plugins.autoloader.languages_path = prismjsPath } @@ -62,7 +68,13 @@ const PrismMac = () => { /** * 加载Prism主题样式 */ -const loadPrismThemeCSS = (isDarkMode, prismThemeSwitch, prismThemeDarkPath, prismThemeLightPath, prismThemePrefixPath) => { +const loadPrismThemeCSS = ( + isDarkMode, + prismThemeSwitch, + prismThemeDarkPath, + prismThemeLightPath, + prismThemePrefixPath +) => { let PRISM_THEME let PRISM_PREVIOUS if (prismThemeSwitch) { @@ -73,8 +85,14 @@ const loadPrismThemeCSS = (isDarkMode, prismThemeSwitch, prismThemeDarkPath, pri PRISM_THEME = prismThemeLightPath PRISM_PREVIOUS = prismThemeDarkPath } - const previousTheme = document.querySelector(`link[href="${PRISM_PREVIOUS}"]`) - if (previousTheme && previousTheme.parentNode && previousTheme.parentNode.contains(previousTheme)) { + const previousTheme = document.querySelector( + `link[href="${PRISM_PREVIOUS}"]` + ) + if ( + previousTheme && + previousTheme.parentNode && + previousTheme.parentNode.contains(previousTheme) + ) { previousTheme.parentNode.removeChild(previousTheme) } loadExternalResource(PRISM_THEME, 'css') @@ -103,14 +121,17 @@ const renderCollapseCode = (codeCollapse, codeCollapseExpandDefault) => { const collapseWrapper = document.createElement('div') collapseWrapper.className = 'collapse-wrapper w-full py-2' const panelWrapper = document.createElement('div') - panelWrapper.className = 'border dark:border-gray-600 rounded-md hover:border-indigo-500 duration-200 transition-colors' + panelWrapper.className = + 'border dark:border-gray-600 rounded-md hover:border-indigo-500 duration-200 transition-colors' const header = document.createElement('div') - header.className = 'flex justify-between items-center px-4 py-2 cursor-pointer select-none' + header.className = + 'flex justify-between items-center px-4 py-2 cursor-pointer select-none' header.innerHTML = `

${language}

` const panel = document.createElement('div') - panel.className = 'invisible h-0 transition-transform duration-200 border-t border-gray-300' + panel.className = + 'invisible h-0 transition-transform duration-200 border-t border-gray-300' panelWrapper.appendChild(header) panelWrapper.appendChild(panel) @@ -145,7 +166,7 @@ const renderMermaid = async(mermaidCDN) => { if (m.target.className === 'notion-code language-mermaid') { const chart = m.target.querySelector('code').textContent if (chart && !m.target.querySelector('.mermaid')) { - const mermaidChart = document.createElement('div') + const mermaidChart = document.createElement('pre') mermaidChart.className = 'mermaid' mermaidChart.innerHTML = chart m.target.appendChild(mermaidChart) @@ -172,7 +193,10 @@ const renderMermaid = async(mermaidCDN) => { } }) if (document.querySelector('#notion-article')) { - observer.observe(document.querySelector('#notion-article'), { attributes: true, subtree: true }) + observer.observe(document.querySelector('#notion-article'), { + attributes: true, + subtree: true + }) } } @@ -234,7 +258,10 @@ const fixCodeLineStyle = () => { } } }) - observer.observe(document.querySelector('#notion-article'), { attributes: true, subtree: true }) + observer.observe(document.querySelector('#notion-article'), { + attributes: true, + subtree: true + }) setTimeout(() => { const preCodes = document.querySelectorAll('pre.notion-code') for (const preCode of preCodes) { diff --git a/components/SEO.js b/components/SEO.js index cd7d78c6..7f0cc0c2 100644 --- a/components/SEO.js +++ b/components/SEO.js @@ -247,7 +247,7 @@ const getSEOMeta = (props, router, locale) => { } case '/404': return { - title: `${siteInfo?.title} | 页面找不到啦`, + title: `${siteInfo?.title} | ${locale.NAV.PAGE_NOT_FOUND}`, image: `${siteInfo?.pageCover}` } case '/tag': diff --git a/components/ShareButtons.js b/components/ShareButtons.js index 29fd37b4..47c32d82 100644 --- a/components/ShareButtons.js +++ b/components/ShareButtons.js @@ -37,6 +37,8 @@ import { TumblrShareButton, TwitterIcon, TwitterShareButton, + ThreadsIcon, + ThreadsShareButton, ViberIcon, ViberShareButton, VKIcon, @@ -312,6 +314,16 @@ const ShareButtons = ({ post }) => { ) + case 'threads': + return ( + + + + ) case 'qq': return (