src/components/calender/Day.tsx

@@ -113,9 +113,15 @@ const Day = ({
       alignContent="center"
       justifyContent="flex-start"
     >
-      <Text w="auto" h="auto">
+      <Box
+        w="1.8rem"
+        h="1.8rem"
+        textAlign="center"
+        p={0}
+        m={0}
+      >
         {`${getDate(currDateObj)}`}
-      </Text>
+      </Box>
       {isLoading ? (
         <Skeleton key={currSticker}>
           <Box fontSize="1.5rem">
@@ -178,21 +184,33 @@ const Day = ({
         border: "1px solid #FFF"
       }}
     >
-      <Text
+      {isToday ?
-        h="auto"
+        (
-        w="auto"
+          <Box
-        p={
+            border="1px solid #0068ff"
-          isToday
+            borderRadius="50%"
-            ? getDate(currDateObj) > 10
+            w="1.8rem"
-              ? "0px 6px 3px 6px"
+            h="1.8rem"
-              : "0px 9px 3px 9px"
+            textAlign="center"
-            : "auto"
+            p={0}
-        }
+            m={0}
-        border={isToday ? "1px solid #0068ff" : "0px"}
-        borderRadius={isToday ? "100px" : "0px"}
           >
             {`${getDate(currDateObj)}`}
-      </Text>
+          </Box>
+        )
+        :
+        (
+          <Box
+            w="1.8rem"
+            h="1.8rem"
+            textAlign="center"
+            p={0}
+            m={0}
+          >
+            {`${getDate(currDateObj)}`}
+          </Box>
+        )
+      }
       {isLoading ? (
         <Skeleton key={currSticker}>
           <Box fontSize="1.5rem">