Responsive layour

src/components/calender/index.tsx

@@ -70,7 +70,7 @@ const Calender = ({
       <CalenderNav title={title} isLoading={isLoading} />
       <VStack h="100%" w="100%" spacing={0}>
         <HStack
-          px={6}
+          px={{ base: 1, sm: 2, md: 6 }}
           spacing={0}
           w="100%"
           h="auto"
@@ -106,7 +106,7 @@ const Calender = ({
             );
           })}
         </HStack>
-        <SimpleGrid px={6} w="100%" h="100%" columns={7} alignItems="center">
+        <SimpleGrid px={{ base: 1, sm: 2, md: 6 }} w="100%" h="100%" columns={7} alignItems="center">
           {Object.keys(month).map((week) => {
             const thisWeek = month[week];