Refactor latest purchase markup

Simpler markup, no weird positioning
This commit is contained in:
Claudio Ortolina
2025-09-02 12:34:27 +03:00
parent 41600df226
commit ad335961f8
@@ -14,21 +14,21 @@ defmodule MusicLibraryWeb.StatsComponents do
~H""" ~H"""
<div <div
class={[ class={[
"relative overflow-hidden rounded-md bg-white dark:bg-zinc-800 px-4 pb-5 pt-5 shadow-sm sm:px-6 sm:pt-6 cursor-pointer", "flex items-center rounded-md bg-white dark:bg-zinc-800 px-4 pb-5 pt-5 shadow-sm sm:px-6 sm:pt-6 cursor-pointer",
@class @class
]} ]}
phx-click={JS.navigate(~p"/collection/#{@record}")} phx-click={JS.navigate(~p"/collection/#{@record}")}
> >
<dt> <div>
<.record_cover <.record_cover
record={@record} record={@record}
class="absolute aspect-square size-16 md:size-20 rounded-md shadow-sm" class="w-16 md:w-20 rounded-md shadow-sm"
/> />
<p class="ml-20 md:ml-24 truncate text-xs sm:text-sm font-medium text-zinc-500 dark:text-zinc-400"> </div>
<div class="ml-4">
<p class="truncate text-xs sm:text-sm font-medium text-zinc-500 dark:text-zinc-400">
{@title} {@title}
</p> </p>
</dt>
<dd class="ml-20 md:ml-24 mt-2 flex items-baseline">
<p class="font-semibold"> <p class="font-semibold">
<span class="text-sm md:text-base lg:text-2xl block text-zinc-900 dark:text-zinc-300"> <span class="text-sm md:text-base lg:text-2xl block text-zinc-900 dark:text-zinc-300">
{@record.title} {@record.title}
@@ -41,7 +41,7 @@ defmodule MusicLibraryWeb.StatsComponents do
{artist.name} {artist.name}
</.link> </.link>
</p> </p>
</dd> </div>
</div> </div>
""" """
end end