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

feature:

Browse Source 
引入react-fontawesome，升级至v5.15;
next/link补齐passHref;
替换img为next/Image,优化图片
This commit is contained in:
tangly1024
2021-12-03 15:01:11 +08:00
parent 88d1e0742a
commit 49ab1eb124
32 changed files with 243 additions and 202 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
components/RewardButton.js
View File

@@ -1,4 +1,7 @@
import React from 'react'
import Image from 'next/image'
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
import { faQrcode } from '@fortawesome/free-solid-svg-icons'
/**
* 赞赏按钮
@@ -19,13 +22,13 @@ const RewardButton = () => {
return (
<div onMouseEnter={openPopover} onMouseLeave={closePopover} className='justify-center py-10'>
<div className='bg-red-500 w-36 mx-auto animate__jello text-white hover:bg-green-400 duration-200 transform hover:scale-110 px-3 py-2 rounded cursor-pointer'>
<span className='fa fa-qrcode mr-2' />
<FontAwesomeIcon icon={faQrcode} className='mr-2' />
<span>打赏一杯咖啡</span>
</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'>
<div><img className='md:w-72' src='/reward_code_alipay.png' /></div>
<div><img className='md:w-72' src='/reward_code_wechat.png' /></div>
<div className='w-72 bg-black'><Image width='auto' height='auto' layout='responsive' objectFit='fill' src='/reward_code_alipay.png' /></div>
<div className='w-72 bg-black'><Image width='auto' height='auto' layout='responsive' objectFit='fill' src='/reward_code_wechat.png' /></div>
</div>
</div>
)