Initial Commit

2026-06-17 12:59:31 -04:00
commit 3ec2f67103
95 changed files with 66244 additions and 0 deletions
@@ -0,0 +1,13 @@
+@inherits LayoutComponentBase
+<div class="layout">
+    <aside class="sidebar">
+        <NavMenu />
+    </aside>
+    <div class="main-area">
+        <main>
+            <article class="content">
+                @Body
+            </article>
+        </main>
+    </div>
+</div>
@@ -0,0 +1,43 @@
+.layout {
+    display: flex;
+    min-height: 100vh;
+}
+
+.sidebar {
+    width: 240px;
+    flex-shrink: 0;
+    background: var(--bg-secondary);
+    border-right: 1px solid var(--border);
+    position: sticky;
+    top: 0;
+    height: 100vh;
+    overflow-y: auto;
+}
+
+.main-area {
+    flex: 1;
+    min-width: 0;
+}
+
+.content {
+    padding: 2rem;
+    max-width: 960px;
+}
+
+@media (max-width: 768px) {
+    .layout {
+        flex-direction: column;
+    }
+
+    .sidebar {
+        width: 100%;
+        height: auto;
+        position: static;
+        border-right: none;
+        border-bottom: 1px solid var(--border);
+    }
+
+    .content {
+        padding: 1.25rem;
+    }
+}
@@ -0,0 +1,16 @@
+<div class="nav-header">
+    <a class="nav-brand" href="">
+        <span class="brand-icon">&#9670;</span>
+        <span class="brand-text">Game Slop Reference</span>
+    </a>
+</div>
+<nav class="nav-links">
+    <NavLink class="nav-link" href="" Match="NavLinkMatch.All">
+        <svg class="nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/><polyline points="9 22 9 12 15 12 15 22"/></svg>
+        Home
+    </NavLink>
+    <NavLink class="nav-link" href="games">
+        <svg class="nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="6" y1="6" x2="6" y2="18"/><line x1="10" y1="6" x2="10" y2="18"/><path d="M14 6h4a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2h-4"/></svg>
+        Games
+    </NavLink>
+</nav>
@@ -0,0 +1,78 @@
+.nav-header {
+    padding: 1.25rem 1rem;
+    border-bottom: 1px solid var(--border);
+}
+
+.nav-brand {
+    display: flex;
+    align-items: center;
+    gap: 0.6rem;
+    text-decoration: none;
+    color: var(--text);
+}
+
+.brand-icon {
+    font-size: 1.3rem;
+    color: var(--accent);
+}
+
+.brand-text {
+    font-size: 0.95rem;
+    font-weight: 600;
+}
+
+.nav-links {
+    padding: 0.75rem 0.5rem;
+    display: flex;
+    flex-direction: column;
+    gap: 0.25rem;
+}
+
+.nav-link {
+    display: flex;
+    align-items: center;
+    gap: 0.6rem;
+    padding: 0.6rem 0.75rem;
+    border-radius: 6px;
+    color: var(--text-muted);
+    text-decoration: none;
+    font-size: 0.9rem;
+    font-weight: 500;
+    transition: background 0.15s, color 0.15s;
+}
+
+.nav-link:hover {
+    background: var(--bg-hover);
+    color: var(--text);
+}
+
+.nav-link.active {
+    background: rgba(0, 212, 255, 0.08);
+    color: var(--accent);
+}
+
+.nav-icon {
+    width: 1.1rem;
+    height: 1.1rem;
+    flex-shrink: 0;
+}
+
+@media (max-width: 768px) {
+    .nav-header {
+        padding: 0.75rem 1rem;
+    }
+    .nav-links {
+        flex-direction: row;
+        padding: 0.5rem;
+        gap: 0.25rem;
+    }
+    .nav-link {
+        flex: 1;
+        justify-content: center;
+        padding: 0.5rem;
+        font-size: 0.8rem;
+    }
+    .brand-text {
+        font-size: 0.85rem;
+    }
+}