From 31a9235744567fc733b6968ce81be7e4fe16f394 Mon Sep 17 00:00:00 2001
From: Sarthak <sarthaksingh0608@gmail.com>
Date: Fri, 17 Sep 2021 01:39:58 +0530
Subject: [PATCH 1/2] the elments of ther footer are now redirecting to the
 respective for ex if we click instagram icon it will open a instagram page in
 a new tab

---
 package-lock.json                             |  5 ++++
 package.json                                  |  1 +
 .../HomeViewComponents/FooterSection.js       | 27 ++++++++++---------
 3 files changed, 20 insertions(+), 13 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 13b2130b..839687c2 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -19924,6 +19924,11 @@
         "prop-types": "^15.6.1"
       }
     },
+    "react-icons": {
+      "version": "4.2.0",
+      "resolved": "https://registry.npmjs.org/react-icons/-/react-icons-4.2.0.tgz",
+      "integrity": "sha512-rmzEDFt+AVXRzD7zDE21gcxyBizD/3NqjbX6cmViAgdqfJ2UiLer8927/QhhrXQV7dEj/1EGuOTPp7JnLYVJKQ=="
+    },
     "react-input-autosize": {
       "version": "2.2.2",
       "resolved": "https://registry.npmjs.org/react-input-autosize/-/react-input-autosize-2.2.2.tgz",
diff --git a/package.json b/package.json
index 6b815e10..446995e1 100644
--- a/package.json
+++ b/package.json
@@ -38,6 +38,7 @@
     "react-firebaseui": "^4.1.0",
     "react-helmet": "^5.2.1",
     "react-hook-form": "^7.1.1",
+    "react-icons": "^4.2.0",
     "react-markdown": "^4.3.1",
     "react-material-ui-carousel": "^2.2.1",
     "react-modal-sheet": "^1.3.2",
diff --git a/src/components/HomeViewComponents/FooterSection.js b/src/components/HomeViewComponents/FooterSection.js
index efcf3ed4..4b98484c 100644
--- a/src/components/HomeViewComponents/FooterSection.js
+++ b/src/components/HomeViewComponents/FooterSection.js
@@ -9,6 +9,7 @@ import {
   Typography,
 } from "@material-ui/core";
 import React, { useState } from "react";
+import {FaInstagram,FaYoutube,FaTwitter,FaGithub} from "react-icons/fa";
 
 function Copyright() {
   return (
@@ -18,13 +19,6 @@ function Copyright() {
   );
 }
 
-const iconList = [
-  "/assets/icon/social icons/twitter.svg",
-  "/assets/icon/social icons/linkedIn.svg",
-  "/assets/icon/social icons/github.svg",
-  "/assets/icon/social icons/youtube_icon.svg",
-];
-
 function FooterSection() {
   const classes = useStyles();
 
@@ -52,11 +46,18 @@ function FooterSection() {
                 learning pattern.
               </Typography>
               <Box className={classes.buttonContainer}>
-                {iconList.map((items, index) => (
-                  <IconButton key={index} className={classes.socialButtons}>
-                    <img src={items} />
-                  </IconButton>
-                ))}
+                <IconButton href="https://www.instagram.com/codeforcause/" target="_blank" aria-label="FaceBook">
+                <FaInstagram />
+                </IconButton>
+                <IconButton href="https://www.youtube.com/c/CodeforCause" target="_blank" aria-label="YouTube">
+                <FaYoutube />
+                </IconButton>
+                <IconButton href="https://twitter.com/codeforcauseIn?ref_src=twsrc%5Egoogle%7Ctwcamp%5Eserp%7Ctwgr%5Eauthor" target="_blank" aria-label="Twitter">
+                <FaTwitter />
+                </IconButton>
+                <IconButton href="https://github.com/codeforcauseorg/edu-client" target="_blank" aria-label="Github">
+                <FaGithub/>
+                </IconButton>
               </Box>
             </Box>
           </Grid>
@@ -64,7 +65,7 @@ function FooterSection() {
             <Box>
               <Typography variant="h4">Explore</Typography>
               <Box mt={3} className={classes.exploreLinks}>
-                <Typography gutterBottom variant="h5">
+                <Typography gutterBottom variant="h5" href="/home">
                   Home
                 </Typography>
                 <Typography gutterBottom variant="h5">

From 82083f1aee66320bd37ce8bfc917bb8f6d0a9bbb Mon Sep 17 00:00:00 2001
From: Sarthak <sarthaksingh0608@gmail.com>
Date: Fri, 17 Sep 2021 02:00:10 +0530
Subject: [PATCH 2/2] the elments of ther footer are now redirecting to the
 respective for ex if we click instagram icon it will open a instagram page in
 a new tab

---
 src/components/HomeViewComponents/FooterSection.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/HomeViewComponents/FooterSection.js b/src/components/HomeViewComponents/FooterSection.js
index 4b98484c..569fbde3 100644
--- a/src/components/HomeViewComponents/FooterSection.js
+++ b/src/components/HomeViewComponents/FooterSection.js
@@ -65,7 +65,7 @@ function FooterSection() {
             <Box>
               <Typography variant="h4">Explore</Typography>
               <Box mt={3} className={classes.exploreLinks}>
-                <Typography gutterBottom variant="h5" href="/home">
+                <Typography gutterBottom variant="h5" >
                   Home
                 </Typography>
                 <Typography gutterBottom variant="h5">