Add Sets page, React Router navigation, collection export, and README

2026-05-16 00:51:45 +02:00
parent 6aa3dcf41b
commit 1b91a0cc3c
8 changed files with 357 additions and 25 deletions
@@ -0,0 +1,35 @@
+import React from 'react';
+import { NavLink } from 'react-router-dom';
+
+function NavBar() {
+  return (
+    <nav style={{
+      display: 'flex', alignItems: 'center', gap: '4px',
+      padding: '0 16px', background: '#111', borderBottom: '1px solid #2a2a2a',
+      flexShrink: 0,
+    }}>
+      {[
+        { to: '/',     label: 'Cards' },
+        { to: '/sets', label: 'Sets'  },
+      ].map(({ to, label }) => (
+        <NavLink
+          key={to}
+          to={to}
+          end
+          style={({ isActive }) => ({
+            padding: '10px 16px',
+            fontSize: '13px',
+            color: isActive ? '#e0e0e0' : '#555',
+            textDecoration: 'none',
+            borderBottom: isActive ? '2px solid #e0e0e0' : '2px solid transparent',
+            transition: 'color 0.15s',
+          })}
+        >
+          {label}
+        </NavLink>
+      ))}
+    </nav>
+  );
+}
+
+export default NavBar;