56 lines
2.1 KiB
TypeScript
56 lines
2.1 KiB
TypeScript
import { BrowserRouter as Router, Routes, Route, Navigate } from 'react-router-dom';
|
|
import LandingPage from './pages/LandingPage';
|
|
import LoginPage from './pages/LoginPage';
|
|
import ForgotPasswordPage from './pages/ForgotPasswordPage';
|
|
|
|
function App() {
|
|
return (
|
|
<Router>
|
|
<div className="relative min-h-screen bg-deep-forest overflow-hidden">
|
|
{/* Background System - Fixed layers with proper z-index */}
|
|
<div
|
|
aria-hidden="true"
|
|
role="presentation"
|
|
className="pointer-events-none fixed inset-0 z-0 bg-pennyzo bg-cover bg-fixed bg-center"
|
|
/>
|
|
<div
|
|
aria-hidden="true"
|
|
role="presentation"
|
|
className="pointer-events-none fixed inset-0 z-[1] bg-gradient-to-br from-deep-forest/70 via-deep-forest/50 to-rich-brown/40"
|
|
/>
|
|
|
|
{/* Animated Background Elements - Decorative only */}
|
|
<div
|
|
aria-hidden="true"
|
|
role="presentation"
|
|
className="pointer-events-none fixed top-1/4 left-1/4 z-[2] w-96 h-96 bg-luxury-gold/5 rounded-full blur-3xl animate-float"
|
|
/>
|
|
<div
|
|
aria-hidden="true"
|
|
role="presentation"
|
|
className="pointer-events-none fixed bottom-1/4 right-1/4 z-[2] w-80 h-80 bg-bronze/5 rounded-full blur-3xl animate-float"
|
|
style={{ animationDelay: '2s' }}
|
|
/>
|
|
<div
|
|
aria-hidden="true"
|
|
role="presentation"
|
|
className="pointer-events-none fixed top-1/2 left-1/2 z-[2] w-64 h-64 bg-brass/5 rounded-full blur-3xl animate-float -translate-x-1/2 -translate-y-1/2"
|
|
style={{ animationDelay: '4s' }}
|
|
/>
|
|
|
|
{/* Main Content - Highest z-index for interactivity */}
|
|
<main className="relative z-10 min-h-screen">
|
|
<Routes>
|
|
<Route path="/" element={<Navigate to="/login" replace />} />
|
|
<Route path="/home" element={<LandingPage />} />
|
|
<Route path="/login" element={<LoginPage />} />
|
|
<Route path="/forgot-password" element={<ForgotPasswordPage />} />
|
|
</Routes>
|
|
</main>
|
|
</div>
|
|
</Router>
|
|
);
|
|
}
|
|
|
|
export default App;
|