Improved the responsiveness of the website
This commit is contained in:
@@ -20,6 +20,8 @@ import {
|
||||
import {BiLogoFacebook} from "react-icons/bi";
|
||||
import {useEffect, useState} from "react";
|
||||
import axios from "axios";
|
||||
import Navbar from "@/components/Navbar";
|
||||
import Footer from "@/components/Footer";
|
||||
|
||||
export default function Home() {
|
||||
const [isValid, setIsValid] = useState(true);
|
||||
@@ -51,35 +53,7 @@ export default function Home() {
|
||||
|
||||
return (
|
||||
<main className="h-screen w-full bg-white text-mti-black flex flex-col">
|
||||
<header className="w-full px-11 py-3 flex justify-between items-center">
|
||||
<Link href="/">
|
||||
<Image src="/logo_title.png" alt="EnCoach logo" width={69} height={69} />
|
||||
</Link>
|
||||
<div className="flex gap-8 items-center w-fit">
|
||||
<Link href="/" className="border-b-2 border-b-mti-purple-light transition ease-in-out duration-300">
|
||||
Home
|
||||
</Link>
|
||||
<Link href="/services" className="hover:border-b-2 hover:border-b-mti-purple-light transition ease-in-out duration-300">
|
||||
Services
|
||||
</Link>
|
||||
<Link href="/about" className="hover:border-b-2 hover:border-b-mti-purple-light transition ease-in-out duration-300">
|
||||
About us
|
||||
</Link>
|
||||
<Link href="/history" className="hover:border-b-2 hover:border-b-mti-purple-light transition ease-in-out duration-300">
|
||||
History
|
||||
</Link>
|
||||
<Link href="/contact" className="hover:border-b-2 hover:border-b-mti-purple-light transition ease-in-out duration-300">
|
||||
Contact
|
||||
</Link>
|
||||
</div>
|
||||
<div className="flex items-center w-fit gap-9">
|
||||
<Link
|
||||
href="/join"
|
||||
className="transition ease-in-out duration-300 hover:text-white hover:bg-mti-purple-dark border border-mti-purple-dark px-8 py-2 rounded-xl">
|
||||
Join
|
||||
</Link>
|
||||
</div>
|
||||
</header>
|
||||
<Navbar currentPage="/success" />
|
||||
|
||||
<section className="w-full h-full relative bg-white py-32 flex flex-col items-center justify-center text-center gap-4">
|
||||
{isLoading && (
|
||||
@@ -109,60 +83,7 @@ export default function Home() {
|
||||
)}
|
||||
</section>
|
||||
|
||||
<section className="w-full py-10 px-28 bg-mti-gray-seasalt grid grid-cols-4">
|
||||
<div className="flex flex-col gap-4">
|
||||
<span className="font-bold text-xl">Navigation</span>
|
||||
<div className="flex flex-col gap-2">
|
||||
<Link href="/about">Why us</Link>
|
||||
<Link href="/about">Capabilities</Link>
|
||||
<Link href="/about">Expertise</Link>
|
||||
<Link href="/about">History</Link>
|
||||
<Link href="/about">Contact</Link>
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex flex-col gap-4">
|
||||
<span className="font-bold text-xl">Services</span>
|
||||
<div className="flex flex-col gap-2">
|
||||
<Link href="#benefits">EnCoach benefits</Link>
|
||||
<Link href="#testimonials">Student testimonials</Link>
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex flex-col gap-4">
|
||||
<span className="font-bold text-xl">About</span>
|
||||
<div className="flex flex-col gap-2">
|
||||
<Link href="/terms">Terms and Conditions</Link>
|
||||
<Link href="/privacy-policy">Privacy Policy</Link>
|
||||
<Link href="/about">About</Link>
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex flex-col gap-4">
|
||||
<span className="font-bold text-xl">Get in Touch</span>
|
||||
<div className="flex flex-col gap-4">
|
||||
<span className="max-w-[280px]">
|
||||
Stay connected with us and know the latest updates about our services through various social media
|
||||
</span>
|
||||
<div className="flex gap-6 items-center">
|
||||
<Link
|
||||
href="https://facebook.com"
|
||||
className="bg-mti-purple-ultralight rounded-full w-10 h-10 flex items-center justify-center hover:bg-mti-purple-dark text-mti-purple-light hover:text-white transition ease-in-out duration-300">
|
||||
<BiLogoFacebook className="w-6 h-6" />
|
||||
</Link>
|
||||
<Link
|
||||
href="https://twitter.com"
|
||||
className="bg-mti-purple-ultralight rounded-full w-10 h-10 flex items-center justify-center hover:bg-mti-purple-dark text-mti-purple-light hover:text-white transition ease-in-out duration-300">
|
||||
<BsTwitter className="w-5 h-5" />
|
||||
</Link>
|
||||
<Link
|
||||
href="https://instagram.com"
|
||||
className="bg-mti-purple-ultralight rounded-full w-10 h-10 flex items-center justify-center hover:bg-mti-purple-dark text-mti-purple-light hover:text-white transition ease-in-out duration-300">
|
||||
<BsInstagram className="w-5 h-5" />
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<footer className="w-full py-10 bg-mti-rose-light text-white flex items-center justify-center">© EnCoach 2023 all rights reserved</footer>
|
||||
<Footer />
|
||||
</main>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user