Fix shadows on hover and cursor in similar records

This commit is contained in:
Claudio Ortolina
2025-12-15 09:46:26 +03:00
parent c5a77fd742
commit b72555f09c
@@ -443,17 +443,19 @@ defmodule MusicLibraryWeb.RecordComponents do
> >
<li <li
:for={%{record: record, similarity: similarity} <- @similar_records} :for={%{record: record, similarity: similarity} <- @similar_records}
class="relative" class="relative cursor-pointer"
phx-click={JS.navigate(@record_show_path.(record))} phx-click={JS.navigate(@record_show_path.(record))}
> >
<.record_cover <div class="group">
record={record} <.record_cover
class="aspect-square object-cover rounded-lg hover:shadow-lg/20" record={record}
width={300} class="aspect-square object-cover rounded-lg group-hover:shadow-lg/20"
/> width={300}
<span class="absolute top-2 right-2 rounded-full px-2 py-0.5 text-xs font-medium bg-zinc-900/75 text-white backdrop-blur-sm"> />
{Float.round(100 - similarity * 100, 0)}% <span class="absolute top-2 right-2 rounded-full px-2 py-0.5 text-xs font-medium bg-zinc-900/75 text-white backdrop-blur-sm">
</span> {Float.round(100 - similarity * 100, 0)}%
</span>
</div>
<p class="pointer-events-none mt-2 block truncate text-sm font-medium text-zinc-900 dark:text-zinc-300"> <p class="pointer-events-none mt-2 block truncate text-sm font-medium text-zinc-900 dark:text-zinc-300">
{record.title} {record.title}