style: ui readability refactor v1.2.2 (removed uppercase, tracking, increased font sizes)

2026-04-11 11:22:40 +03:00
parent 99b70a9de8
commit 4136d49936
25 changed files with 2552 additions and 548 deletions
--- a/frontend/components/BottomNav.tsx
+++ b/frontend/components/BottomNav.tsx
@@ -0,0 +1,82 @@
+'use client';
+
+import { Smartphone, Package, History, Settings, Shield, LogOut } from 'lucide-react';
+import { useRouter, usePathname } from 'next/navigation';
+import { clsx, type ClassValue } from 'clsx';
+import { twMerge } from 'tailwind-merge';
+
+function cn(...inputs: ClassValue[]) {
+  return twMerge(clsx(inputs));
+}
+
+interface BottomNavProps {
+  currentUser: any;
+}
+
+export default function BottomNav({ 
+  currentUser 
+}: BottomNavProps) {
+  const router = useRouter();
+  const pathname = usePathname();
+
+  const isHome = pathname === '/';
+  const isInventory = pathname === '/inventory';
+  const isLogs = pathname === '/logs';
+  const isAdmin = pathname === '/admin';
+
+  return (
+    <footer className="fixed bottom-0 left-0 right-0 p-4 bg-slate-950/80 backdrop-blur-md border-t border-slate-900 z-40">
+      <div className="max-w-4xl mx-auto flex justify-around items-center text-slate-400">
+        
+        <button 
+          onClick={() => router.push('/')}
+          className={cn("flex flex-col items-center gap-1", isHome && "text-primary")}
+        >
+          <Smartphone size={20} />
+          <span className="text-xs font-bold transition-all">Home</span>
+        </button>
+
+        {/* Inventory */}
+        <button 
+          onClick={() => router.push('/inventory')}
+          className={cn("flex flex-col items-center gap-1", isInventory && "text-primary")}
+        >
+          <Package size={20} />
+          <span className="text-xs font-bold transition-all">Inventory</span>
+        </button>
+
+        {/* Logs */}
+        <button 
+          onClick={() => router.push('/logs')}
+          className={cn("flex flex-col items-center gap-1", isLogs && "text-primary")}
+        >
+          <History size={20} />
+          <span className="text-xs font-bold transition-all">Logs</span>
+        </button>
+
+        {/* Admin Settings */}
+        {currentUser?.role === 'admin' && (
+          <button 
+            onClick={() => router.push('/admin')}
+            className={cn("flex flex-col items-center gap-1", isAdmin && "text-primary")}
+          >
+            <Settings size={20} />
+            <span className="text-xs font-bold transition-all">Admin</span>
+          </button>
+        )}
+
+        {/* Logout */}
+        <button 
+          onClick={() => {
+            localStorage.removeItem('inventory_user');
+            window.location.href = '/login';
+          }}
+          className="flex flex-col items-center gap-1 hover:text-rose-500 transition-colors"
+        >
+          <LogOut size={20} />
+          <span className="text-xs font-bold transition-all">Logout</span>
+        </button>
+      </div>
+    </footer>
+  );
+}