feat: add feed/library toggle for consistent header layout (#692)

* feat: add feed/library toggle to maintain consistent header items

When on library page, shows "feed" button to go home.
When not on library, shows "library" button.
This keeps the same number of nav items regardless of page,
preventing layout shifts from space-between redistribution.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

* fix: include liked and playlist pages in collection check

Shows feed button on /library, /liked, and /playlist/* pages.
Shows library button everywhere else.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

* fix: show feed/library buttons independently

- Feed button: shows when not on homepage
- Library button: shows when not on /library
- Both can show at the same time, space-between handles it

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

---------

Co-authored-by: Claude Opus 4.5 <noreply@anthropic.com>

authored by zzstoatzz.io Claude Opus 4.5 and committed by GitHub 8c2cf0cc 3af4e1ec

Changed files
+28 -6
frontend
src
lib
components
+28 -6
frontend/src/lib/components/Header.svelte
··· 68 68 </button> 69 69 70 70 {#if isAuthenticated} 71 + {#if $page.url.pathname !== '/'} 72 + <a href="/" class="nav-link" title="feed"> 73 + <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"> 74 + <circle cx="12" cy="12" r="10"></circle> 75 + <line x1="2" y1="12" x2="22" y2="12"></line> 76 + <path d="M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z"></path> 77 + </svg> 78 + <span>feed</span> 79 + </a> 80 + {/if} 81 + 71 82 {#if !$page.url.pathname.startsWith('/library')} 72 83 <a href="/library" class="nav-link" title="library"> 73 84 <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"> ··· 111 122 <line x1="21" y1="21" x2="16.65" y2="16.65"></line> 112 123 </svg> 113 124 </button> 114 - {#if isAuthenticated && !$page.url.pathname.startsWith('/library')} 115 - <a href="/library" class="nav-icon" title="library"> 116 - <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"> 117 - <path d="M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78l1.06 1.06L12 21.23l7.78-7.78 1.06-1.06a5.5 5.5 0 0 0 0-7.78z"></path> 118 - </svg> 119 - </a> 125 + {#if isAuthenticated} 126 + {#if $page.url.pathname !== '/'} 127 + <a href="/" class="nav-icon" title="feed"> 128 + <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"> 129 + <circle cx="12" cy="12" r="10"></circle> 130 + <line x1="2" y1="12" x2="22" y2="12"></line> 131 + <path d="M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z"></path> 132 + </svg> 133 + </a> 134 + {/if} 135 + {#if !$page.url.pathname.startsWith('/library')} 136 + <a href="/library" class="nav-icon" title="library"> 137 + <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"> 138 + <path d="M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78l1.06 1.06L12 21.23l7.78-7.78 1.06-1.06a5.5 5.5 0 0 0 0-7.78z"></path> 139 + </svg> 140 + </a> 141 + {/if} 120 142 {/if} 121 143 </div> 122 144