From 3ae63a94b85c63258c4f5347446359eb914cdc38 Mon Sep 17 00:00:00 2001
From: zuies <zurabichkhikvadze66@gmail.com>
Date: Tue, 5 Dec 2023 17:21:39 +0300
Subject: [PATCH] fix style issue on TcPeriodRange

---
 .../communitySettings/platform/TcPeriodRange.tsx | 16 ++++++++++------
 1 file changed, 10 insertions(+), 6 deletions(-)

diff --git a/src/components/communitySettings/platform/TcPeriodRange.tsx b/src/components/communitySettings/platform/TcPeriodRange.tsx
index bc02dd82..b47bccd0 100644
--- a/src/components/communitySettings/platform/TcPeriodRange.tsx
+++ b/src/components/communitySettings/platform/TcPeriodRange.tsx
@@ -1,6 +1,7 @@
 import React, { useEffect, useState } from 'react';
 import TcButtonGroup from '../../shared/TcButtonGroup';
 import TcButton from '../../shared/TcButton';
+import clsx from 'clsx';
 
 type PeriodValue = 'Last 35 days' | '1M' | '3M' | '6M' | '1Y';
 
@@ -88,17 +89,20 @@ function TcPeriodRange({ handleSelectedDate, activePeriod }: ITcPeriodRange) {
   };
 
   return (
-    <TcButtonGroup>
+    <TcButtonGroup disableElevation>
       {periods.map((el) => (
         <TcButton
           key={el}
           disableElevation={true}
           text={el}
-          className={
-            el === selected ? 'bg-black text-white' : 'bg-[#EEEEEE] text-black'
-          }
-          variant="contained"
-          sx={{ width: 'auto', padding: '0.4rem 1rem' }}
+          className={clsx(
+            el === selected ? 'bg-black text-white' : 'bg-[#EEEEEE] text-black',
+            'border-0'
+          )}
+          sx={{
+            width: 'auto',
+            padding: '0.4rem 1rem',
+          }}
           onClick={() => handleButtonClick(el)}
         />
       ))}