d0zingcat/NotionNext
1
0
Fork 0
mirror of https://github.com/d0zingcat/NotionNext.git synced 2026-06-08 15:10:37 +00:00
Code Issues Packages Projects Releases Wiki Activity

登录结合OpenWrite

Browse Source
This commit is contained in:
tangly1024.com
2024-09-24 18:19:48 +08:00
parent 32a113fbce
commit 964513b1e9
18 changed files with 244 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
themes/gitbook/components/ArticleInfo.js
View File

@@ -10,7 +10,8 @@ export default function ArticleInfo({ post }) {
return (
<div className='pt-10 pb-6 text-gray-400 text-sm'>
<i className='fa-regular fa-clock mr-1' />
Last update: {post.date?.start_date}
Last update:{' '}
{post.date?.start_date || post?.publishDay || post?.lastEditedDay}
</div>
)
}

16
themes/gitbook/components/Header.js
View File

@@ -2,6 +2,7 @@ import Collapse from '@/components/Collapse'
import DarkModeButton from '@/components/DarkModeButton'
import { siteConfig } from '@/lib/config'
import { useGlobal } from '@/lib/global'
import { SignInButton, SignedOut, UserButton } from '@clerk/nextjs'
import { useRef, useState } from 'react'
import CONFIG from '../config'
import LogoBar from './LogoBar'
@@ -59,6 +60,8 @@ export default function Header(props) {
links = customMenu
}
const enableClerk = process.env.NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY
return (
<div id='top-nav' className={'fixed top-0 w-full z-20 ' + className}>
{/* PC端菜单 */}
@@ -79,6 +82,19 @@ export default function Header(props) {
{/* 右侧 */}
<div className='flex items-center gap-4'>
{/* 登录相关 */}
{enableClerk && (
<>
<SignedOut>
<SignInButton mode='modal'>
<button className='bg-green-500 hover:bg-green-600 text-white rounded-lg px-3 py-2'>
{locale.COMMON.SIGN_IN}
</button>
</SignInButton>
</SignedOut>
<UserButton />
</>
)}
<DarkModeButton className='text-sm items-center h-full hidden md:flex' />
<SearchInput className='hidden md:flex md:w-52 lg:w-72' />
{/* 折叠按钮、仅移动端显示 */}

57
themes/gitbook/index.js
View File

@@ -11,6 +11,7 @@ import { siteConfig } from '@/lib/config'
import { useGlobal } from '@/lib/global'
import { isBrowser } from '@/lib/utils'
import { getShortId } from '@/lib/utils/pageId'
import { SignIn, SignUp } from '@clerk/nextjs'
import dynamic from 'next/dynamic'
import Link from 'next/link'
import { useRouter } from 'next/router'
@@ -164,7 +165,7 @@ const LayoutBase = props => {
{/* 中间内容区域 */}
<div
id='center-wrapper'
className='dark:bg-hexo-black-gray flex flex-col justify-between w-full relative z-10 pt-14 min-h-screen'>
className='flex flex-col justify-between w-full relative z-10 pt-14 min-h-screen'>
<div
id='container-inner'
className={`w-full ${fullWidth ? 'px-5' : 'max-w-3xl px-3 lg:px-0'} justify-center mx-auto`}>
@@ -473,6 +474,58 @@ const LayoutTagIndex = props => {
)
}
/**
* 登录页面
* @param {*} props
* @returns
*/
const LayoutSignIn = props => {
const { post } = props
const enableClerk = process.env.NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY
return (
<>
<div className='grow mt-20'>
{/* clerk预置表单 */}
{enableClerk && (
<div className='flex justify-center py-6'>
<SignIn />
</div>
)}
<div id='article-wrapper'>
<NotionPage post={post} />
</div>
</div>
</>
)
}
/**
* 注册页面
* @param {*} props
* @returns
*/
const LayoutSignUp = props => {
const { post } = props
const enableClerk = process.env.NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY
return (
<>
<div className='grow mt-20'>
{/* clerk预置表单 */}
{enableClerk && (
<div className='flex justify-center py-6'>
<SignUp />
</div>
)}
<div id='article-wrapper'>
<NotionPage post={post} />
</div>
</div>
</>
)
}
export {
Layout404,
LayoutArchive,
@@ -481,6 +534,8 @@ export {
LayoutIndex,
LayoutPostList,
LayoutSearch,
LayoutSignIn,
LayoutSignUp,
LayoutSlug,
LayoutTagIndex,
CONFIG as THEME_CONFIG

3
themes/magzine/components/Catalog.js
View File

@@ -23,9 +23,6 @@ const Catalog = ({ post, toc, className }) => {
actionSectionScrollSpy()
window.addEventListener('scroll', actionSectionScrollSpy)
}
setTimeout(() => {
console.log('目录', post, toc)
}, 1000)
return () => {
window.removeEventListener('scroll', actionSectionScrollSpy)
}

21
themes/magzine/components/Header.js
View File

@@ -1,6 +1,7 @@
import Collapse from '@/components/Collapse'
import { siteConfig } from '@/lib/config'
import { useGlobal } from '@/lib/global'
import { SignInButton, SignedOut, UserButton } from '@clerk/nextjs'
import throttle from 'lodash.throttle'
import { useRouter } from 'next/router'
import { useEffect, useRef, useState } from 'react'
@@ -112,6 +113,8 @@ export default function Header(props) {
return null
}
const enableClerk = process.env.NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY
return (
<div
id='top-navbar-wrapper'
@@ -154,7 +157,7 @@ export default function Header(props) {
</>
)}
{/* 右侧移动端折叠按钮 */}
{/* 右侧按钮 */}
<div className='flex items-center gap-x-2 pr-2'>
{/* 搜索按钮 */}
<div
@@ -167,6 +170,8 @@ export default function Header(props) {
: 'fa-solid fa-magnifying-glass' + ' align-middle'
}></i>
</div>
{/* 移动端显示开关 */}
<div className='mr-1 flex md:hidden justify-end items-center text-lg space-x-4 font-serif dark:text-gray-200'>
<div onClick={toggleMenuOpen} className='cursor-pointer p-2'>
{isOpen ? (
@@ -176,6 +181,20 @@ export default function Header(props) {
)}
</div>
</div>
{/* 登录相关 */}
{enableClerk && (
<>
<SignedOut>
<SignInButton mode='modal'>
<button className='bg-gray-800 hover:bg-gray-900 text-white rounded-lg px-3 py-2'>
{locale.COMMON.SIGN_IN}
</button>
</SignInButton>
</SignedOut>
<UserButton />
</>
)}
</div>
</div>

55
themes/magzine/index.js
View File

@@ -9,6 +9,7 @@ import WWAds from '@/components/WWAds'
import { siteConfig } from '@/lib/config'
import { useGlobal } from '@/lib/global'
import { isBrowser } from '@/lib/utils'
import { SignIn, SignUp } from '@clerk/nextjs'
import Link from 'next/link'
import { useRouter } from 'next/router'
import { createContext, useContext, useEffect, useRef, useState } from 'react'
@@ -440,6 +441,58 @@ const LayoutTagIndex = props => {
)
}
/**
* 登录页面
* @param {*} props
* @returns
*/
const LayoutSignIn = props => {
const { post } = props
const enableClerk = process.env.NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY
return (
<>
<div className='grow mt-20'>
{/* clerk预置表单 */}
{enableClerk && (
<div className='flex justify-center py-6'>
<SignIn />
</div>
)}
<div id='article-wrapper'>
<NotionPage post={post} />
</div>
</div>
</>
)
}
/**
* 注册页面
* @param {*} props
* @returns
*/
const LayoutSignUp = props => {
const { post } = props
const enableClerk = process.env.NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY
return (
<>
<div className='grow mt-20'>
{/* clerk预置表单 */}
{enableClerk && (
<div className='flex justify-center py-6'>
<SignUp />
</div>
)}
<div id='article-wrapper'>
<NotionPage post={post} />
</div>
</div>
</>
)
}
export {
Layout404,
LayoutArchive,
@@ -448,6 +501,8 @@ export {
LayoutIndex,
LayoutPostList,
LayoutSearch,
LayoutSignIn,
LayoutSignUp,
LayoutSlug,
LayoutTagIndex,
CONFIG as THEME_CONFIG

28
themes/starter/components/Header.js
View File

@@ -68,7 +68,28 @@ export const Header = props => {
{/* 深色模式切换 */}
<DarkModeButton />
{/* 注册登录功能 */}
<SignedOut>
{enableClerk && (
<>
<SignedOut>
<div className='hidden sm:flex gap-4'>
<a
href={siteConfig('STARTER_NAV_BUTTON_1_URL')}
className={`loginBtn ${buttonTextColor} p-2 text-base font-medium hover:opacity-70`}>
{siteConfig('STARTER_NAV_BUTTON_1_TEXT')}
</a>
<a
href={siteConfig('STARTER_NAV_BUTTON_2_URL')}
className={`signUpBtn ${buttonTextColor} p-2 rounded-md bg-white bg-opacity-20 py-2 text-base font-medium duration-300 ease-in-out hover:bg-opacity-100 hover:text-dark`}>
{siteConfig('STARTER_NAV_BUTTON_2_TEXT')}
</a>
</div>
</SignedOut>
<SignedIn>
<UserButton />
</SignedIn>
</>
)}
{!enableClerk && (
<div className='hidden sm:flex gap-4'>
<a
href={siteConfig('STARTER_NAV_BUTTON_1_URL')}
@@ -81,10 +102,7 @@ export const Header = props => {
{siteConfig('STARTER_NAV_BUTTON_2_TEXT')}
</a>
</div>
</SignedOut>
<SignedIn>
<UserButton />
</SignedIn>
)}
</div>
</div>
</div>

6
themes/theme.js
View File

@@ -99,7 +99,11 @@ const checkThemeDOM = () => {
elements[elements.length - 1].scrollIntoView()
// 删除前面的元素，只保留最后一个元素
for (let i = 0; i < elements.length - 1; i++) {
if (elements[i] && elements[i].parentNode && elements[i].parentNode.contains(elements[i])) {
if (
elements[i] &&
elements[i].parentNode &&
elements[i].parentNode.contains(elements[i])
) {
elements[i].parentNode.removeChild(elements[i])
}
}