zzstoatzz.io / plyr.fm
audio streaming app plyr.fm
38
fork

Configure Feed

Select the types of activity you want to include in your feed.

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

nate nowack
Claude Opus 4.5 and committed by
GitHub 8c2cf0cc 3af4e1ec

+28 -6
+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