fix chart timeframe active class

This commit is contained in:
tjs 2022-08-09 10:06:36 -07:00
parent 2514c4a223
commit a3a4275462
1 changed files with 8 additions and 6 deletions

View File

@ -163,6 +163,8 @@ const SwapTokenChart: FunctionComponent<SwapTokenChartProps> = ({
return 0 return 0
} }
console.log(daysToShow)
return ( return (
<ContentBox hideBorder hidePadding> <ContentBox hideBorder hidePadding>
{loadChartData ? ( {loadChartData ? (
@ -250,24 +252,24 @@ const SwapTokenChart: FunctionComponent<SwapTokenChartProps> = ({
<div className="-mt-1 h-28 w-1/2 md:h-72 md:w-auto"> <div className="-mt-1 h-28 w-1/2 md:h-72 md:w-auto">
<div className="-mb-2 flex justify-end md:absolute md:-top-1 md:right-0"> <div className="-mb-2 flex justify-end md:absolute md:-top-1 md:right-0">
<button <button
className={`rounded-md px-3 py-2 font-bold text-th-fgd-4 focus:outline-none md:hover:text-th-primary ${ className={`rounded-md px-3 py-2 font-bold focus:outline-none md:hover:text-th-primary ${
daysToShow === 1 && 'text-th-primary' daysToShow === 1 ? 'text-th-primary' : 'text-th-fgd-4'
}`} }`}
onClick={() => setDaysToShow(1)} onClick={() => setDaysToShow(1)}
> >
24H 24H
</button> </button>
<button <button
className={`rounded-md px-3 py-2 font-bold text-th-fgd-4 focus:outline-none md:hover:text-th-primary ${ className={`rounded-md px-3 py-2 font-bold focus:outline-none md:hover:text-th-primary ${
daysToShow === 7 && 'text-th-primary' daysToShow === 7 ? 'text-th-primary' : 'text-th-fgd-4'
}`} }`}
onClick={() => setDaysToShow(7)} onClick={() => setDaysToShow(7)}
> >
7D 7D
</button> </button>
<button <button
className={`rounded-md px-3 py-2 font-bold text-th-fgd-4 focus:outline-none md:hover:text-th-primary ${ className={`rounded-md px-3 py-2 font-bold focus:outline-none md:hover:text-th-primary ${
daysToShow === 30 && 'text-th-primary' daysToShow === 30 ? 'text-th-primary' : 'text-th-fgd-4'
}`} }`}
onClick={() => setDaysToShow(30)} onClick={() => setDaysToShow(30)}
> >