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-01 17:24:46 +08:00
parent fd4b3b01ca
commit 78e6595648
2 changed files with 14 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
components/RewardButton.js
View File

@@ -6,13 +6,15 @@ import React from 'react'
* @constructor
*/
const RewardButton = () => {
const [popoverShow, setPopoverShow] = React.useState(false)
const openPopover = () => {
setPopoverShow(true)
if (window) {
document.getElementById('reward-qrcode').classList.remove('hidden')
}
}
const closePopover = () => {
setPopoverShow(false)
if (window) {
document.getElementById('reward-qrcode').classList.add('hidden')
}
}
return (
<div onMouseEnter={openPopover} onMouseLeave={closePopover} className='justify-center py-10'>
@@ -21,16 +23,9 @@ const RewardButton = () => {
<span>打赏一杯咖啡</span>
</div>
<div className={ `${(popoverShow ? ' block ' : ' hidden ')} transform block z-50 font-normal`}>
<div
className='flex space-x-10 animate__animated animate__fadeIn duration-200 my-5 px-5 py-6 justify-center bg-white dark:bg-black dark:text-gray-200'>
<div>
<img className='md:w-72 m-auto' src='/reward_code_alipay.png' />
</div>
<div>
<img className='md:w-72 m-auto' src='/reward_code_wechat.png' />
</div>
</div>
<div id='reward-qrcode' className='hidden flex space-x-10 animate__animated animate__fadeIn duration-200 my-5 px-5 mx-auto py-6 justify-center bg-white dark:bg-black dark:text-gray-200'>
<img className='md:w-72' src='/reward_code_alipay.png' />
<img className='md:w-72' src='/reward_code_wechat.png' />
</div>
</div>
)