learn page card updated

src/components/Footer/Footer.jsx

@@ -27,6 +27,7 @@ import tele from "../../assets/images/tele.png";
 import reddit from "../../assets/images/reddit.png";
 import fb from "../../assets/images/fb.png";
 import discord from "../../assets/images/discord.png";
+import { Link } from "react-router-dom";
 
 const Footer = () => {
   const [isSmallScreen] = useMediaQuery("(max-width: 996px)");
@@ -134,8 +135,14 @@ const Footer = () => {
                   fontWeight={"400"}
                   marginLeft={"0px !important"}
                 >
-                  <ListItem marginBottom={"1rem"}>Learn</ListItem>
-                  <ListItem marginBottom={"1rem"}>Community</ListItem>
+                  <Link to="/LearnPage">
+                    <ListItem marginBottom={"1rem"}>Learn</ListItem>
+                  </Link>
+
+                  <Link to="/community">
+                    <ListItem marginBottom={"1rem"}>Community</ListItem>
+                  </Link>
+
                   <ListItem marginBottom={"1rem"}>Wallet</ListItem>
                   <ListItem marginBottom={"1rem"}>Careers</ListItem>
                 </UnorderedList>

src/components/LearnPage/LearnDev.jsx

@@ -85,9 +85,9 @@ const LearnDev = () => {
           {Content.span}
         </Text>
       </Container>
-      <Container
-        maxW="container.xl"
-        paddingLeft={"4rem"}
+      <Box
+        // maxW="container.xl"
+        paddingLeft={"7rem"}
         paddingBottom={"2rem"}
         // height={"50vh"}
         sx={{
@@ -120,7 +120,7 @@ const LearnDev = () => {
             />
           ))}
         </Box>
-      </Container>
+      </Box>
     </Box>
   );
 };

src/components/NavBar/NavBar.jsx

@@ -58,7 +58,7 @@ const NavBar = () => {
             zIndex={"9999"}
             width={"100%"}
             textAlign={"right"}
-            padding={"0.5px 0px"}
+            padding={"0.8px 0px"}
           >
             <Box marginRight={"6%"}>
               <Link to="/" style={{ color: "#fff", marginRight: "2.5rem" }}>