feat: compose;

feat: frontend added

Frontend/components/navigation/mobile-nav.jsx

@@ -0,0 +1,40 @@
+'use client';
+
+import Link from 'next/link';
+import { usePathname } from 'next/navigation';
+import { Chrome as Home, Target, BookOpen, ShoppingBag } from 'lucide-react';
+
+export default function MobileNav() {
+  const pathname = usePathname();
+
+  const navItems = [
+    { href: '/dashboard', icon: Home, label: 'Главная' },
+    { href: '/missions', icon: Target, label: 'Миссии' },
+    { href: '/journal', icon: BookOpen, label: 'Журнал' },
+    { href: '/store', icon: ShoppingBag, label: 'Магазин' },
+  ];
+
+  return (
+    <nav className="fixed bottom-0 left-0 right-0 bg-slate-900 border-t border-slate-800 md:hidden z-40">
+      <div className="flex items-center justify-around px-2 py-3">
+        {navItems.map((item) => {
+          const isActive = pathname === item.href;
+          return (
+            <Link
+              key={item.href}
+              href={item.href}
+              className={`flex flex-col items-center gap-1 px-4 py-2 rounded-lg transition-colors ${
+                isActive
+                  ? 'text-blue-400 bg-blue-500/10'
+                  : 'text-slate-400 hover:text-slate-200'
+              }`}
+            >
+              <item.icon className="w-5 h-5" />
+              <span className="text-xs font-medium">{item.label}</span>
+            </Link>
+          );
+        })}
+      </div>
+    </nav>
+  );
+}