Files
Claudio Ortolina db7e50d68b Move flash messages to the left
As the application makes heavy use of right-hand sheets, flash messages
are often lost.
2026-05-03 08:52:26 +01:00

165 lines
5.7 KiB
Plaintext

<div
:if={assigns[:static_changed]}
class="border-b border-yellow-300 bg-yellow-100 px-4 py-2 text-center text-sm text-yellow-700 dark:border-yellow-700 dark:bg-yellow-900 dark:text-yellow-200"
>
{gettext("The application has been updated.")}
<a href="" onclick="window.location.reload()" class="font-medium underline">
{gettext("Reload")}
</a>
</div>
<nav class="border-b border-slate-900/10 dark:border-slate-300/10" aria-label="Sections">
<div class="mx-auto max-w-screen-2xl px-4 sm:px-6 lg:px-8 2xl:px-0">
<div class="flex h-16 justify-between">
<div class="flex">
<div class="flex space-x-2 md:space-x-4">
<.nav_link route={~p"/"} section={:stats} current_section={@current_section}>
<.icon
name="hero-chart-pie"
class="mr-2 size-4 max-sm:hidden"
aria-hidden="true"
data-slot="icon"
/>
{gettext("Stats")}
</.nav_link>
<.nav_link
route={~p"/collection"}
section={:collection}
current_section={@current_section}
>
<.icon
name="hero-circle-stack"
class="mr-2 size-4 max-sm:hidden"
aria-hidden="true"
data-slot="icon"
/>
{gettext("Collection")}
</.nav_link>
<.nav_link route={~p"/wishlist"} section={:wishlist} current_section={@current_section}>
<.icon
name="hero-star"
class="mr-2 size-4 max-sm:hidden"
aria-hidden="true"
data-slot="icon"
/>
{gettext("Wishlist")}
</.nav_link>
<.nav_link
route={~p"/record-sets"}
section={:record_sets}
current_section={@current_section}
>
<.icon
name="hero-rectangle-stack"
class="mr-2 size-4 max-sm:hidden"
aria-hidden="true"
data-slot="icon"
/>
{gettext("Sets")}
</.nav_link>
</div>
</div>
<div class="flex items-center">
<.button_group>
<.universal_search_trigger />
<.dropdown placement="bottom-end" class="pl-0">
<:toggle>
<.button variant="soft">
<span class="sr-only">{gettext("Actions")}</span>
<.icon
name="hero-ellipsis-vertical"
class="icon cursor-pointer text-zinc-500 dark:text-zinc-400"
aria-hidden="true"
data-slot="icon"
/>
</.button>
</:toggle>
<.dropdown_nav
current_section={@current_section}
section={:scrobble}
route={~p"/scrobble"}
icon="hero-play"
>
{gettext("Scrobble Anything")}
</.dropdown_nav>
<.dropdown_nav
current_section={@current_section}
section={:scrobble_activity}
route={~p"/scrobbled-tracks"}
icon="hero-musical-note"
>
{gettext("Scrobbled Tracks")}
</.dropdown_nav>
<.dropdown_nav
current_section={@current_section}
section={:scrobble_rules}
route={~p"/scrobble-rules"}
icon="hero-adjustments-horizontal"
>
{gettext("Scrobble Rules")}
</.dropdown_nav>
<.dropdown_nav
current_section={@current_section}
section={:online_store_templates}
route={~p"/online-store-templates"}
icon="hero-building-storefront"
>
{gettext("Online Store Templates")}
</.dropdown_nav>
<.dropdown_nav
current_section={@current_section}
section={:maintenance}
route={~p"/maintenance"}
icon="hero-wrench-screwdriver"
>
{gettext("Maintenance")}
</.dropdown_nav>
<.dropdown_separator />
<.dropdown_link href={~p"/dev/dashboard"}>
<.icon
name="hero-chart-bar"
class="mr-2 size-4"
aria-hidden="true"
data-slot="icon"
/>
{gettext("Live Dashboard")}
</.dropdown_link>
<.dropdown_link href={~p"/dev/oban"}>
<.icon name="hero-cog" class="mr-2 size-4" aria-hidden="true" data-slot="icon" />
{gettext("Oban")}
</.dropdown_link>
<.dropdown_link href={~p"/dev/errors"}>
<.icon name="hero-bug-ant" class="mr-2 size-4" aria-hidden="true" data-slot="icon" />
{gettext("Errors")}
</.dropdown_link>
<.dropdown_separator />
<.dropdown_link href={~p"/login"}>
<.icon
name="hero-arrow-left-start-on-rectangle"
class="mr-2 size-4"
aria-hidden="true"
data-slot="icon"
/>
{gettext("Logout")}
</.dropdown_link>
</.dropdown>
</.button_group>
</div>
</div>
</div>
</nav>
<main class="p-4 sm:px-6 lg:px-8">
<div class="mx-auto max-w-screen-2xl">
<LiveToast.toast_group
flash={@flash}
kinds={[:error, :warning, :info]}
corner={:top_left}
connected={assigns[:socket] != nil}
toasts_sync={assigns[:toasts_sync]}
toast_class_fn={&toast_class_fn/1}
/>
{render_slot(@inner_block)}
</div>
</main>
<.live_component module={MusicLibraryWeb.UniversalSearchLive.Index} id="universal-search" />