lerko/nib-v1
1
1
Fork 0
Code Issues Pull Requests 2 Actions Packages Projects Releases Wiki Activity

feat(ui): phase 1 — layout, tokens, header, rail redesign

Browse Source 
- Switch mono font from Monaspace Neon to JetBrains Mono
- Grid layout 192px | 1fr | 400px (was 180/320)
- Move capture bar from header to bottom of center panel
- Add search input to header center
- Redesign tag rail: grid items with arrow/dot/name/count
- Add intent section (grab/read/fill) in cards view rail
- Add --a-str token, toast component
- Logo 16px 700 weight
This commit is contained in:
Tyler Koenig
2026-05-16 09:25:35 -04:00
parent f4e178e3ee
commit dda8426113
4 changed files with 495 additions and 208 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/index.html
+6 -11
View File
@@ -6,28 +6,22 @@
<title>nib</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300;400;500;600;700&family=JetBrains+Mono:ital,wght@0,300;0,400;0,500;0,600;0,700;1,400&display=swap" rel="stylesheet">
<link rel="stylesheet" href="/style.css">
<style>
@font-face { font-family: 'Monaspace Neon'; font-weight: 300; src: url('https://cdn.jsdelivr.net/gh/githubnext/monaspace@v1.000/fonts/webfonts/MonaspaceNeon-Light.woff2') format('woff2'); }
@font-face { font-family: 'Monaspace Neon'; font-weight: 400; src: url('https://cdn.jsdelivr.net/gh/githubnext/monaspace@v1.000/fonts/webfonts/MonaspaceNeon-Regular.woff2') format('woff2'); }
@font-face { font-family: 'Monaspace Neon'; font-weight: 500; src: url('https://cdn.jsdelivr.net/gh/githubnext/monaspace@v1.000/fonts/webfonts/MonaspaceNeon-Medium.woff2') format('woff2'); }
@font-face { font-family: 'Monaspace Neon'; font-weight: 700; src: url('https://cdn.jsdelivr.net/gh/githubnext/monaspace@v1.000/fonts/webfonts/MonaspaceNeon-Bold.woff2') format('woff2'); }
</style>
</head>
<body>
<div id="app">
<header>
<div class="header-left">
<h1 class="logo">nib</h1>
<span class="logo">nib</span>
<nav>
<button data-view="stream" class="nav-btn active">stream</button>
<button data-view="cards" class="nav-btn">cards</button>
</nav>
</div>
<form id="capture-bar" autocomplete="off">
<input type="text" id="capture-input" placeholder="capture — - todo # note * event" spellcheck="false">
</form>
<div class="header-search">
<input type="text" id="search-input" placeholder="? search #tag" spellcheck="false">
</div>
<button class="theme-toggle" id="theme-toggle" title="toggle theme">◑</button>
</header>
<main>
@@ -35,6 +29,7 @@
<section id="entity-panel">
<div id="month-nav"></div>
<div id="entity-list"></div>
<div id="capture-bar"></div>
</section>
<aside id="detail-pane">
<div class="detail-empty">select an entity</div>