Use dropdown for "more" link in the nav

This commit is contained in:
Claudio Ortolina
2025-05-14 08:09:14 +01:00
parent 0de4746069
commit ddca7be870
4 changed files with 53 additions and 36 deletions
@@ -22,6 +22,10 @@ defmodule MusicLibraryWeb.CoreComponents do
defdelegate badge(assigns), to: Fluxon.Components.Badge defdelegate badge(assigns), to: Fluxon.Components.Badge
defdelegate button(assigns), to: Fluxon.Components.Button defdelegate button(assigns), to: Fluxon.Components.Button
defdelegate date_time_picker(assigns), to: Fluxon.Components.DatePicker defdelegate date_time_picker(assigns), to: Fluxon.Components.DatePicker
defdelegate dropdown(assigns), to: Fluxon.Components.Dropdown
defdelegate dropdown_button(assigns), to: Fluxon.Components.Dropdown
defdelegate dropdown_link(assigns), to: Fluxon.Components.Dropdown
defdelegate dropdown_separator(assigns), to: Fluxon.Components.Dropdown
defdelegate input(assigns), to: Fluxon.Components.Input defdelegate input(assigns), to: Fluxon.Components.Input
defdelegate label(assigns), to: Fluxon.Components.Form defdelegate label(assigns), to: Fluxon.Components.Form
defdelegate loading(assigns), to: Fluxon.Components.Loading defdelegate loading(assigns), to: Fluxon.Components.Loading
@@ -39,42 +39,45 @@
</.link> </.link>
</div> </div>
</div> </div>
<div class="flex space-x-2 md:space-x-4"> <div class="flex space-x-2 md:space-x-4 items-center">
<a class={["max-sm:hidden" | nav_link_classes()]} } href={~p"/dev/dashboard"}> <.dropdown label={gettext("More")}>
<.icon name="hero-chart-bar" class="h-4 w-4 mr-2" aria-hidden="true" data-slot="icon" /> <.dropdown_link href={~p"/dev/dashboard"}>
{gettext("Live Dashboard")} <.icon name="hero-chart-bar" class="h-4 w-4 mr-2" aria-hidden="true" data-slot="icon" />
</a> {gettext("Live Dashboard")}
<a class={["max-sm:hidden" | nav_link_classes()]} } href={~p"/dev/errors"}> </.dropdown_link>
<.icon <.dropdown_link href={~p"/dev/errors"}>
name="hero-exclamation-circle" <.icon
class="h-4 w-4 mr-2" name="hero-exclamation-circle"
aria-hidden="true" class="h-4 w-4 mr-2"
data-slot="icon" aria-hidden="true"
/> data-slot="icon"
{gettext("Errors")} />
</a> {gettext("Errors")}
<a class={["max-sm:hidden" | nav_link_classes()]} } href={~p"/dev/oban"}> </.dropdown_link>
<.icon name="hero-cog" class="h-4 w-4 mr-2" aria-hidden="true" data-slot="icon" /> <.dropdown_link href={~p"/dev/oban"}>
{gettext("Oban")} <.icon name="hero-cog" class="h-4 w-4 mr-2" aria-hidden="true" data-slot="icon" />
</a> {gettext("Oban")}
<a class={["max-sm:hidden" | nav_link_classes()]} } href={~p"/backup"}> </.dropdown_link>
<.icon <.dropdown_link href={~p"/backup"}>
name="hero-archive-box-arrow-down" <.icon
class="h-4 w-4 mr-2" name="hero-archive-box-arrow-down"
aria-hidden="true" class="h-4 w-4 mr-2"
data-slot="icon" aria-hidden="true"
/> data-slot="icon"
{gettext("Backup")} />
</a> {gettext("Backup")}
<a class={nav_link_classes()} } href={~p"/login"}> </.dropdown_link>
<.icon <.dropdown_separator />
name="hero-arrow-left-start-on-rectangle" <.dropdown_link href={~p"/login"}>
class="h-4 w-4 mr-2" <.icon
aria-hidden="true" name="hero-arrow-left-start-on-rectangle"
data-slot="icon" class="h-4 w-4 mr-2"
/> aria-hidden="true"
{gettext("Logout")} data-slot="icon"
</a> />
{gettext("Logout")}
</.dropdown_link>
</.dropdown>
</div> </div>
</div> </div>
</div> </div>
+5
View File
@@ -815,3 +815,8 @@ msgstr ""
#, elixir-autogen, elixir-format #, elixir-autogen, elixir-format
msgid "Warning!" msgid "Warning!"
msgstr "" msgstr ""
#: lib/music_library_web/components/layouts/app.html.heex
#, elixir-autogen, elixir-format
msgid "More"
msgstr ""
+5
View File
@@ -815,3 +815,8 @@ msgstr ""
#, elixir-autogen, elixir-format #, elixir-autogen, elixir-format
msgid "Warning!" msgid "Warning!"
msgstr "" msgstr ""
#: lib/music_library_web/components/layouts/app.html.heex
#, elixir-autogen, elixir-format
msgid "More"
msgstr ""