mirror of
https://github.com/svemagie/indiekit-endpoint-microsub.git
synced 2026-04-02 15:35:00 +02:00
Three reader views accessible via icon toolbar: - Channels: existing view (renamed), per-channel timelines - Deck: TweetDeck-style configurable columns with compact cards - Timeline: all channels merged chronologically with colored borders Includes channel color palette, cross-channel query, deck config storage, session-based view preference, and view switcher partial.
26 lines
1.5 KiB
Plaintext
26 lines
1.5 KiB
Plaintext
{# View mode switcher - icon toolbar #}
|
|
<nav class="view-switcher" aria-label="View mode">
|
|
<a href="{{ readerBaseUrl }}/channels"
|
|
class="view-switcher__button{% if activeView === 'channels' %} view-switcher__button--active{% endif %}"
|
|
title="Channels">
|
|
<svg viewBox="0 0 24 24" width="20" height="20" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
<line x1="8" y1="6" x2="21" y2="6"/><line x1="8" y1="12" x2="21" y2="12"/><line x1="8" y1="18" x2="21" y2="18"/>
|
|
<line x1="3" y1="6" x2="3.01" y2="6"/><line x1="3" y1="12" x2="3.01" y2="12"/><line x1="3" y1="18" x2="3.01" y2="18"/>
|
|
</svg>
|
|
</a>
|
|
<a href="{{ readerBaseUrl }}/deck"
|
|
class="view-switcher__button{% if activeView === 'deck' %} view-switcher__button--active{% endif %}"
|
|
title="Deck">
|
|
<svg viewBox="0 0 24 24" width="20" height="20" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
<rect x="3" y="3" width="7" height="18" rx="1"/><rect x="14" y="3" width="7" height="18" rx="1"/>
|
|
</svg>
|
|
</a>
|
|
<a href="{{ readerBaseUrl }}/timeline"
|
|
class="view-switcher__button{% if activeView === 'timeline' %} view-switcher__button--active{% endif %}"
|
|
title="Timeline">
|
|
<svg viewBox="0 0 24 24" width="20" height="20" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
<line x1="12" y1="2" x2="12" y2="22"/><polyline points="19 15 12 22 5 15"/>
|
|
</svg>
|
|
</a>
|
|
</nav>
|