cloud/music_library
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Standardize all icon-based actions to buttons

Browse Source 
Use a combination of ghost and soft, with button groups where
appropriate. Also remove unnecessary negative margins, and pad around
for ease of use on mobile.
This commit is contained in:
Claudio Ortolina
2025-10-17 20:02:04 +01:00
parent 8d01980c87
commit f4727bdcbd
14 changed files with 279 additions and 255 deletions
Download Patch File Download Diff File Expand all files Collapse all files
lib/music_library_web/live/stats_live/index.html.heex
+25 -21
View File
@@ -137,7 +137,7 @@
<.tooltip>
<.icon
name="hero-information-circle"
class="-mt-1 h-5 w-5 text-zinc-500 dark:text-zinc-400 cursor-pointer"
class="h-5 w-5 text-zinc-500 dark:text-zinc-400 cursor-pointer"
aria-hidden="true"
data-slot="icon"
/>
@@ -163,7 +163,7 @@
</span>
<.icon
name="hero-clipboard-document"
class="-mt-1 h-5 w-5"
class="h-5 w-5"
aria-hidden="true"
data-slot="icon"
/>
@@ -190,7 +190,7 @@
</span>
<.icon
name="hero-clipboard-document"
class="-mt-1 h-5 w-5"
class="h-5 w-5"
aria-hidden="true"
data-slot="icon"
/>
@@ -235,13 +235,15 @@
placement="bottom-end"
>
<:toggle>
<span class="sr-only">{gettext("Choose which format to import")}</span>
<.icon
name="hero-star"
class="-mt-1 h-5 w-5 text-zinc-500 dark:text-zinc-400 cursor-pointer"
aria-hidden="true"
data-slot="icon"
/>
<.button variant="ghost">
<span class="sr-only">{gettext("Choose which format to import")}</span>
<.icon
name="hero-star"
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-#{album.scrobbled_at_uts}-albums-focus-wrap"}>
<.dropdown_link
@@ -326,7 +328,7 @@
<.tooltip>
<.icon
name="hero-information-circle"
class="-mt-1 h-5 w-5 text-zinc-500 dark:text-zinc-400 cursor-pointer"
class="h-5 w-5 text-zinc-500 dark:text-zinc-400 cursor-pointer"
aria-hidden="true"
data-slot="icon"
/>
@@ -352,7 +354,7 @@
</span>
<.icon
name="hero-clipboard-document"
class="-mt-1 h-5 w-5"
class="h-5 w-5"
aria-hidden="true"
data-slot="icon"
/>
@@ -379,7 +381,7 @@
</span>
<.icon
name="hero-clipboard-document"
class="-mt-1 h-5 w-5"
class="h-5 w-5"
aria-hidden="true"
data-slot="icon"
/>
@@ -406,7 +408,7 @@
</span>
<.icon
name="hero-clipboard-document"
class="-mt-1 h-5 w-5"
class="h-5 w-5"
aria-hidden="true"
data-slot="icon"
/>
@@ -446,13 +448,15 @@
placement="bottom-end"
>
<:toggle>
<span class="sr-only">{gettext("Choose which format to import")}</span>
<.icon
name="hero-star"
class="-mt-1 h-5 w-5 text-zinc-500 dark:text-zinc-400 cursor-pointer"
aria-hidden="true"
data-slot="icon"
/>
<.button variant="ghost">
<span class="sr-only">{gettext("Choose which format to import")}</span>
<.icon
name="hero-star"
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-#{track.scrobbled_at_uts}-tracks-focus-wrap"}>
<.dropdown_link