Upload folder using huggingface_hub

client/src/components/Layout.tsx

@@ -133,29 +133,25 @@ const Layout: React.FC<{ children: React.ReactNode }> = ({ children }) => {
     window.location.href = '/login';
   };
 
-  // Map each route to a custom icon path in /public/icons
-  const navIconFor = (name: string) => {
-    switch (name) {
-      case 'Home': return '/icons/home.svg';
-      case 'Tutorial Tasks': return '/icons/tutorial tasks.svg';
-      case 'Weekly Practice': return '/icons/weekly practice.svg';
-      case 'Votes': return '/icons/votes.svg';
-      case 'Toolkit': return '/icons/toolkit.svg';
-      case 'Slides': return '/icons/slides.svg';
-      case 'Feedback': return '/icons/feedback.svg';
-      case 'Manage': return '/icons/049-cyber security.svg';
-      default: return '/icons/home.svg';
-    }
-  };
+  // Use default heroicons for nav icons
+  import {
+    HomeIcon,
+    AcademicCapIcon,
+    BookOpenIcon,
+    HandThumbUpIcon,
+    WrenchScrewdriverIcon,
+    ChatBubbleLeftRightIcon,
+    Cog6ToothIcon
+  } from '@heroicons/react/24/outline';
 
   let navigation = [
-    { name: 'Home', href: '/dashboard' },
-    { name: 'Tutorial Tasks', href: '/tutorial-tasks' },
-    { name: 'Weekly Practice', href: '/weekly-practice' },
-    { name: 'Votes', href: '/votes' },
-    { name: 'Toolkit', href: '/toolkit' },
-    { name: 'Slides', href: '/slides' },
-    { name: 'Feedback', href: '/feedback' },
+    { name: 'Home', href: '/dashboard', icon: HomeIcon },
+    { name: 'Tutorial Tasks', href: '/tutorial-tasks', icon: AcademicCapIcon },
+    { name: 'Weekly Practice', href: '/weekly-practice', icon: BookOpenIcon },
+    { name: 'Votes', href: '/votes', icon: HandThumbUpIcon },
+    { name: 'Toolkit', href: '/toolkit', icon: WrenchScrewdriverIcon },
+    { name: 'Slides', href: '/slides', icon: BookOpenIcon },
+    { name: 'Feedback', href: '/feedback', icon: ChatBubbleLeftRightIcon },
   ];
 
   // Hide Slides for visitors
@@ -165,7 +161,7 @@ const Layout: React.FC<{ children: React.ReactNode }> = ({ children }) => {
 
   // Add Manage link for admin users
   if (user?.role === 'admin') {
-    navigation.push({ name: 'Manage', href: '/manage' });
+    navigation.push({ name: 'Manage', href: '/manage', icon: Cog6ToothIcon });
   }
 
   return (
@@ -182,18 +178,18 @@ const Layout: React.FC<{ children: React.ReactNode }> = ({ children }) => {
       <div className="flex">
         {/* Sidebar */}
         <aside className="hidden md:flex md:flex-col w-60 min-h-[calc(100vh-56px)] border-r border-ui-border bg-ui-panel">
-          <nav className="p-4 space-y-2.5 flex-1" style={{ fontFamily: 'Champion, BebasNeue, Inter, system-ui, sans-serif', letterSpacing: '0.01in' }}>
+          <nav className="p-4 space-y-2 flex-1">
             {navigation.map((item) => {
               const isActive = location.pathname === item.href;
               return (
                 <Link
                   key={item.name}
                   to={item.href}
-                  className={`flex items-center px-4 py-3 rounded-lg text-[0.95rem] font-medium transition-colors ${
-                    isActive ? 'bg-ui-bg text-ui-text shadow-[0_0_6px_rgba(14,165,233,0.45)]' : 'text-ui-text/80 hover:bg-ui-panel/60'
+                  className={`flex items-center px-3 py-2 rounded-lg text-[0.95rem] font-medium transition-colors ${
+                    isActive ? 'bg-ui-bg text-ui-text shadow-[0_0_6px_rgba(20,163,255,0.35)]' : 'text-ui-text/80 hover:bg-ui-panel/60'
                   }`}
                 >
-                  <img src={navIconFor(item.name)} alt="" className="h-6 w-6 mr-3" style={{ filter: 'invert(39%) sepia(92%) saturate(1730%) hue-rotate(177deg) brightness(97%) contrast(101%)' }} />
+                  <item.icon className="h-5 w-5 mr-3 text-ui-neonCyan" />
                   <span>{item.name}</span>
                 </Link>
               );

client/src/index.css

@@ -4,7 +4,7 @@
 
 @layer base {
   html {
-    font-family: 'Exo2', 'Inter', system-ui, sans-serif;
+    font-family: 'Inter', system-ui, sans-serif;
   }
   body {
     @apply bg-ui-bg text-ui-text;