diff --git a/src/mainsite/components/TwoYearProjection/index.tsx b/src/mainsite/components/TwoYearProjection/index.tsx index e4b63207..eb453e17 100644 --- a/src/mainsite/components/TwoYearProjection/index.tsx +++ b/src/mainsite/components/TwoYearProjection/index.tsx @@ -75,13 +75,22 @@ const TwoYearProjection: FC = () => { const currentStakedEthPercent = currentStakedEth !== undefined - ? ((currentStakedEth - MIN_PROJECTED_ETH_STAKING) / MAX_PROJECTED_ETH_STAKING) * 100 + ? ((currentStakedEth - MIN_PROJECTED_ETH_STAKING) / + MAX_PROJECTED_ETH_STAKING) * + 100 : undefined; const [currentBaseFee, setCurrentBaseFee] = useState( undefined, ); + const currentBaseFeePercent = + currentBaseFee !== undefined + ? ((currentBaseFee - MIN_PROJECTED_BASE_GAS_PRICE) / + MAX_PROJECTED_BASE_GAS_PRICE) * + 100 + : undefined; + useEffect(() => { if ( isInitialized || @@ -168,7 +177,11 @@ const TwoYearProjection: FC = () => { relative top-[14px] flex -translate-x-1/2 select-none flex-col items-center - ${currentStakedEthPercent === undefined ? "invisible" : "visible"} + ${ + currentStakedEthPercent === undefined + ? "invisible" + : "visible" + } `} style={{ // Positions the marker along the track whilst compensating for the thumb width as the browser natively does. 7 being half the thumb width. @@ -199,13 +212,38 @@ const TwoYearProjection: FC = () => { } > - +
+ +
+
+ + now + +
+