lorentz/wulf-pulse
1
0
Fork 0
Code Issues 1 Pull requests Projects Releases Packages Wiki Activity Actions

style: center navigation bar to match rest of app layout

Browse source 
Changed navigation layout from spread (justify-between) to centered:
- Logo positioned absolutely on the left
- Navigation menu centered with mx-auto
- Right actions positioned absolutely on the right
- Container uses justify-center for proper centering
This commit is contained in:
root 2026-02-02 21:22:57 -05:00
parent 1f9ac476b4
commit efff465a86
1 changed files with 5 additions and 5 deletions
Download patch file Download diff file Expand all files Collapse all files

10
components/navigation/app-navigation.tsx
View file

@ -95,10 +95,10 @@ export function AppNavigation() {
return (
<header className="sticky top-0 z-50 w-full border-b bg-background/95 backdrop-blur supports-[backdrop-filter]:bg-background/60">
<div className="container flex h-16 items-center">
<div className="flex flex-1 items-center justify-between">
<div className="relative container flex h-16 items-center justify-center">
<div className="flex flex-1 items-center justify-center">
{/* Logo and App Name */}
<Link href="/" className="flex items-center space-x-3 mr-6">
<Link href="/" className="flex items-center space-x-3 absolute left-4">
<div className="flex h-9 w-9 items-center justify-center rounded-lg bg-gradient-to-br from-blue-600 to-blue-700 text-white shadow-lg">
<Activity className="h-5 w-5" />
</div>
@ -111,7 +111,7 @@ export function AppNavigation() {
</Link>
{/* Main Navigation */}
<NavigationMenu className="mx-6">
<NavigationMenu className="mx-auto">
<NavigationMenuList>
{navigationItems.map((item) => (
<NavigationMenuItem key={item.title}>
@ -170,7 +170,7 @@ export function AppNavigation() {
</NavigationMenu>
{/* Right Side Actions */}
<div className="flex items-center gap-2">
<div className="flex items-center gap-2 absolute right-4">
<ThemeToggle />
</div>
</div>