3022ae9a6a
* style: fund account font size adjustments * client instance. contract addresses updates. prices hook added * persist lend assets value for every credit account * feat: account stats and semi circular progress * minor code cleanup * display borrowed assets interest rate * fallback screen when no wallet is connected * fix: hydration mismatch * update osmosis testnet endpoints * style: body text color * coin interface imported from cosmos package * risk calculation from ltv assets comment added * svgr setup. inline svg extracted to Icons folder * address removed from local storage. wallet store improvements * rename setAddress action to connect * yield page renamed to earn * refactor: accountStats using BigNumber * update contract addresses * update hardcoded fee * update market mocked values * current leverage added to useAccountStats hook return * leverage naming disambiguation * debt positions labels color update. negative sign before values * remove prefers-color-scheme media query * update redbank mock data
24 lines
573 B
TypeScript
24 lines
573 B
TypeScript
import React from 'react'
|
|
|
|
type Props = {
|
|
value: number
|
|
}
|
|
|
|
const ProgressBar = ({ value }: Props) => {
|
|
const percentageValue = `${(value * 100).toFixed(0)}%`
|
|
|
|
return (
|
|
<div className="relative z-0 h-4 w-[130px] rounded-full bg-black">
|
|
<div
|
|
className="absolute z-10 h-4 rounded-full bg-green-500"
|
|
style={{ width: percentageValue }}
|
|
/>
|
|
<div className="absolute z-20 flex w-full items-center justify-center gap-x-2 text-xs font-medium text-white">
|
|
{percentageValue}
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default ProgressBar
|