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

feature: 样式调整，加入Tabs组件

Browse Source
This commit is contained in:
tangly1024
2022-01-01 22:22:52 +08:00
parent f6168e8dc1
commit 8e8b6c1f73
18 changed files with 167 additions and 80 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
components/Progress.js
View File

@@ -5,7 +5,7 @@ import React, { useEffect, useState } from 'react'
* @returns {JSX.Element}
* @constructor
*/
const Progress = ({ targetRef }) => {
const Progress = ({ targetRef, showPercent = true }) => {
const [percent, changePercent] = useState(0)
const scrollListener = () => {
if (targetRef?.current) {
@@ -24,9 +24,10 @@ const Progress = ({ targetRef }) => {
}, [percent])
return (<div className='h-4 w-full shadow-2xl bg-gray-400'>
<div className='h-4 bg-gray-600 duration-200' style={{ width: `${percent}%` }}><div className='text-right text-white text-xs'>{percent}%</div></div>
</div>)
<div className='h-4 bg-gray-600 duration-200' style={{ width: `${percent}%` }}>
{showPercent && <div className='text-right text-white text-xs'>{percent}%</div>}
</div>
</div>)
}
export default Progress