telos nezet landin, home, navbar, footer
This commit is contained in:
@@ -33,75 +33,150 @@ const Footer = () => {
|
||||
return (
|
||||
<footer
|
||||
ref={footerRef}
|
||||
className="relative bg-zinc-900 text-zinc-400 border-t-2 border-zinc-800 mt-auto py-8"
|
||||
className="relative bg-zinc-900 text-zinc-400 border-t-2 border-zinc-800 mt-auto py-6 md:py-8"
|
||||
style={{ transformOrigin: "bottom center" }}
|
||||
>
|
||||
<div className="max-w-6xl mx-auto flex flex-wrap justify-between items-start gap-8 px-4">
|
||||
{/* Logó */}
|
||||
<div className="flex flex-col items-center">
|
||||
<button
|
||||
onClick={goLanding}
|
||||
className="hover:scale-105 hover:brightness-110 transition-transform"
|
||||
>
|
||||
<Logo size={100} />
|
||||
</button>
|
||||
<button
|
||||
onClick={goLanding}
|
||||
className="font-extrabold text-xl mt-2 tracking-wide text-white hover:text-green-500 transition-colors"
|
||||
>
|
||||
SerpentRace
|
||||
</button>
|
||||
<div className="max-w-6xl mx-auto px-4">
|
||||
{/* Mobile: Logo középen, majd grid alatta */}
|
||||
<div className="flex flex-col items-center md:hidden gap-6 mb-6">
|
||||
<div className="flex flex-col items-center">
|
||||
<button
|
||||
onClick={goLanding}
|
||||
className="hover:scale-105 hover:brightness-110 transition-transform"
|
||||
>
|
||||
<Logo size={80} />
|
||||
</button>
|
||||
<button
|
||||
onClick={goLanding}
|
||||
className="font-extrabold text-lg mt-2 tracking-wide text-white hover:text-green-500 transition-colors"
|
||||
>
|
||||
SerpentRace
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Oldalak */}
|
||||
<div className="flex flex-col gap-1">
|
||||
<span className="text-lg font-semibold text-green-600 underline underline-offset-4 mb-2 drop-shadow-sm">
|
||||
Oldalak
|
||||
</span>
|
||||
<button
|
||||
onClick={goLanding}
|
||||
className="text-left hover:underline hover:text-green-500 transition-colors"
|
||||
>
|
||||
Főoldal
|
||||
</button>
|
||||
<button
|
||||
onClick={goAbout}
|
||||
className="text-left hover:underline hover:text-green-500 transition-colors"
|
||||
>
|
||||
Rólunk
|
||||
</button>
|
||||
{/* Mobile: 2 oszlopos grid */}
|
||||
<div className="grid grid-cols-2 gap-6 md:hidden mb-6">
|
||||
{/* Oldalak */}
|
||||
<div className="flex flex-col gap-1">
|
||||
<span className="text-base font-semibold text-green-600 underline underline-offset-4 mb-2 drop-shadow-sm">
|
||||
Oldalak
|
||||
</span>
|
||||
<button
|
||||
onClick={goLanding}
|
||||
className="text-left text-sm hover:underline hover:text-green-500 transition-colors"
|
||||
>
|
||||
Főoldal
|
||||
</button>
|
||||
<button
|
||||
onClick={goAbout}
|
||||
className="text-left text-sm hover:underline hover:text-green-500 transition-colors"
|
||||
>
|
||||
Rólunk
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{/* Közösség */}
|
||||
<div className="flex flex-col gap-1">
|
||||
<span className="text-base font-semibold text-green-600 underline underline-offset-4 mb-2 drop-shadow-sm">
|
||||
Közösség
|
||||
</span>
|
||||
<a
|
||||
href="https://discord.gg/"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="text-sm hover:underline hover:text-green-500"
|
||||
>
|
||||
Discord
|
||||
</a>
|
||||
<a
|
||||
href="https://github.com/"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="text-sm hover:underline hover:text-green-500"
|
||||
>
|
||||
GitHub
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Közösség */}
|
||||
<div className="flex flex-col gap-1">
|
||||
<span className="text-lg font-semibold text-green-600 underline underline-offset-4 mb-2 drop-shadow-sm">
|
||||
Közösség
|
||||
</span>
|
||||
<a
|
||||
href="https://discord.gg/"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="hover:underline hover:text-green-500"
|
||||
>
|
||||
Discord
|
||||
</a>
|
||||
<a
|
||||
href="https://github.com/"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="hover:underline hover:text-green-500"
|
||||
>
|
||||
GitHub
|
||||
</a>
|
||||
</div>
|
||||
|
||||
{/* Elérhetőség */}
|
||||
<div className="flex flex-col gap-1">
|
||||
<span className="text-lg font-semibold text-green-600 underline underline-offset-4 mb-2 drop-shadow-sm">
|
||||
{/* Mobile: Elérhetőség teljes széles */}
|
||||
<div className="flex flex-col gap-1 md:hidden mb-6">
|
||||
<span className="text-base font-semibold text-green-600 underline underline-offset-4 mb-2 drop-shadow-sm">
|
||||
Elérhetőség
|
||||
</span>
|
||||
<span className="opacity-85">Email: info@serpentrace.hu</span>
|
||||
<span className="opacity-85">Telefon: +36 30 123 4567</span>
|
||||
<span className="text-sm opacity-85">Email: info@serpentrace.hu</span>
|
||||
<span className="text-sm opacity-85">Telefon: +36 30 123 4567</span>
|
||||
</div>
|
||||
|
||||
{/* Desktop: Original flex layout */}
|
||||
<div className="hidden md:flex flex-wrap justify-between items-start gap-8">
|
||||
{/* Logó */}
|
||||
<div className="flex flex-col items-center">
|
||||
<button
|
||||
onClick={goLanding}
|
||||
className="hover:scale-105 hover:brightness-110 transition-transform"
|
||||
>
|
||||
<Logo size={100} />
|
||||
</button>
|
||||
<button
|
||||
onClick={goLanding}
|
||||
className="font-extrabold text-xl mt-2 tracking-wide text-white hover:text-green-500 transition-colors"
|
||||
>
|
||||
SerpentRace
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{/* Oldalak */}
|
||||
<div className="flex flex-col gap-1">
|
||||
<span className="text-lg font-semibold text-green-600 underline underline-offset-4 mb-2 drop-shadow-sm">
|
||||
Oldalak
|
||||
</span>
|
||||
<button
|
||||
onClick={goLanding}
|
||||
className="text-left hover:underline hover:text-green-500 transition-colors"
|
||||
>
|
||||
Főoldal
|
||||
</button>
|
||||
<button
|
||||
onClick={goAbout}
|
||||
className="text-left hover:underline hover:text-green-500 transition-colors"
|
||||
>
|
||||
Rólunk
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{/* Közösség */}
|
||||
<div className="flex flex-col gap-1">
|
||||
<span className="text-lg font-semibold text-green-600 underline underline-offset-4 mb-2 drop-shadow-sm">
|
||||
Közösség
|
||||
</span>
|
||||
<a
|
||||
href="https://discord.gg/"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="hover:underline hover:text-green-500"
|
||||
>
|
||||
Discord
|
||||
</a>
|
||||
<a
|
||||
href="https://github.com/"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="hover:underline hover:text-green-500"
|
||||
>
|
||||
GitHub
|
||||
</a>
|
||||
</div>
|
||||
|
||||
{/* Elérhetőség */}
|
||||
<div className="flex flex-col gap-1">
|
||||
<span className="text-lg font-semibold text-green-600 underline underline-offset-4 mb-2 drop-shadow-sm">
|
||||
Elérhetőség
|
||||
</span>
|
||||
<span className="opacity-85">Email: info@serpentrace.hu</span>
|
||||
<span className="opacity-85">Telefon: +36 30 123 4567</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user