update

src/components/AmountCard/AmountCard.jsx

@@ -18,6 +18,7 @@ import { LiaFileContractSolid } from "react-icons/lia";
 import { TbTransactionDollar } from "react-icons/tb";
 import { BsRCircleFill } from "react-icons/bs";
 import { useGetKPIDetailsQuery } from "../../Services/api.service";
+import { FiCpu } from "react-icons/fi";
 
 
 const AmountCard = () => {
@@ -56,7 +57,7 @@ const AmountCard = () => {
       label: "Total Supply",
       value: kpDetails?.totalSupply,
       icon: <FaGlobe color="white" fontSize={"20px"} />,
-      display: { base: "block", md: "none" }, // Hidden on small, shown on medium and up
+      // display: { base: "block", md: "none" }, // Hidden on small, shown on medium and up
     },
   ];
   console.log(Number(kpDetails?.tvL_RBT).toFixed(3)); // Using Number()
@@ -65,9 +66,9 @@ const AmountCard = () => {
   const statsDataFour = [
     {
       label: "Max supply",
-      value: kpDetails?.totalSupply,
-      icon: <FaGlobe color="white" fontSize={"20px"} />,
-      display: { base: "none", md: "block" }, // Hidden on small, shown on medium and up
+      value: kpDetails?.maxSupply,
+      icon: <FiCpu color="white" fontSize={"20px"} />,
+      // display: { base: "none", md: "block" }, // Hidden on small, shown on medium and up
     },
     {
       label: "Circulating Supply",
@@ -88,12 +89,12 @@ const AmountCard = () => {
 
   return (
     <VStack>
-      <Container maxW="4xl">
+      <Container maxW="6xl">
         <Grid
         
           mb={{base:"10px",md:"16px" }}
           // templateColumns="repeat(3, 2fr)"
-          templateColumns={{base :"repeat(2, 2fr)",md : "repeat(3, 2fr)" }}
+          templateColumns={{base :"repeat(2, 2fr)",md : "repeat(4, 2fr)" }}
           gap={{base:4,md:6}}
           bg={colorMode === "light" ? "light.100" : "black.900"}
           justifyContent="center"