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

float按钮统一

Browse Source
This commit is contained in:
tangly1024
2022-01-11 15:58:57 +08:00
parent 9747097f71
commit 8d1abcdf5b
10 changed files with 199 additions and 232 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
components/TocDrawerButton.js
View File

@@ -16,30 +16,11 @@ const TocDrawerButton = (props) => {
return <></>
}
const { locale } = useGlobal()
const [show, switchShow] = useState(false)
const scrollListener = () => {
const scrollY = window.pageYOffset
const shouldShow = scrollY > 100
if (shouldShow !== show) {
switchShow(shouldShow)
}
}
useEffect(() => {
document.addEventListener('scroll', scrollListener)
return () => document.removeEventListener('scroll', scrollListener)
})
return (
<div id='toc-drawer-button' className='right-1 fixed bottom-52 z-20'>
<div onClick={props.onClick} className={(show ? 'animate__fadeInRight' : 'hidden') + ' animate__animated animate__faster glassmorphism cursor-pointer' }>
<div className='dark:text-gray-200 text-center transform hover:scale-150 duration-200 text-xs flex justify-center items-center w-8 h-8' title={locale.POST.TOP} >
<FontAwesomeIcon icon={faListOl}/>
</div>
</div>
</div>
)
return (<div onClick={props.onClick} className={'cursor-pointer'}>
<div className='dark:text-gray-200 text-center transform hover:scale-150 duration-200 text-xs flex justify-center items-center' title={locale.POST.TOP} >
<FontAwesomeIcon icon={faListOl}/>
</div>
</div>)
}
export default TocDrawerButton