footer added in footer pages

src/index.css

@@ -262,7 +262,7 @@ input:focus {
 }
 
 .centeredScroll {
-  margin-left: 0;
+  margin-left:40%;
 }
 
 .scrollTop:hover {

src/pages/FooterPages/About/index.jsx

@@ -6,6 +6,7 @@ import { useEffect, useState } from "react";
 import KeyboardBackspaceIcon from "@mui/icons-material/KeyboardBackspace";
 import about from "../../../assets/about-us.webp";
 import { useNavigate } from "react-router-dom";
+import Footer from "../FooterPagesFooter/Footer";
 
 const About = () => {
   const [forks, setForks] = useState(0);
@@ -164,6 +165,7 @@ const About = () => {
           </div>
         </div>
       </div>
+      <Footer/>
     </div>
   );
 };

src/pages/FooterPages/ContributorPage/index.jsx

@@ -8,6 +8,7 @@ import ContributorCard from "./ContributorCard";
 import KeyboardBackspaceIcon from "@mui/icons-material/KeyboardBackspace";
 import backgroundimg from "../../../assets/contributors.webp";
 import { useNavigate } from "react-router-dom";
+import Footer from "../FooterPagesFooter/Footer";
 
 function Contributor() {
   const [currentPage, setCurrentPage] = useState(1);
@@ -129,6 +130,7 @@ function Contributor() {
           <h1 className="no-result">Sorry no result matches your query</h1>
         )}
       </div>
+      <Footer/>
     </div>
   );
 }

src/pages/FooterPages/Feedback/index.jsx

@@ -7,6 +7,7 @@ import { SideBar } from "../../../components";
 import emailjs from "@emailjs/browser";
 import { playSuccessSound } from "../../../js/sounds";
 import { useSnackbar } from "notistack";
+import Footer from "../FooterPagesFooter/Footer";
 
 export const Feedback = () => {
   const form = useRef(null);
@@ -37,6 +38,7 @@ export const Feedback = () => {
   return (
     <>
       <SideBar />
+      <h1 style={{color:'#5f85db', textAlign:'center', paddingTop:'1rem'}}>Your opinion matter to us !</h1>
       <div className="feedback-form-container footer-page-para-color">
         <span className="grad3 grad"></span>
         <span className="grad4 grad"></span>
@@ -75,6 +77,7 @@ export const Feedback = () => {
           </button>
         </form>
       </div>
+      <Footer/>
     </>
   );
 };

src/pages/FooterPages/FooterPagesFooter/Footer.css

@@ -0,0 +1,36 @@
+.footerpages-footer{
+    background-color:var(--input-bg);
+    width: 100%;
+    padding: 10px;
+    text-align: center;
+    margin-top: 1rem;
+}
+.footerpages-footer ul{
+    list-style: none;
+    display: flex;
+    text-align: center;
+    justify-content: center;
+    padding-bottom:1rem;
+}
+.footerpages-footer ul li{
+    padding: 1rem;
+    color:var(--text-color)
+}
+.footerpages-footer .footer-link{
+ text-decoration: none;
+
+}
+.footerpages-footer p{
+    color: var(--text-color);
+}
+@media only screen and (max-width: 760px) {
+    .footerpages-footer{
+        margin-bottom:4.5rem;
+    }
+    .footerpages-footer ul{
+        flex-direction: column;
+    }
+    .footerpages-footer ul li{
+        padding: .2rem;
+    }
+  }

src/pages/FooterPages/FooterPagesFooter/Footer.jsx

@@ -0,0 +1,47 @@
+
+import { Link } from "react-router-dom";
+import './Footer.css';
+import { Logo } from "../../../reusableComponents";
+
+const Footer = () => {
+  return (
+    <div className="footerpages-footer">
+      <div >
+        <Logo/>
+      </div>
+      <ul >
+        <li>
+          <Link to="/dummygram/about" className="footer-link">
+            About
+          </Link>
+        </li>
+        <li>
+          <Link
+            to="/dummygram/feedback"
+            className="footer-link"
+          >
+            Feedback
+          </Link>
+        </li>
+        <li>
+          <Link to="/dummygram/contributors" className="footer-link">
+           Contributors
+          </Link>
+        </li>
+        <li>
+          <Link to="/dummygram/help-center" className="footer-link">
+           Help-center
+          </Link>
+        </li>
+        <li>
+          <Link to="/dummygram/guidelines" className="footer-link">
+           Guidelines
+          </Link>
+        </li>
+      </ul>
+      <p>&copy; 2023 NARAYAN SONI. All rights reserved.</p>
+    </div>
+  );
+};
+
+export default Footer;

src/pages/FooterPages/Guidelines/index.jsx

@@ -5,6 +5,7 @@ import { Link, useNavigate } from "react-router-dom";
 
 import KeyboardBackspaceIcon from "@mui/icons-material/KeyboardBackspace";
 import background from "../../../assets/guidelines.webp";
+import Footer from "../FooterPagesFooter/Footer";
 
 const Guidelines = () => {
   const navigate = useNavigate();
@@ -177,6 +178,7 @@ const Guidelines = () => {
           </ul>
         </div>
       </div>
+      <Footer/>
     </div>
   );
 };

src/pages/FooterPages/HelpCenter/index.jsx

@@ -5,6 +5,7 @@ import React, { useState } from "react";
 import Faq from "../../../assets/preview.webp";
 import KeyboardBackspaceIcon from "@mui/icons-material/KeyboardBackspace";
 import { useNavigate } from "react-router-dom";
+import Footer from "../FooterPagesFooter/Footer";
 
 const accordionData = [
   {
@@ -69,6 +70,7 @@ export default function HelpCenter() {
           );
         })}
       </div>
+      <Footer/>
     </>
   );
 }

src/reusableComponents/index.js

@@ -24,10 +24,10 @@ export {
   Logo,
   Popup,
   PostSkeleton,
-  Scroll,
   ShareModal,
   SnackBar,
   validate,
+  Scroll,
 };
 
 export default Scroll;