feat: implement nib design system — warm amber palette, dual themes, new typography
Replace Tokyonight/Catppuccin blue palette with warm amber/ink identity. Dual theme support (noir + paper) via data-theme attribute with localStorage persistence. Space Grotesk for chrome, Monaspace Neon for content. Updated glyph set (Strokes: — ○ ◇) across web and CLI.
This commit is contained in:
+16
-2
@@ -2,7 +2,7 @@
|
||||
'use strict';
|
||||
|
||||
const GLYPHS = {
|
||||
note: '◦', todo: '▸', event: '◇',
|
||||
note: '—', todo: '○', event: '◇',
|
||||
snippet: '◆', template: '◈', checklist: '☐',
|
||||
decision: '⚖', link: '↗',
|
||||
};
|
||||
@@ -222,7 +222,7 @@
|
||||
const groups = groupByDate(state.entities);
|
||||
let idx = 0;
|
||||
for (const g of groups) {
|
||||
html += `<div class="date-header">── ${g.label} ──</div>`;
|
||||
html += `<div class="date-header">${g.label}</div>`;
|
||||
for (const e of g.entities) {
|
||||
html += renderEntityItem(e, idx);
|
||||
idx++;
|
||||
@@ -754,6 +754,20 @@
|
||||
return escHtml(s).replace(/'/g, ''');
|
||||
}
|
||||
|
||||
// ========== Theme ==========
|
||||
|
||||
const themeToggle = $('#theme-toggle');
|
||||
let nibTheme = localStorage.getItem('nib:theme') || 'dark';
|
||||
document.documentElement.setAttribute('data-theme', nibTheme);
|
||||
themeToggle.textContent = nibTheme === 'paper' ? '◐' : '◑';
|
||||
|
||||
themeToggle.addEventListener('click', () => {
|
||||
nibTheme = nibTheme === 'dark' ? 'paper' : 'dark';
|
||||
document.documentElement.setAttribute('data-theme', nibTheme);
|
||||
localStorage.setItem('nib:theme', nibTheme);
|
||||
themeToggle.textContent = nibTheme === 'paper' ? '◐' : '◑';
|
||||
});
|
||||
|
||||
// ========== Init ==========
|
||||
|
||||
async function init() {
|
||||
|
||||
Reference in New Issue
Block a user