moidifiche a Layout.tsx

src/components/AppSidebar.tsx

@@ -25,7 +25,7 @@ export default function AppSidebar({ onNavigate }: AppSidebarProps) {
   };
 
   return (
-    <aside className="flex h-full w-64 shrink-0 flex-col border-r bg-card">
+    <aside className="flex min-h-svh w-64 shrink-0 flex-col border-r border-sidebar-border bg-sidebar text-sidebar-foreground">
       <div className="border-b px-4 py-4">
         <p className="text-sm font-semibold">Academy Aziendale</p>
         <p className="text-xs text-muted-foreground">Gestione formazione</p>
@@ -39,10 +39,10 @@ export default function AppSidebar({ onNavigate }: AppSidebarProps) {
             onClick={onNavigate}
             className={({ isActive }) =>
               cn(
-                "flex items-center gap-2 rounded-lg px-3 py-2 text-sm font-medium transition-colors",
+                "flex items-center gap-2 rounded-lg px-3 py-2 text-sm font-medium no-underline transition-colors",
                 isActive
-                  ? "bg-primary text-primary-foreground"
+                  ? "bg-sidebar-primary text-sidebar-primary-foreground"
-                  : "text-muted-foreground hover:bg-muted hover:text-foreground"
+                  : "text-sidebar-foreground/80 hover:bg-sidebar-accent hover:text-sidebar-accent-foreground"
               )
             }
           >

src/components/Layout.tsx

@@ -1,33 +1,14 @@
-import { Link, Outlet, useNavigate } from "react-router-dom";
+import { Outlet } from "react-router-dom";
-import { useAuth } from "../context/AuthContext";
+import AppSidebar from "@/components/AppSidebar";
 
 export default function Layout() {
-  const { user, logout } = useAuth();
-  const navigate = useNavigate();
-
-  const handleLogout = async () => {
-    await logout();
-    navigate("/login");
-  };
-
   return (
-    <div className="layout">
+    <div className="flex min-h-svh bg-background">
-      <header className="header">
+      <AppSidebar />
-        <div className="header-inner">
+      <main className="flex min-w-0 flex-1 flex-col overflow-auto">
-          <Link to="/dashboard" className="logo">
+        <div className="mx-auto w-full max-w-6xl flex-1 p-6">
-            Academy aziendale
-          </Link>
-          <nav>
-            <Link to="/dashboard">Dashboard</Link>
-          </nav>
-          <div className="user-bar">
-            <span>{user?.nome} {user?.cognome}</span>
-            <button type="button" onClick={handleLogout}>Esci</button>
-          </div>
-        </div>
-      </header>
-      <main className="main">
           <Outlet />
+        </div>
       </main>
     </div>
   );

src/index.css

@@ -13,9 +13,6 @@
 
 body {
   margin: 0;
-  font-family: "Segoe UI", system-ui, -apple-system, sans-serif;
-  background: #f1f5f9;
-  color: #1e293b;
   line-height: 1.5;
 }
 
@@ -23,10 +20,6 @@ body {
   min-height: 100vh;
 }
 
-a {
-  color: #2563eb;
-}
-
 @theme inline {
   --font-heading: var(--font-sans);
   --font-sans: 'Geist Variable', sans-serif;