devops/encoach_landingpage
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

- Added "Coming soon" pages for future pages;

Browse Source 
- Added two more sections to the About page;
- Fixed some typos;
This commit is contained in:
Tiago Ribeiro
2024-02-01 16:40:06 +00:00
parent 26a2c18839
commit e78f8834e6
13 changed files with 414 additions and 54 deletions
Download Patch File Download Diff File Expand all files Collapse all files

52
src/components/Navbar.tsx
View File

@@ -24,43 +24,43 @@ export default function Navbar({currentPage, language}: {currentPage: string; la
return (
<>
<header className="w-full px-11 py-3 md:flex justify-between items-center -md:hidden shadow-sm">
<header className="-md:hidden w-full items-center justify-between px-11 py-3 shadow-sm md:flex">
<Link href="/">
<Image src="/logo_title.png" alt="EnCoach logo" width={128} height={128} />
</Link>
<div className={clsx("flex gap-8 items-center w-fit", language === "ar" && "flex-row-reverse")}>
<div className={clsx("flex w-fit items-center gap-8", language === "ar" && "flex-row-reverse")}>
{items.map((item) => (
<Link
key={item.key}
href={language === "ar" ? `/${language}${item.page}` : item.page}
className={clsx(
"hover:border-b-2 hover:border-b-mti-purple-light transition ease-in-out duration-300",
currentPage === item.page && "border-b-2 border-b-mti-purple-light",
"hover:border-b-mti-purple-light transition duration-300 ease-in-out hover:border-b-2",
currentPage === item.page && "border-b-mti-purple-light border-b-2",
)}>
{(translation as any)[item.key][language]}
</Link>
))}
</div>
<div className="flex items-center w-fit gap-4">
<div className="flex w-fit items-center gap-4">
<Link
href="https://platform.encoach.com"
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">
className="hover:bg-mti-purple-dark border-mti-purple-dark rounded-xl border px-8 py-2 transition duration-300 ease-in-out hover:text-white">
{translation.platform[language]}
</Link>
<Link
href={language === "ar" ? `/${language}/join` : "join"}
className="transition ease-in-out duration-300 text-white hover:bg-mti-purple-dark hover:border-mti-purple-dark border border-mti-purple-light bg-mti-purple-light px-8 py-2 rounded-xl">
href="https://platform.encoach.com/register"
className="hover:bg-mti-purple-dark hover:border-mti-purple-dark border-mti-purple-light bg-mti-purple-light rounded-xl border px-8 py-2 text-white transition duration-300 ease-in-out">
{translation.join[language]}
</Link>
{language === "ar" ? (
<Link
className="text-mti-purple-light hover:text-mti-purple-dark transition ease-in-out duration-300"
className="text-mti-purple-light hover:text-mti-purple-dark transition duration-300 ease-in-out"
href={`${currentPage}`}>
EN
</Link>
) : (
<Link
className="text-mti-purple-light hover:text-mti-purple-dark transition ease-in-out duration-300"
className="text-mti-purple-light hover:text-mti-purple-dark transition duration-300 ease-in-out"
href={`/ar${currentPage}`}>
AR
</Link>
@@ -91,27 +91,27 @@ export default function Navbar({currentPage, language}: {currentPage: string; la
leave="ease-in duration-200"
leaveFrom="opacity-100 scale-100"
leaveTo="opacity-0 scale-95">
<Dialog.Panel className="w-full h-screen transform overflow-hidden bg-white text-left align-middle shadow-xl transition-all text-black flex flex-col gap-8">
<Dialog.Title as="header" className="w-full px-8 py-2 -md:flex justify-between items-center md:hidden shadow-sm">
<Dialog.Panel className="flex h-screen w-full transform flex-col gap-8 overflow-hidden bg-white text-left align-middle text-black shadow-xl transition-all">
<Dialog.Title as="header" className="-md:flex w-full items-center justify-between px-8 py-2 shadow-sm md:hidden">
<Link href="/">
<Image src="/logo_title.png" alt="EnCoach logo" width={128} height={128} />
</Link>
<div className="flex gap-4 items-center">
<div className="flex items-center gap-4">
{language === "ar" ? (
<Link
className="text-mti-purple-light hover:text-mti-purple-dark transition ease-in-out duration-300"
className="text-mti-purple-light hover:text-mti-purple-dark transition duration-300 ease-in-out"
href={`${currentPage}`}>
EN
</Link>
) : (
<Link
className="text-mti-purple-light hover:text-mti-purple-dark transition ease-in-out duration-300"
className="text-mti-purple-light hover:text-mti-purple-dark transition duration-300 ease-in-out"
href={`/ar${currentPage}`}>
AR
</Link>
)}
<div className="cursor-pointer" onClick={() => setIsOpen(false)} tabIndex={0}>
<BsXLg className="text-2xl text-mti-purple-light" onClick={() => setIsOpen(false)} />
<BsXLg className="text-mti-purple-light text-2xl" onClick={() => setIsOpen(false)} />
</div>
</div>
</Dialog.Title>
@@ -121,23 +121,23 @@ export default function Navbar({currentPage, language}: {currentPage: string; la
key={item.key}
href={language === "ar" ? `/${language}${item.page}` : item.page}
className={clsx(
"transition ease-in-out duration-300 w-fit",
"w-fit transition duration-300 ease-in-out",
currentPage === item.page &&
"text-mti-purple-light font-semibold border-b-2 border-b-mti-purple-light ",
"text-mti-purple-light border-b-mti-purple-light border-b-2 font-semibold ",
)}>
{(translation as any)[item.key][language]}
</Link>
))}
<Link
href={language === "ar" ? `/${language}/join` : "join"}
href="https://platform.encoach.com/register"
className={clsx(
"transition ease-in-out duration-300 w-fit",
"w-fit transition duration-300 ease-in-out",
currentPage === "/join" &&
"text-mti-purple-light font-semibold border-b-2 border-b-mti-purple-light ",
"text-mti-purple-light border-b-mti-purple-light border-b-2 font-semibold ",
)}>
{translation.join[language]}
</Link>
<Link href="https://platform.encoach.com" className={clsx("transition ease-in-out duration-300 w-fit")}>
<Link href="https://platform.encoach.com" className={clsx("w-fit transition duration-300 ease-in-out")}>
{translation.platform[language]}
</Link>
</div>
@@ -148,20 +148,20 @@ export default function Navbar({currentPage, language}: {currentPage: string; la
</Dialog>
</Transition>
<header className="w-full px-8 py-2 -md:flex justify-between items-center md:hidden">
<header className="-md:flex w-full items-center justify-between px-8 py-2 md:hidden">
<Link href="/">
<Image src="/logo_title.png" alt="EnCoach logo" width={69} height={69} />
</Link>
<div className="flex gap-4 items-center">
<div className="flex items-center gap-4">
{language === "ar" ? (
<Link
className="text-mti-purple-light hover:text-mti-purple-dark transition ease-in-out duration-300"
className="text-mti-purple-light hover:text-mti-purple-dark transition duration-300 ease-in-out"
href={`${currentPage}`}>
EN
</Link>
) : (
<Link
className="text-mti-purple-light hover:text-mti-purple-dark transition ease-in-out duration-300"
className="text-mti-purple-light hover:text-mti-purple-dark transition duration-300 ease-in-out"
href={`/ar${currentPage}`}>
AR
</Link>