Donat/SerpentRace
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

redirect fix

Browse Source
This commit is contained in:
WalkeU
2025-10-15 18:39:43 +02:00
parent 86bf2675eb
commit 76fa204ae8
3 changed files with 100 additions and 74 deletions
Download Patch File Download Diff File Expand all files Collapse all files
SerpentRace_Frontend/src/components/Navbar/Navbar.jsx
+82 -24
View File
@@ -1,41 +1,75 @@
import React, { useState } from "react"
import Logo from "../../assets/pictures/Logo"
import About from "../../pages/About/About"
import Home from "../../pages/Landing/Home"
import { Link, useNavigate } from "react-router-dom"
const navLinkClass = "px-3 py-2 rounded-lg text-white transition-all duration-200 hover:bg-white/10"
const Navbar = () => {
const [menuOpen, setMenuOpen] = useState(false)
const navigate = useNavigate()
// Check if authLevel and username exist in localStorage
const isLoggedIn = Boolean(localStorage.getItem("authLevel") && localStorage.getItem("username"))
// Logout function: töröljük az adatokat és navigálunk a /login-ra (SPA, nincs reload)
const handleLogout = () => {
localStorage.removeItem("authLevel")
localStorage.removeItem("username")
navigate("/login")
}
return (
<nav className="bg-gradient-to-r from-green-700 to-emerald-500 shadow-lg">
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div className="flex justify-between h-16 items-center">
{/* Logo */}
<div className="flex-shrink-0 flex items-center gap-2">
<a href="/" className="flex items-center mt-1 h-9">
<Link to="/" className="flex items-center mt-1 h-9">
<Logo size={36} />
</a>
<a href="/" className="flex items-center h-9 text-white font-bold text-2xl tracking-tight">
</Link>
<Link to="/" className="flex items-center h-9 text-white font-bold text-2xl tracking-tight">
SerpentRace
</a>
</Link>
</div>
{/* Desktop Menu */}
<div className="hidden md:flex space-x-8">
<a href="/home" className={navLinkClass}>
<div className="hidden md:flex space-x-8 items-center">
<Link to="/home" className={navLinkClass}>
Home
</a>
<a href="/report" className={navLinkClass}>
</Link>
<Link to="/decks" className={navLinkClass}>
Decks
</Link>
<Link to="/report" className={navLinkClass}>
Stats
</a>
<a href="/about" className={navLinkClass}>
</Link>
<Link to="/about" className={navLinkClass}>
About
</a>
<a href="/companies" className={navLinkClass}>
</Link>
<Link to="/companies" className={navLinkClass}>
Contact
</a>
</Link>
{isLoggedIn && (
<button
onClick={handleLogout}
className="ml-4 p-2 rounded-full bg-white/10 hover:bg-white/20 transition-all"
title="Logout"
>
{/* Simple logout icon */}
<svg
xmlns="http://www.w3.org/2000/svg"
className="h-6 w-6 text-white"
fill="none"
viewBox="0 0 24 24"
stroke="currentColor"
>
<path
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={2}
d="M17 16l4-4m0 0l-4-4m4 4H7m6 4v1a2 2 0 01-2 2H7a2 2 0 01-2-2V7a2 2 0 012-2h4a2 2 0 012 2v1"
/>
</svg>
</button>
)}
</div>
{/* Mobile Hamburger */}
<div className="md:hidden flex items-center">
@@ -69,18 +103,42 @@ const Navbar = () => {
{/* Mobile Menu */}
{menuOpen && (
<div className="md:hidden bg-emerald-600 px-2 pt-2 pb-3 space-y-1">
<a href="#" className={navLinkClass}>
<Link to="/home" className={navLinkClass}>
Home
</a>
<a href="#" className={navLinkClass}>
</Link>
<Link to="/leaderboard" className={navLinkClass}>
Leaderboard
</a>
<a href="#" className={navLinkClass}>
</Link>
<Link to="/about" className={navLinkClass}>
About
</a>
<a href="#" className={navLinkClass}>
</Link>
<Link to="/companies" className={navLinkClass}>
Contact
</a>
</Link>
{isLoggedIn && (
<div className="flex justify-end px-2 pb-2">
<button
onClick={handleLogout}
className="p-2 rounded-full bg-white/10 hover:bg-white/20 transition-all"
title="Logout"
>
<svg
xmlns="http://www.w3.org/2000/svg"
className="h-6 w-6 text-white"
fill="none"
viewBox="0 0 24 24"
stroke="currentColor"
>
<path
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={2}
d="M17 16l4-4m0 0l-4-4m4 4H7m6 4v1a2 2 0 01-2 2H7a2 2 0 01-2-2V7a2 2 0 012-2h4a2 2 0 012 2v1"
/>
</svg>
</button>
</div>
)}
</div>
)}
</nav>