woms 3.0

src/App.jsx

@@ -2,6 +2,7 @@ import { BrowserRouter, Routes, Route, Navigate } from 'react-router-dom'
 import { AuthProvider, useAuth } from './context/AuthContext'
 import Navbar from './components/Navbar'
 import Footer from './components/Footer'
+import PixelBlast from './components/PixelBlast'
 import LoginPage from './pages/LoginPage'
 import TicketsPage from './pages/TicketsPage'
 import DashboardPage from './pages/DashboardPage'
@@ -10,6 +11,7 @@ import PlanboardPage from './pages/PlanboardPage'
 import ProjectsPage from './pages/ProjectsPage'
 import ReportsPage from './pages/ReportsPage'
 import DocsPage from './pages/DocsPage'
+import AdminPage from './pages/AdminPage'
 
 function ProtectedRoute({ children }) {
   const { user, loading } = useAuth()
@@ -44,6 +46,7 @@ function AppRoutes() {
       <Route path="/projects" element={<ProtectedRoute><ProjectsPage /></ProtectedRoute>} />
       <Route path="/reports" element={<ProtectedRoute><ReportsPage /></ProtectedRoute>} />
       <Route path="/docs" element={<ProtectedRoute><DocsPage /></ProtectedRoute>} />
+      <Route path="/admin" element={<ProtectedRoute><AdminPage /></ProtectedRoute>} />
     </Routes>
   )
 }
@@ -51,11 +54,71 @@ function AppRoutes() {
 function AppContent() {
   const { user } = useAuth()
   
+  if (!user) {
+    return (
+      <>
+        {/* PixelBlast Background für Login-Seite */}
+        <div style={{
+          position: 'fixed',
+          top: 0,
+          left: 0,
+          width: '100vw',
+          height: '100vh',
+          zIndex: 0,
+          background: '#1a202c'
+        }}>
+          <PixelBlast
+            color="#10b981"
+            variant="circle"
+            pixelSize={4}
+            patternScale={2}
+            patternDensity={0.8}
+            enableRipples={true}
+            rippleIntensityScale={1.5}
+            speed={0.3}
+            edgeFade={0.3}
+          />
+        </div>
+        <div style={{ position: 'relative', zIndex: 1 }}>
+          <AppRoutes />
+        </div>
+      </>
+    )
+  }
+  
   return (
     <>
-      {user && <Navbar />}
-      <AppRoutes />
-      {user && <Footer />}
+      {/* PixelBlast Background für Haupt-App */}
+      <div style={{
+        position: 'fixed',
+        top: 0,
+        left: 0,
+        width: '100vw',
+        height: '100vh',
+        zIndex: 0,
+        background: '#1a202c'
+      }}>
+        <PixelBlast
+          color="#10b981"
+          variant="circle"
+          pixelSize={4}
+          patternScale={2}
+          patternDensity={0.8}
+          enableRipples={true}
+          rippleIntensityScale={1.5}
+          speed={0.3}
+          edgeFade={0.3}
+        />
+      </div>
+      <div style={{ position: 'relative', zIndex: 1, display: 'flex', height: '100vh', overflow: 'hidden' }}>
+        <Navbar />
+        <div style={{ flex: 1, display: 'flex', flexDirection: 'column', overflow: 'hidden' }}>
+          <div style={{ flex: 1, overflowY: 'auto' }}>
+            <AppRoutes />
+          </div>
+          <Footer />
+        </div>
+      </div>
     </>
   )
 }