Merge pull request #105 from she-code-africa/academy-landing

Academy-landing
she-code-africa · Dec 4, 2023 · 7559f7e · 7559f7e
2 parents 4e33348 + 3e91c8f
commit 7559f7e
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 9 deletions.
diff --git a/src/App.js b/src/App.js
@@ -36,7 +36,7 @@ import LandingPage from "./pages/Academy";
 
 const queryClient = new QueryClient();
 
-function App() {
+function App () {
   const { pathname } = useLocation();
   React.useEffect(() => {
     window.scrollTo(0, 0);
@@ -59,13 +59,12 @@ function App() {
   );
 }
 
-function Routes(params) {
+function Routes (params) {
   return (
     <Switch>
       <Route path={paths.home} element={<Home />} />
       <Route path="/academy/:slug" element={<AcademyPage />} />
       <Route path="/academy" element={<LandingPage />} />
-      {/* <Route path="/academy" element={<Redirects />} /> */}
       <Route path={paths.about} element={<About />} />
       <Route path={paths.team} element={<Team />} />
       <Route path={paths.chapters} element={<Chapters />} />

diff --git a/src/pages/Academy/index.jsx b/src/pages/Academy/index.jsx
@@ -2,7 +2,6 @@ import React, { useEffect, useState } from "react";
 import Header from "../../components/Header";
 import { Helmet } from "react-helmet-async";
 import academyHero from "../../images/academy/academy.png";
-import guidance from "../../images/about/guidance.jpg";
 import { Link } from "react-router-dom";
 import Footer from "../../components/Footer";
 import { apiConstants, paths } from "../../utils";
@@ -74,12 +73,12 @@ const LandingPage = () => {
 
         <section
           id="mentor"
-          className="my-32 w-10/12 md:w-[75%] mx-auto grid grid-cols-1 md:grid-cols-2 gap-5 justify-between"
+          className="my-32 w-10/12 md:w-[75%] mx-auto grid grid-cols-1 md:grid-cols-2 gap-10 justify-between"
         >
           {schools.length > 0 &&
             schools.map((school, index) => (
-              <article
-                className={`md:flex items-center justify-between my-40 `}
+              <div
+                className={`md:flex items-center justify-between md:my-10`}
                 key={index}
               >
                 <div className="md:w-[90%]">
@@ -95,12 +94,12 @@ const LandingPage = () => {
 
                   <Link
                     to={`/academy/${school.slug}`}
-                    className="bg-[#FDC0E3] px-8 py-4 inline-block mt-3 rounded-full text-[#434343]"
+                    className="bg-[#FDC0E3] px-8 py-4 inline-block mt-3 rounded-full text-[#434343] border border-[#FDC0E3] hover:bg-transparent transition-colors duration-300"
                   >
                     View school
                   </Link>
                 </div>
-              </article>
+              </div>
             ))}
         </section>