style: increase light-mode nav text contrast (text-gray-900), adjust borders/shadow; mobile/desktop parity
This commit is contained in:
@@ -31,7 +31,7 @@ const { title = "Omoluabi Association Netherlands", description = "Preserving Ni
|
||||
Skip to main content
|
||||
</a>
|
||||
<!-- Navigation Header -->
|
||||
<header class="bg-white dark:bg-gray-900/95 backdrop-blur shadow-sm sticky top-0 z-50 border-b border-gray-100 dark:border-white/10">
|
||||
<header class="bg-white dark:bg-gray-900/95 backdrop-blur shadow-md sticky top-0 z-50 border-b border-gray-200 dark:border-white/10">
|
||||
<nav class="container mx-auto px-4 py-4">
|
||||
<div class="flex items-center justify-between">
|
||||
<!-- Logo -->
|
||||
@@ -47,13 +47,13 @@ const { title = "Omoluabi Association Netherlands", description = "Preserving Ni
|
||||
|
||||
<!-- Desktop Navigation -->
|
||||
<div class="hidden md:flex items-center space-x-8">
|
||||
<a href="/" class="text-gray-700 dark:text-gray-200 hover:text-nigerian-green-600 dark:hover:text-kente-gold-400 transition-colors">Home</a>
|
||||
<a href="/about" class="text-gray-700 dark:text-gray-200 hover:text-nigerian-green-600 dark:hover:text-kente-gold-400 transition-colors">About</a>
|
||||
<a href="/events" class="text-gray-700 dark:text-gray-200 hover:text-nigerian-green-600 dark:hover:text-kente-gold-400 transition-colors">Events</a>
|
||||
<a href="/members" class="text-gray-700 dark:text-gray-200 hover:text-nigerian-green-600 dark:hover:text-kente-gold-400 transition-colors">Members</a>
|
||||
<a href="/orphanage" class="text-gray-700 dark:text-gray-200 hover:text-nigerian-green-600 dark:hover:text-kente-gold-400 transition-colors">Orphanage</a>
|
||||
<a href="/gallery" class="text-gray-700 dark:text-gray-200 hover:text-nigerian-green-600 dark:hover:text-kente-gold-400 transition-colors">Gallery</a>
|
||||
<a href="/contact" class="text-gray-700 dark:text-gray-200 hover:text-nigerian-green-600 dark:hover:text-kente-gold-400 transition-colors">Contact</a>
|
||||
<a href="/" class="text-gray-900 dark:text-gray-200 hover:text-nigerian-green-700 dark:hover:text-kente-gold-400 transition-colors">Home</a>
|
||||
<a href="/about" class="text-gray-900 dark:text-gray-200 hover:text-nigerian-green-700 dark:hover:text-kente-gold-400 transition-colors">About</a>
|
||||
<a href="/events" class="text-gray-900 dark:text-gray-200 hover:text-nigerian-green-700 dark:hover:text-kente-gold-400 transition-colors">Events</a>
|
||||
<a href="/members" class="text-gray-900 dark:text-gray-200 hover:text-nigerian-green-700 dark:hover:text-kente-gold-400 transition-colors">Members</a>
|
||||
<a href="/orphanage" class="text-gray-900 dark:text-gray-200 hover:text-nigerian-green-700 dark:hover:text-kente-gold-400 transition-colors">Orphanage</a>
|
||||
<a href="/gallery" class="text-gray-900 dark:text-gray-200 hover:text-nigerian-green-700 dark:hover:text-kente-gold-400 transition-colors">Gallery</a>
|
||||
<a href="/contact" class="text-gray-900 dark:text-gray-200 hover:text-nigerian-green-700 dark:hover:text-kente-gold-400 transition-colors">Contact</a>
|
||||
</div>
|
||||
|
||||
<!-- Right side controls -->
|
||||
@@ -70,7 +70,7 @@ const { title = "Omoluabi Association Netherlands", description = "Preserving Ni
|
||||
</div>
|
||||
|
||||
<!-- Mobile menu button -->
|
||||
<button class="md:hidden text-gray-700 dark:text-gray-200" id="mobile-menu-button" aria-controls="mobile-menu" aria-expanded="false">
|
||||
<button class="md:hidden text-gray-900 dark:text-gray-200" id="mobile-menu-button" aria-controls="mobile-menu" aria-expanded="false">
|
||||
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"></path>
|
||||
</svg>
|
||||
@@ -80,13 +80,13 @@ const { title = "Omoluabi Association Netherlands", description = "Preserving Ni
|
||||
<!-- Mobile menu -->
|
||||
<div class="md:hidden hidden" id="mobile-menu">
|
||||
<div class="mt-2 rounded-lg bg-white dark:bg-gray-800 shadow-lg ring-1 ring-gray-900/5 dark:ring-white/10 pt-4 pb-2 space-y-2">
|
||||
<a href="/" class="block px-3 py-2 text-gray-700 dark:text-gray-200 hover:text-nigerian-green-600 dark:hover:text-kente-gold-400">Home</a>
|
||||
<a href="/about" class="block px-3 py-2 text-gray-700 dark:text-gray-200 hover:text-nigerian-green-600 dark:hover:text-kente-gold-400">About</a>
|
||||
<a href="/events" class="block px-3 py-2 text-gray-700 dark:text-gray-200 hover:text-nigerian-green-600 dark:hover:text-kente-gold-400">Events</a>
|
||||
<a href="/members" class="block px-3 py-2 text-gray-700 dark:text-gray-200 hover:text-nigerian-green-600 dark:hover:text-kente-gold-400">Members</a>
|
||||
<a href="/orphanage" class="block px-3 py-2 text-gray-700 dark:text-gray-200 hover:text-nigerian-green-600 dark:hover:text-kente-gold-400">Orphanage</a>
|
||||
<a href="/gallery" class="block px-3 py-2 text-gray-700 dark:text-gray-200 hover:text-nigerian-green-600 dark:hover:text-kente-gold-400">Gallery</a>
|
||||
<a href="/contact" class="block px-3 py-2 text-gray-700 dark:text-gray-200 hover:text-nigerian-green-600 dark:hover:text-kente-gold-400">Contact</a>
|
||||
<a href="/" class="block px-3 py-2 text-gray-900 dark:text-gray-200 hover:text-nigerian-green-700 dark:hover:text-kente-gold-400">Home</a>
|
||||
<a href="/about" class="block px-3 py-2 text-gray-900 dark:text-gray-200 hover:text-nigerian-green-700 dark:hover:text-kente-gold-400">About</a>
|
||||
<a href="/events" class="block px-3 py-2 text-gray-900 dark:text-gray-200 hover:text-nigerian-green-700 dark:hover:text-kente-gold-400">Events</a>
|
||||
<a href="/members" class="block px-3 py-2 text-gray-900 dark:text-gray-200 hover:text-nigerian-green-700 dark:hover:text-kente-gold-400">Members</a>
|
||||
<a href="/orphanage" class="block px-3 py-2 text-gray-900 dark:text-gray-200 hover:text-nigerian-green-700 dark:hover:text-kente-gold-400">Orphanage</a>
|
||||
<a href="/gallery" class="block px-3 py-2 text-gray-900 dark:text-gray-200 hover:text-nigerian-green-700 dark:hover:text-kente-gold-400">Gallery</a>
|
||||
<a href="/contact" class="block px-3 py-2 text-gray-900 dark:text-gray-200 hover:text-nigerian-green-700 dark:hover:text-kente-gold-400">Contact</a>
|
||||
<div class="pt-4 space-y-2">
|
||||
<a href="/donate" class="block btn bg-gradient-to-r from-ankara-red-500 to-kente-gold-500 text-white text-center">❤️ Donate</a>
|
||||
<a href="/join" class="block btn bg-gradient-to-r from-nigerian-green-500 to-kente-gold-500 text-white text-center">⭐ Join Us</a>
|
||||
|
||||
Reference in New Issue
Block a user