modification of homepage

package.json

@@ -9,17 +9,19 @@
     "lint": "next lint"
   },
   "dependencies": {
-    "next": "14.2.3",
-    "react": "^18",
-    "react-dom": "^18",
     "@chakra-ui/icons": "^2.1.1",
     "@chakra-ui/next-js": "^2.2.0",
     "@chakra-ui/react": "^2.8.2",
     "@emotion/react": "^11.11.4",
     "@emotion/styled": "^11.11.5",
     "@nextui-org/react": "^2.3.6",
     "framer-motion": "^11.1.7",
+    "next": "14.2.3",
+    "react": "^18",
+    "react-dom": "^18",
     "react-icons": "^5.1.0",
+    "react-slick": "^0.30.2",
+    "slick-carousel": "^1.8.1",
     "typewriter-effect": "^2.21.0",
     "web-vitals": "^3.5.2"
   },

src/Components/Footer/Footer.jsx

@@ -1,49 +1,49 @@
 import React from "react";
-import { FaInstagram } from "react-icons/fa6";
-import { FaLinkedin } from "react-icons/fa";
-import { FaYoutube } from "react-icons/fa6";
-import { FaSquareXTwitter } from "react-icons/fa6";
-import Link from "next/link";
-import smily from "../../imgs/smily.png"
-import Logo from "../../imgs/logos/Group 122.359fbdf94648632fa2326ddddf001f55.svg"
 import Image from "next/image";
-export default function Footer(){
-
-
-
-    return(
-        <div className="flex  gap-2  bg-purple-100  ">
-            <div className="flex  flex-col w-[30vw] h-[40vh] justify-start gap-[5%] ">
-
-            <div className="inline-block  ml-[3vw] mt-3 ">
-                <Image height={56} width={206} className="md:h-14" src={Logo} alt="" /></div>
-            <div className=" mx-auto md:w-[30vw] md:mx-auto md:ml-7 w-[55vw] pl-2 "><p className="text-purple-950 text-left text-[0.8rem] md:text-[1rem] ">At Leadlly, we believe every student has the potential to excel. We're a passionate team dedicated to helping school-going students reach their academic goals through a unique blend of technology and personalized mentorship.</p></div>
+import logo from "../.././app/assets/logo.png";
+
+export default function Footer() {
+  return (
+    <>
+      <section className="overflow-hidden bg-gradient relative flex flex-col items-center">
+        <div className="full rounded-xl font-sans font-bold ">
+
+      <footer className="footer">
+          <div className="footer-content">
+            <div className="footer-section about">
+              <Image src={logo} alt="Logo" className="logo" />
+              <p>
+                We are on a mission to help aspirants in managing all the
+                studies without stressing over it :)
+              </p>
+              <div className="social-icons">
+                <div className="circle"></div>
+                <div className="circle"></div>
+                <div className="circle"></div>
+                <div className="circle"></div>
+              </div>
             </div>
-
-            <div className="flex flex-col ml-[25vw] w-[40vw] md:w-[40vw] h-full ">
-            <div className="md:mx-auto  text-[#5a10d9]"><h1 className="mt-5 leading-tight font-lato mb-2 text-[1.2rem]  md:text-[1.6rem] font-bold ">Important Links </h1>
-            <h2 className="text-[0.8rem] md:text-[1rem]">
-            <a href="https://forms.gle/rGuHFN2JwULDVVGAA">Contact Us</a>
-            <br/> <Link href="/">Become a Mentor</Link>
-            <br/> <Link href="/About">About Us</Link>
-            <br/> <a href="https://question-bank-web-flame.vercel.app" target="_blank">Question Bank</a>
-
-            </h2> 
+            <div className="footer-section links">
+              <h2>Company</h2>
+              <a href="#">About Us</a>
+              <a href="#">Teach at Leadlly</a>
+              <a href="#">Contact Us</a>
             </div>
-
-            <div className="mx-auto"><h1 className="mt-[10%]  font-lato  text-[#5a10d9] text-[1.2rem] md:text-[1.6rem] font-bold ">Follow us <br /></h1></div>
-
-            <div className="flex  justify-center md:gap-2 mx-auto  bg-purple-100  ">
-
-            <div className="inline-block  my-auto cursor-pointer "><a href="https://www.instagram.com/leadlly.in"><FaInstagram className="md:size-8 size-5"/></a></div>
-            <div className="inline-block my-auto cursor-pointer"><a href="https://www.linkedin.com/company/leadlly-edu/"><FaLinkedin className="md:size-8 size-5"/></a></div>
-            <div className="inline-block  my-auto cursor-pointer"><a href="https://twitter.com/leadlly_ed"><FaSquareXTwitter className="md:size-8 size-5"/></a></div>
-
-           </div></div>
-
-          <div className=" hidden md:flex my-auto ml-[20vw] h-full "> <Image src={smily} alt="" className="my-auto"/></div>
+            <div className="footer-section links">
+              <h2>Legal</h2>
+              <a href="#">Refund Policy</a>
+              <a href="#">Privacy policy</a>
+              <a href="#">Terms & Conditions</a>
+            </div>
+          </div>
+          <div className="footer-bottom">
+            <div className="circle"></div>
+            <p>All Copyright are reserved to Leadlly.in</p>
+          </div>
+        </footer>
         </div>
-    )
-
-}
+      </section>
+        </>
 
+  )
+}