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

feature:新增跳转底部悬浮按钮

Browse Source
This commit is contained in:
tangly1024
2021-12-21 17:29:34 +08:00
parent 351c3b2f6e
commit 2840e63388
3 changed files with 56 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
components/FloatDarkModeButton.js
View File

@@ -7,7 +7,6 @@ export default function FloatDarkModeButton () {
const [show, switchShow] = useState(false)
const scrollListener = () => {
const scrollY = window.pageYOffset
// const shouldShow = scrollY > 100 && scrollY < windowTop
const shouldShow = scrollY > 100
if (shouldShow !== show) {
switchShow(shouldShow)
@@ -34,8 +33,8 @@ export default function FloatDarkModeButton () {
<div
onClick={handleChangeDarkMode}
className={
(show ? 'animate__fadeInRight ' : 'hidden lg:block') +
' px-3.5 py-3 animate__animated animate__faster shadow-card fixed right-3 bottom-36 z-10 duration-200 text-xs cursor-pointer rounded-xl' +
(show ? '' : 'hidden lg:block') +
' animate__fadeInRight px-3.5 py-3 animate__animated animate__faster shadow-card fixed right-3 bottom-24 z-10 duration-200 text-xs cursor-pointer rounded-xl' +
' text-black shadow-card dark:border-gray-500 glassmorphism dark:bg-gray-700 dark:text-gray-200'
}
>