d0zingcat/NotionNext
1
0
Fork 0
mirror of https://github.com/d0zingcat/NotionNext.git synced 2026-05-20 23:16:49 +00:00
Code Issues Packages Projects Releases Wiki Activity

gitbook-jump-to-top

Browse Source
This commit is contained in:
tangly1024
2023-06-28 23:19:21 +08:00
parent 7df33cb62a
commit ed7b235edf
15 changed files with 74 additions and 74 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
themes/medium/LayoutBase.js
View File

@@ -13,6 +13,7 @@ import { useRouter } from 'next/router'
import Live2D from '@/components/Live2D'
import BLOG from '@/blog.config'
import Announcement from './components/Announcement'
import JumpToTopButton from './components/JumpToTopButton'
const ThemeGlobalMedium = createContext()
/**
@@ -53,15 +54,7 @@ const LayoutBase = props => {
{onLoading ? LoadingCover : children}
{/* 回顶按钮 */}
<div
data-aos="fade-up"
data-aos-duration="300"
data-aos-once="false"
data-aos-anchor-placement="top-center"
className='fixed xl:right-80 right-2 mr-10 bottom-24 hidden lg:block z-20'>
<i className='fas fa-chevron-up cursor-pointer p-2 rounded-full border' onClick={() => { window.scrollTo({ top: 0, behavior: 'smooth' }) }} />
</div>
<JumpToTopButton />
</div>
{/* 底部 */}
@@ -79,7 +72,7 @@ const LayoutBase = props => {
{CONFIG_MEDIUM.WIDGET_REVOLVER_MAPS === 'true' && <RevolverMaps />}
</div>
</Tabs>
<Announcement post={notice}/>
<Announcement post={notice} />
<Live2D />
</div>
</div>
@@ -93,4 +86,4 @@ const LayoutBase = props => {
}
export default LayoutBase
export const useMediumGlobal = () => useContext(ThemeGlobalMedium)
export const useGitBookGlobal = () => useContext(ThemeGlobalMedium)

4
themes/medium/components/BottomMenuBar.js
View File

@@ -1,10 +1,10 @@
import Link from 'next/link'
import React from 'react'
import { useMediumGlobal } from '../LayoutBase'
import { useGitBookGlobal } from '../LayoutBase'
import JumpToTopButton from './JumpToTopButton'
export default function BottomMenuBar ({ post, className }) {
const { tocVisible, changeTocVisible } = useMediumGlobal()
const { tocVisible, changeTocVisible } = useGitBookGlobal()
const showTocBotton = post?.toc?.length > 0
const toggleToc = () => {

20
themes/medium/components/JumpToTopButton.js
View File

@@ -1,5 +1,3 @@
import { useGlobal } from '@/lib/global'
import React from 'react'
import CONFIG_MEDIUM from '../config_medium'
/**
@@ -11,16 +9,20 @@ import CONFIG_MEDIUM from '../config_medium'
* @constructor
*/
const JumpToTopButton = ({ showPercent = false, percent, className }) => {
const { locale } = useGlobal()
if (!CONFIG_MEDIUM.WIDGET_TO_TOP) {
return <></>
}
return (<div className={'flex space-x-1 items-center cursor-pointer w-full justify-center ' + className } onClick={() => window.scrollTo({ top: 0, behavior: 'smooth' })} >
<div title={locale.POST.TOP} >
<i className='fas fa-arrow-up'/>
</div>
{showPercent && (<div className='text-xs dark:text-gray-200 block lg:hidden'>{percent}%</div>)}
</div>)
return (
<div
id="jump-to-top"
data-aos="fade-up"
data-aos-duration="300"
data-aos-once="false"
data-aos-anchor-placement="top-center"
className='fixed xl:right-80 right-2 mr-10 bottom-24 z-20'>
<i className='fas fa-chevron-up cursor-pointer p-2 rounded-full border bg-white dark:bg-hexo-black-gray' onClick={() => { window.scrollTo({ top: 0, behavior: 'smooth' }) }} />
</div>
)
}
export default JumpToTopButton

4
themes/medium/components/TocDrawer.js
View File

@@ -1,5 +1,5 @@
import Catalog from './Catalog'
import { useMediumGlobal } from '../LayoutBase'
import { useGitBookGlobal } from '../LayoutBase'
/**
* 悬浮抽屉目录
@@ -9,7 +9,7 @@ import { useMediumGlobal } from '../LayoutBase'
* @constructor
*/
const TocDrawer = ({ post, cRef }) => {
const { tocVisible, changeTocVisible } = useMediumGlobal()
const { tocVisible, changeTocVisible } = useGitBookGlobal()
const switchVisible = () => {
changeTocVisible(!tocVisible)
}