update responsive

src/pages/MainNetIdOverview.jsx

@@ -47,14 +47,14 @@ const MainNetOveriew = () => {
         <Heading fontSize={"md"} fontWeight={400} color={colorMode === "light" ? "#000" : "#fff"}  mb={{base :"10px" ,md : "0px"}}>
         Main net ID  - {params?.id}
         </Heading>
-        <Text to="" style={{ fontSize: "14px" }} color={colorMode === "light" ? "#000" : "#fff"} display={"flex"} gap={"3"}>
+        {/* <Text to="" style={{ fontSize: "14px" }} color={colorMode === "light" ? "#000" : "#fff"} display={"flex"} gap={"3"}>
           View total number of records
           <Select width={"70px"} rounded="md" size="xs">
             <option value='option1'>10</option>
             <option value='option2'>20</option>
             <option value='option3'>30</option>
           </Select>
-        </Text>
+        </Text> */}
       </Container>
       <Box>
         <Container maxW="6xl">

src/pages/SmartContract.jsx

@@ -178,7 +178,7 @@ import TransactionTable from "./Transaction/TransactionTable";
                   </HStack>
               </Box>
               <Box bg={colorMode === "light" ? "#F3F3F3" : "#1D1D1D"} p={4} mb={0} rounded={6}>
-                  <HStack fontSize={"sm"} gap={"8rem"} mb={5}>
+                  <HStack fontSize={"sm"} gap={{base:"3rem",md:"8rem"}} mb={5}>
                       <Box>
                           <Text>Pledge amount</Text>
                           <Text color={"#A1A1A1"}>$ 100</Text>

src/pages/Subnet.jsx

@@ -48,14 +48,14 @@ const Subnet = () => {
         <Heading fontSize={"md"} fontWeight={400} color={colorMode === "light" ? "#000" : "#fff"}  mb={{base :"10px" ,md : "0px"}}>
         Subnet ID  - Overview
         </Heading>
-        <Text to="" style={{ fontSize: "14px" }} color={colorMode === "light" ? "#000" : "#fff"} display={"flex"} gap={"3"}>
+        {/* <Text to="" style={{ fontSize: "14px" }} color={colorMode === "light" ? "#000" : "#fff"} display={"flex"} gap={"3"}>
           View total number of records
           <Select width={"70px"} rounded="md" size="xs">
             <option value='option1'>10</option>
             <option value='option2'>20</option>
             <option value='option3'>30</option>
           </Select>
-        </Text>
+        </Text> */}
       </Container>
       <Box>
         <Container maxW="6xl">

src/pages/SubnetIdOverview.jsx

@@ -287,6 +287,7 @@ const SubnetInner = () => {
                     color={colorMode === "light" ? "#230A79" : "#B09AFF"}
                     textDecoration={"underline"}
                     fontSize={{ base: "xs", md: "sm" }}
+                    isTruncated
                   >
                     <Text
                       cursor={"pointer"}
@@ -316,7 +317,7 @@ const SubnetInner = () => {
                 <HStack
                   flexDirection={{ base: "column", md: "row" }}
                   justifyContent={{ base: "", md: "flex-start" }}
-                  gap={44}
+                  gap={{base:4,md:44}}
                   alignItems={{ base: "flex-start", md: "" }}
                   // flexWrap={'wrap'}
 

src/pages/SubnetIdold.jsx

@@ -108,7 +108,7 @@ const SubnetId = () => {
         >
           Subnet Overview {params?.id}
         </Heading>
-        <Text
+        {/* <Text
           to=""
           style={{ fontSize: "14px" }}
           color={colorMode === "light" ? "#000" : "#fff"}
@@ -121,7 +121,7 @@ const SubnetId = () => {
             <option value="option2">20</option>
             <option value="option3">30</option>
           </Select>
-        </Text>
+        </Text> */}
       </Container>
       <VStack
         pt={{ base: colorMode === "light" ? 10 : 10, md: 10 }}

src/pages/Transaction.jsx

@@ -116,7 +116,7 @@ const Transaction = () => {
                 </HStack>
             </Box>
             <Box boxShadow={colorMode === 'light'&&"md"}  bg={colorMode === "light" ? "#F3F3F3" : "#1D1D1D"} p={4} mb={5} rounded={6}>
-                <HStack fontSize={"sm"} gap={"8rem"} mb={5}>
+                <HStack fontSize={"sm"} gap={{base:"3rem",md:"8rem"}} mb={5}>
                     <Box>
                         <Text>Amount</Text>
                         <Text color={"#A1A1A1"}>$ 100</Text>