fix(landing): menu mobile funcional + nav branca solida ao rolar
- adiciona painel de menu mobile (sanduiche nao abria nada) - nav fica branca SOLIDA ao rolar/abrir menu (era bg-white/80 translucido) Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
@@ -50,7 +50,7 @@ export const LandingPage: React.FC<{
|
|||||||
return (
|
return (
|
||||||
<div className="min-h-screen bg-[#F8FAFC] font-sans selection:bg-blue-100 selection:text-blue-900 overflow-x-hidden">
|
<div className="min-h-screen bg-[#F8FAFC] font-sans selection:bg-blue-100 selection:text-blue-900 overflow-x-hidden">
|
||||||
{/* Navigation */}
|
{/* Navigation */}
|
||||||
<nav className={`fixed top-0 left-0 right-0 z-[100] transition-all duration-500 ${scrolled ? 'bg-white/80 backdrop-blur-xl border-b border-gray-100 py-3 shadow-sm' : 'bg-transparent py-6'}`}>
|
<nav className={`fixed top-0 left-0 right-0 z-[100] transition-all duration-300 ${(scrolled || mobileMenuOpen) ? 'bg-white border-b border-gray-100 py-3 shadow-sm' : 'bg-transparent py-6'}`}>
|
||||||
<div className="max-w-7xl mx-auto px-6 flex justify-between items-center">
|
<div className="max-w-7xl mx-auto px-6 flex justify-between items-center">
|
||||||
<div className="flex items-center gap-2">
|
<div className="flex items-center gap-2">
|
||||||
<div className="w-10 h-10 bg-gradient-to-tr from-blue-600 to-indigo-600 rounded-xl flex items-center justify-center shadow-lg shadow-blue-200">
|
<div className="w-10 h-10 bg-gradient-to-tr from-blue-600 to-indigo-600 rounded-xl flex items-center justify-center shadow-lg shadow-blue-200">
|
||||||
@@ -101,6 +101,24 @@ export const LandingPage: React.FC<{
|
|||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
{/* Menu mobile */}
|
||||||
|
{mobileMenuOpen && (
|
||||||
|
<div className="md:hidden bg-white border-t border-gray-100 px-6 py-3 mt-3 shadow-lg">
|
||||||
|
{['features', 'solutions', 'mobile'].map((id, i) => (
|
||||||
|
<a key={id} href={`#${id}`} onClick={() => setMobileMenuOpen(false)}
|
||||||
|
className="block py-3 text-sm font-bold text-gray-700 hover:text-blue-600 uppercase tracking-widest border-b border-gray-50">
|
||||||
|
{['Recursos', 'Soluções', 'Mobile'][i]}
|
||||||
|
</a>
|
||||||
|
))}
|
||||||
|
<button
|
||||||
|
onClick={() => { setMobileMenuOpen(false); (isAuthenticated ? onGoToArea : onGetStarted)(); }}
|
||||||
|
className="w-full mt-3 bg-gray-900 text-white py-3 rounded-full text-xs font-black uppercase tracking-widest hover:bg-blue-600 transition-all active:scale-95"
|
||||||
|
>
|
||||||
|
{isAuthenticated ? `Minha área — ${firstName}` : 'Começar Agora'}
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
</nav>
|
</nav>
|
||||||
|
|
||||||
{/* Hero Section */}
|
{/* Hero Section */}
|
||||||
|
|||||||
Reference in New Issue
Block a user