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

夜间模式样式微调

Browse Source
This commit is contained in:
tangly1024
2021-11-05 17:47:27 +08:00
parent 6cbe623e97
commit ee51b8269c
4 changed files with 4 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
components/DarkModeButton.js
View File

@@ -9,7 +9,7 @@ const DarkModeButton = () => {
saveTheme(newTheme)
changeTheme(newTheme)
}
return <div className='z-10 p-1 duration-200 h-12 text-xl cursor-pointer dark:text-gray-300 '>
return <div className='z-10 duration-200 text-xl cursor-pointer'>
<i id='darkModeButton' className={'fa p-2.5 hover:scale-125 transform duration-200 ' + (userTheme === 'dark' ? 'fa-sun-o' : 'fa-moon-o')}
onClick={handleChangeDarkMode} />
</div>

2
components/JumpToTopButton.js
View File

@@ -32,7 +32,7 @@ const JumpToTopButton = ({ targetRef, showPercent = true }) => {
}, [show])
return (
<div id='jump-to-top' className='right-0 fixed flex bottom-24 mr-4 duration-500 z-20'>
<div id='jump-to-top' className='right-0 fixed flex bottom-36 mr-4 duration-500 z-20'>
<div >
<div
onClick={() => window.scrollTo({ top: 0, behavior: 'smooth' })}

2
components/TocDrawerButton.js
View File

@@ -10,7 +10,7 @@ import React from 'react'
*/
const TocDrawerButton = (props) => {
return (
<div id='jump-to-top' className='right-0 fixed flex bottom-40 mr-4 duration-500 z-30' onClick={props.onClick}>
<div id='jump-to-top' className='right-0 fixed flex bottom-52 mr-4 duration-500 z-30' onClick={props.onClick}>
<div className='transform hover:scale-105 duration-200 '>
<div style={{ boxShadow: 'rgba(41, 50, 60, 0.5) 0px 2px 16px', borderRadius: '28px' }}
className={'animate__fadeInUp bg-gray-700 px-1 py-1 cursor-pointer animate__animated animate__faster shadow-2xl'}>

2
layouts/BaseLayout.js
View File

@@ -81,7 +81,7 @@ const BaseLayout = ({
{children}
</div>
<JumpToTopButton targetRef={targetRef} showPercent={true} />
<div className='fixed right-2 top-2 p-0.5 shadow-2xl bg-white border dark:border-gray-500 dark:bg-gray-700 rounded-full'>
<div className='fixed right-4 top-4 p-1 bg-gray-700 dark:border-gray-500 dark:bg-gray-700 rounded-full text-white' style={{ boxShadow: 'rgba(41, 50, 60, 0.5) 0px 2px 16px', borderRadius: '28px' }}>
<DarkModeButton/>
</div>
</main>