feat: brain mobile pills — tags shown after separator, prefixed with #
Scroll: [All] [Home] [Work] ... | [#guide] [#important] [#dev] ... Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -440,7 +440,7 @@
|
|||||||
|
|
||||||
<!-- Mobile: horizontal pill filters -->
|
<!-- Mobile: horizontal pill filters -->
|
||||||
<div class="mobile-pills">
|
<div class="mobile-pills">
|
||||||
<button class="pill" class:active={!activeFolder && !activeTag} onclick={() => { activeFolder = null; activeTag = null; activeFolderId = null; activeTagId = null; mobileSidebarOpen = false; loadItems(); }}>
|
<button class="pill" class:active={!activeFolder && !activeTag} onclick={() => { activeFolder = null; activeTag = null; activeFolderId = null; activeTagId = null; loadItems(); }}>
|
||||||
All
|
All
|
||||||
</button>
|
</button>
|
||||||
{#each sidebarFolders.filter(f => f.is_active) as folder}
|
{#each sidebarFolders.filter(f => f.is_active) as folder}
|
||||||
@@ -451,6 +451,13 @@
|
|||||||
{#if folder.item_count > 0}<span class="pill-count">{folder.item_count}</span>{/if}
|
{#if folder.item_count > 0}<span class="pill-count">{folder.item_count}</span>{/if}
|
||||||
</button>
|
</button>
|
||||||
{/each}
|
{/each}
|
||||||
|
<span class="pill-separator"></span>
|
||||||
|
{#each sidebarTags.filter(t => t.is_active && t.item_count > 0) as tag}
|
||||||
|
<button class="pill pill-tag" class:active={activeTag === tag.name} onclick={() => { activeTag = tag.name; activeTagId = tag.id; activeFolder = null; activeFolderId = null; loadItems(); }}>
|
||||||
|
#{tag.name}
|
||||||
|
<span class="pill-count">{tag.item_count}</span>
|
||||||
|
</button>
|
||||||
|
{/each}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- Active filter indicator -->
|
<!-- Active filter indicator -->
|
||||||
@@ -921,6 +928,11 @@
|
|||||||
font-size: 0.65rem; font-family: var(--mono); color: #8c7b69;
|
font-size: 0.65rem; font-family: var(--mono); color: #8c7b69;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.pill-separator {
|
||||||
|
width: 1px; height: 20px; background: rgba(35,26,17,0.12); flex-shrink: 0; align-self: center;
|
||||||
|
}
|
||||||
|
.pill-tag { color: #7d6f61; font-style: italic; }
|
||||||
|
|
||||||
.nav-dot {
|
.nav-dot {
|
||||||
width: 7px; height: 7px; border-radius: 50%; flex-shrink: 0;
|
width: 7px; height: 7px; border-radius: 50%; flex-shrink: 0;
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user