working subnet mobile👷‍♂️

src/pages/SubnetIdOverview.jsx

@@ -31,7 +31,7 @@ const SubnetInner = () => {
         });
       })
       .catch((err) => {
-        console.error("Failed to copy text: ", err);
+        console.error("Failed to copy text: ", err); 
       });
   }
 
@@ -40,11 +40,11 @@ const SubnetInner = () => {
       <Container
         maxW="6xl"
         color="white"
-        display={"flex"}
+        display={{base :"block",md : "flex"}}
         justifyContent={"space-between"}
         mb={10}
       >
-        <Heading fontSize={"md"} fontWeight={400} color={colorMode === "light" ? "#000" : "#fff"}>
+        <Heading fontSize={"md"} fontWeight={400} color={colorMode === "light" ? "#000" : "#fff"} mb={{base :"10px" ,md : "0px"}}>
         Subnet ID  - {params?.id}
         </Heading>
         <Text to="" style={{ fontSize: "14px" }} color={colorMode === "light" ? "#000" : "#fff"} display={"flex"} gap={"3"}>
@@ -59,7 +59,7 @@ const SubnetInner = () => {
       <Box>
         <Container maxW="6xl">
           <Grid
-            templateColumns="10% 90%"
+            templateColumns={{ base: "100% 0%", md: "90% 10%" }}
             gap={0}
             bg={colorMode === "light" ? "#230A79" : "#232127"}
             // bg={"#232127"}
@@ -89,13 +89,13 @@ const SubnetInner = () => {
                 templateColumns="10% 90%"
                 gap={0}
                 >
-                <GridItem p={4} color={colorMode === "light" ? "#000" : "#fff"}>
+                <GridItem  display={{ base: "none", md: "grid" }} p={4} color={colorMode === "light" ? "#000" : "#fff"}>
                     {index + 1}.
                 </GridItem>
                 <GridItem p={4}>
                     <Box>
                     <Text
-                        fontSize={"sm"}
+                        fontSize={{base:"xs", md:"sm" }}
                         mb={2}
                         color={colorMode === "light" ? "#230A79" : "#B09AFF"}
                     >