Add home page layout
This commit is contained in:
anime committed
1 parent
5bda172d1b
commit
d1308e066f
18 files changed
+307
-76
No files matched your search
@@ -6,14 +6,14 @@ import app_store_btn from "./assets/app-store-btn.svg";
|
||||
import play_market_btn from "./assets/play-market-btn.svg";
|
||||
import { Link } from "@/shared/config/navigation";
|
||||
import { useTranslations } from "next-intl";
|
||||
import { LINKS } from "@/shared/variables/links_footer";
|
||||
import { LINKS } from "@/shared/variables/links";
|
||||
|
||||
const Footer = () => {
|
||||
const t = useTranslations("general");
|
||||
const tDisclaimer = useTranslations("disclaimer");
|
||||
const tRights = useTranslations("rights");
|
||||
return (
|
||||
<footer className="px-12 py-20 grid grid-cols-4 gap-[30px] bg-custom-dark">
|
||||
<footer className="px-12 py-20 grid grid-cols-4 gap-[30px] bg-[#0F172A]">
|
||||
<div className="flex flex-col gap-6">
|
||||
<p className="text-white font-normal">© {tRights("text")}</p>
|
||||
<p className="text-white font-normal">{tDisclaimer("text")}</p>
|
||||
@@ -60,9 +60,6 @@ const Footer = () => {
|
||||
</Link>
|
||||
))}
|
||||
</li>
|
||||
<li className="h-fit flex justify-start text-base text-[#e2e8f0] font-normal leading-[140%] items-center gap-4">
|
||||
Photo By ThomasG, CC BY-SA 3.0
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -46,8 +46,8 @@ const NavMenu: React.FC<INavMenuProps> = ({ setOpenMenu }: INavMenuProps) => {
|
||||
];
|
||||
|
||||
return (
|
||||
<nav className="p-[48px] w-full h-full min-h-[600px] fixed left-0 flex flex-col gap-6 bg-white scroll inset-y-0 right-0 z-50 overflow-y-auto">
|
||||
<div className="flex items-center justify-between">
|
||||
<nav className="p-[48px] w-full h-full min-h-[600px] fixed left-0 top-[120px] flex flex-col gap-6 bg-white scroll inset-y-0 right-0 z-50 overflow-y-auto">
|
||||
{/* <div className="flex items-center justify-between">
|
||||
<Link className="-m-1.5 p-1.5" href={"/"}>
|
||||
<Image src={logo} alt="Logo" className="h-8 w-auto" />
|
||||
</Link>
|
||||
@@ -57,7 +57,7 @@ const NavMenu: React.FC<INavMenuProps> = ({ setOpenMenu }: INavMenuProps) => {
|
||||
>
|
||||
<Image src={cross} alt="cross" />
|
||||
</button>
|
||||
</div>
|
||||
</div> */}
|
||||
{LINKS().map((link) => (
|
||||
<Link
|
||||
onClick={() => setOpenMenu(false)}
|
||||
|
||||
@@ -16,6 +16,7 @@ import founded_en from "./assets/founded-en.png";
|
||||
import founded_kg from "./assets/founded-kg.png";
|
||||
import { useParams } from "next/navigation";
|
||||
import NavAuth from "./NavAuth/NavAuth";
|
||||
import { Container } from "@/shared/ui";
|
||||
|
||||
const Navbar = () => {
|
||||
const pathname = usePathname();
|
||||
@@ -30,44 +31,46 @@ const Navbar = () => {
|
||||
|
||||
return (
|
||||
<header className="bg-white">
|
||||
<nav className="mx-auto flex items-center justify-between py-6 lg:px-[90px] px-[90px] mm:px-[20px]">
|
||||
<div className="flex items-center gap-[10px]">
|
||||
<Link href="/">
|
||||
<Image src={logo} alt="Logo" className="navbar__logo-ti" />
|
||||
</Link>
|
||||
<Image
|
||||
className="mt-[30px] h-[120px] w-[120px] inline-block mr-[10px] object-cover"
|
||||
src={FOUNDED[locale as string]}
|
||||
alt="Founded by EU Image"
|
||||
/>
|
||||
<NavLanguage />
|
||||
</div>
|
||||
<nav className="hidden lg:flex lg:gap-x-6">
|
||||
{LINKS().map((link) => (
|
||||
<Link
|
||||
className={`text-black opacity-0.5 size-4 font-normal min-w-[150px] flex justify-center${
|
||||
pathname === link.pathname ? "opacity-1 font-extrabold" : ""
|
||||
}`}
|
||||
key={link.id}
|
||||
href={link.pathname}
|
||||
>
|
||||
{link.pagename}
|
||||
<Container>
|
||||
<nav className="mx-auto flex items-center justify-between py-6 mm:px-[20px]">
|
||||
<div className="flex items-center gap-[10px]">
|
||||
<Link href="/">
|
||||
<Image src={logo} alt="Logo" className="navbar__logo-ti" />
|
||||
</Link>
|
||||
))}
|
||||
<Image
|
||||
className="mt-[30px] h-[120px] w-[120px] inline-block mr-[10px] object-cover"
|
||||
src={FOUNDED[locale as string]}
|
||||
alt="Founded by EU Image"
|
||||
/>
|
||||
<NavLanguage />
|
||||
</div>
|
||||
<nav className="hidden lg:flex lg:gap-x-6">
|
||||
{LINKS().map((link) => (
|
||||
<Link
|
||||
className={`text-black opacity-0.5 size-4 font-normal min-w-[150px] flex justify-center${
|
||||
pathname === link.pathname ? "opacity-1 font-extrabold" : ""
|
||||
}`}
|
||||
key={link.id}
|
||||
href={link.pathname}
|
||||
>
|
||||
{link.pagename}
|
||||
</Link>
|
||||
))}
|
||||
</nav>
|
||||
<div className="hidden lg:flex items-center gap-6">
|
||||
<NavAuth setOpenMenu={setOpenMenu} />
|
||||
</div>
|
||||
|
||||
<button
|
||||
onClick={() => setOpenMenu((prev) => !prev)}
|
||||
className="flex lg:hidden"
|
||||
>
|
||||
<Image src={openMenu ? cross : menu} alt="menu icon" />
|
||||
</button>
|
||||
|
||||
{openMenu && <NavMenu setOpenMenu={setOpenMenu} />}
|
||||
</nav>
|
||||
<div className="hidden lg:flex items-center gap-6">
|
||||
<NavAuth setOpenMenu={setOpenMenu} />
|
||||
</div>
|
||||
|
||||
<button
|
||||
onClick={() => setOpenMenu((prev) => !prev)}
|
||||
className="hidden sm:flex"
|
||||
>
|
||||
<Image src={openMenu ? cross : menu} alt="menu icon" />
|
||||
</button>
|
||||
|
||||
{openMenu && <NavMenu setOpenMenu={setOpenMenu} />}
|
||||
</nav>
|
||||
</Container>
|
||||
</header>
|
||||
);
|
||||
};
|
||||
|
||||
Reference in new issue
Block a user