max.olchov/HifiPlanet-Website
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add admin panel shortcut icon to navbar when logged in

Browse source 
Neben dem Dark/Light-Umschalter erscheint jetzt fuer eingeloggte
Admin-Nutzer ein zusaetzliches Icon, das direkt zu /admin fuehrt -
sowohl Desktop- als auch mobile Navigation.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
Maaxxs 2026-07-05 16:42:35 +02:00
parent 347effffee
commit febe294129
1 changed files with 23 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

23
hifi-src/src/components/Navbar.jsx
View file

@ -1,10 +1,13 @@
import { useState } from 'react'; import { useState } from 'react';
import { Link } from 'react-router-dom'; import { Link } from 'react-router-dom';
import ThemeToggle from './ThemeToggle.jsx'; import ThemeToggle from './ThemeToggle.jsx';
import DynamicIcon from './DynamicIcon.jsx';
import { useAuth } from '../context/AuthContext.jsx';
import logo from '../assets/logo.png'; import logo from '../assets/logo.png';
export default function Navbar() { export default function Navbar() {
const [open, setOpen] = useState(false); const [open, setOpen] = useState(false);
const { user } = useAuth();
return ( return (
<header className="sticky top-0 z-30 border-b border-slate-200 bg-white/90 backdrop-blur dark:border-slate-800 dark:bg-slate-950/90"> <header className="sticky top-0 z-30 border-b border-slate-200 bg-white/90 backdrop-blur dark:border-slate-800 dark:bg-slate-950/90">
@ -17,10 +20,30 @@ export default function Navbar() {
<Link to="/fahrzeuge" className="hover:text-brand-500">Fahrzeuge</Link> <Link to="/fahrzeuge" className="hover:text-brand-500">Fahrzeuge</Link>
<Link to="/leistungen" className="hover:text-brand-500">Leistungen</Link> <Link to="/leistungen" className="hover:text-brand-500">Leistungen</Link>
<Link to="/kontakt" className="hover:text-brand-500">Kontakt</Link> <Link to="/kontakt" className="hover:text-brand-500">Kontakt</Link>
{user && (
<Link
to="/admin"
aria-label="Zum Admin-Panel"
title="Zum Admin-Panel"
className="rounded-full p-2 text-slate-600 transition hover:bg-slate-100 dark:text-slate-300 dark:hover:bg-slate-800"
>
<DynamicIcon name="layout-dashboard" className="h-5 w-5" />
</Link>
)}
<ThemeToggle /> <ThemeToggle />
</nav> </nav>
<div className="flex items-center gap-2 md:hidden"> <div className="flex items-center gap-2 md:hidden">
{user && (
<Link
to="/admin"
aria-label="Zum Admin-Panel"
title="Zum Admin-Panel"
className="rounded-full p-2 text-slate-600 transition hover:bg-slate-100 dark:text-slate-300 dark:hover:bg-slate-800"
>
<DynamicIcon name="layout-dashboard" className="h-5 w-5" />
</Link>
)}
<ThemeToggle /> <ThemeToggle />
<button <button
onClick={() => setOpen((o) => !o)} onClick={() => setOpen((o) => !o)}