Make artist buttons consistent with record buttons

This commit is contained in:
Claudio Ortolina
2025-12-15 10:03:27 +03:00
parent a62e3809a4
commit df4d5ad02f
@@ -8,70 +8,74 @@
</h1>
<div class="flex items-center">
<button
class="text-xs md:text-sm text-zinc-700 dark:text-zinc-300"
phx-click={MusicLibraryWeb.Components.Notes.open("artist-notes-sheet")}
>
<span class="sr-only">{gettext("Open Notes")}</span>
<.icon
name="hero-pencil-square"
class="-mt-1 h-5 w-5"
aria-hidden="true"
data-slot="icon"
/>
</button>
<.dropdown id={"actions-#{@artist.musicbrainz_id}"} placement="bottom-end">
<:toggle>
<.button variant="ghost">
<span class="sr-only">{gettext("Actions")}</span>
<.icon
name="hero-ellipsis-vertical"
class="h-5 w-5 text-zinc-500 dark:text-zinc-400 cursor-pointer"
aria-hidden="true"
data-slot="icon"
/>
</.button>
</:toggle>
<.focus_wrap id={"actions-#{@artist.musicbrainz_id}-focus-wrap"}>
<.dropdown_link
id={"actions-#{@artist.musicbrainz_id}-edit"}
patch={~p"/artists/#{@artist.musicbrainz_id}/edit"}
>
<.icon
name="hero-pencil-square"
class="h-4 w-4 mr-1 phx-click-loading:animate-bounce"
aria-hidden="true"
data-slot="icon"
/>
{gettext("Edit")}
</.dropdown_link>
<.dropdown_link
id={"actions-#{@artist.musicbrainz_id}-refresh-image"}
phx-click={JS.push("refresh_artist_image", value: %{id: @artist.musicbrainz_id})}
>
<.icon
name="hero-photo"
class="h-4 w-4 mr-1 phx-click-loading:animate-bounce"
aria-hidden="true"
data-slot="icon"
/>
{gettext("Refresh image")}
</.dropdown_link>
<.button_group>
<.button
variant="soft"
phx-click={MusicLibraryWeb.Components.Notes.open("artist-notes-sheet")}
>
<span class="sr-only">{gettext("Open Notes")}</span>
<.icon
name="hero-pencil"
class="h-5 w-5"
aria-hidden="true"
data-slot="icon"
/>
</.button>
<.dropdown id={"actions-#{@artist.musicbrainz_id}"} placement="bottom-end">
<:toggle>
<.button variant="soft">
<span class="sr-only">{gettext("Actions")}</span>
<.icon
name="hero-ellipsis-vertical"
class="h-5 w-5 text-zinc-500 dark:text-zinc-400 cursor-pointer"
aria-hidden="true"
data-slot="icon"
/>
</.button>
</:toggle>
<.focus_wrap id={"actions-#{@artist.musicbrainz_id}-focus-wrap"}>
<.dropdown_link
id={"actions-#{@artist.musicbrainz_id}-edit"}
patch={~p"/artists/#{@artist.musicbrainz_id}/edit"}
>
<.icon
name="hero-pencil-square"
class="h-4 w-4 mr-1 phx-click-loading:animate-bounce"
aria-hidden="true"
data-slot="icon"
/>
{gettext("Edit")}
</.dropdown_link>
<.dropdown_link
id={"actions-#{@artist.musicbrainz_id}-refresh-image"}
phx-click={
JS.push("refresh_artist_image", value: %{id: @artist.musicbrainz_id})
}
>
<.icon
name="hero-photo"
class="h-4 w-4 mr-1 phx-click-loading:animate-bounce"
aria-hidden="true"
data-slot="icon"
/>
{gettext("Refresh image")}
</.dropdown_link>
<.dropdown_link
id={"actions-#{@artist.musicbrainz_id}-refresh-artist-info"}
phx-click={JS.push("refresh_artist_info", value: %{id: @artist.musicbrainz_id})}
>
<.icon
name="hero-arrow-path"
class="h-4 w-4 mr-1 phx-click-loading:animate-spin"
aria-hidden="true"
data-slot="icon"
/>
{gettext("Refresh info")}
</.dropdown_link>
</.focus_wrap>
</.dropdown>
<.dropdown_link
id={"actions-#{@artist.musicbrainz_id}-refresh-artist-info"}
phx-click={JS.push("refresh_artist_info", value: %{id: @artist.musicbrainz_id})}
>
<.icon
name="hero-arrow-path"
class="h-4 w-4 mr-1 phx-click-loading:animate-spin"
aria-hidden="true"
data-slot="icon"
/>
{gettext("Refresh info")}
</.dropdown_link>
</.focus_wrap>
</.dropdown>
</.button_group>
</div>
</div>