Fix Nostr icon and make algo filters responsive
- Replace broken shield SVG in auth modal Nostr login button with a proper key icon (matches Nostr's key-based identity) - Show algorithm filter buttons inline on xl+ screens (1280px+) where there's room for all of them - Collapse into "Algos" dropdown on md–xl screens to prevent overflow when the header is too narrow Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
@@ -13,8 +13,19 @@
|
||||
<button @click="handleFilmsClick" :class="isRoute('/') && !activeAlgorithm ? 'nav-button-active' : 'nav-button'">Films</button>
|
||||
<router-link to="/library" :class="isRoute('/library') && !activeAlgorithm ? 'nav-button-active' : 'nav-button'" @click="clearFilter">My List</router-link>
|
||||
|
||||
<!-- Algos Dropdown -->
|
||||
<div class="relative algos-dropdown">
|
||||
<!-- Inline Algorithm Buttons (xl+ screens where they fit) -->
|
||||
<button
|
||||
v-for="algo in algorithms"
|
||||
:key="'inline-' + algo.id"
|
||||
@click="handleAlgoSelect(algo.id)"
|
||||
:class="activeAlgorithm === algo.id ? 'nav-button-active' : 'nav-button'"
|
||||
class="hidden xl:inline-block"
|
||||
>
|
||||
{{ algo.label }}
|
||||
</button>
|
||||
|
||||
<!-- Algos Dropdown (md–xl screens where inline buttons would overflow) -->
|
||||
<div class="relative algos-dropdown xl:hidden">
|
||||
<button
|
||||
@click="toggleAlgosMenu"
|
||||
:class="activeAlgorithm ? 'nav-button-active' : 'nav-button'"
|
||||
@@ -29,7 +40,7 @@
|
||||
<div class="px-3 py-1 text-xs text-white/40 uppercase tracking-wider">Discovery Algorithms</div>
|
||||
<button
|
||||
v-for="algo in algorithms"
|
||||
:key="algo.id"
|
||||
:key="'dropdown-' + algo.id"
|
||||
@click="handleAlgoSelect(algo.id)"
|
||||
class="profile-menu-item flex items-center justify-between px-4 py-2.5 w-full text-left"
|
||||
>
|
||||
|
||||
Reference in New Issue
Block a user