Address Tailwind deprecations and renames

This commit is contained in:
Claudio Ortolina
2025-02-28 20:55:36 +00:00
parent d9e87d6c80
commit 545dd808b7
12 changed files with 35 additions and 31 deletions
@@ -71,7 +71,7 @@ defmodule MusicLibraryWeb.BarcodeScannerComponent do
|> JS.dispatch("camera_request", to: "#barcode-scanner")
|> JS.hide(to: "#camera-button")
}
class="relative block w-full h-96 rounded-lg border-2 border-dashed border-zinc-300 p-12 text-center hover:border-zinc-400 outline-none"
class="relative block w-full h-96 rounded-lg border-2 border-dashed border-zinc-300 p-12 text-center hover:border-zinc-400 outline-hidden"
>
<svg
class="mx-auto size-12 text-zinc-400"
@@ -51,7 +51,11 @@ defmodule MusicLibraryWeb.CoreComponents do
data-cancel={JS.exec(@on_cancel, "phx-remove")}
class="relative z-50 hidden"
>
<div id={"#{@id}-bg"} class="backdrop-blur fixed inset-0 transition-opacity" aria-hidden="true" />
<div
id={"#{@id}-bg"}
class="backdrop-blur-sm fixed inset-0 transition-opacity"
aria-hidden="true"
/>
<div
class="fixed inset-0 overflow-y-auto"
aria-labelledby={"#{@id}-title"}
@@ -322,7 +326,7 @@ defmodule MusicLibraryWeb.CoreComponents do
name={@name}
value="true"
checked={@checked}
class="rounded border-zinc-300 text-zinc-900 focus:ring-0"
class="rounded-sm border-zinc-300 text-zinc-900 focus:ring-0"
{@rest}
/>
{@label}
@@ -9,14 +9,14 @@ defmodule MusicLibraryWeb.DataComponents do
~H"""
<div
class={[
"relative overflow-hidden rounded-md bg-white dark:bg-zinc-800 px-4 pb-3 pt-5 shadow sm:px-6 sm:pt-6 cursor-pointer",
"relative overflow-hidden rounded-md bg-white dark:bg-zinc-800 px-4 pb-3 pt-5 shadow-sm sm:px-6 sm:pt-6 cursor-pointer",
@class
]}
phx-click={JS.navigate(~p"/collection/#{@record}")}
>
<dt>
<img
class="absolute w-20 rounded-md shadow"
class="absolute w-20 rounded-md shadow-sm"
src={~p"/covers/#{@record.id}?vsn=#{@record.cover_hash}"}
alt={@record.title}
/>
@@ -48,7 +48,7 @@ defmodule MusicLibraryWeb.DataComponents do
def counter(assigns) do
~H"""
<div class="overflow-hidden rounded-md bg-white dark:bg-zinc-800 px-4 pb-3 pt-5 shadow sm:px-6 sm:pt-6">
<div class="overflow-hidden rounded-md bg-white dark:bg-zinc-800 px-4 pb-3 pt-5 shadow-sm sm:px-6 sm:pt-6">
<dt class="sm:mt-3">
<p class="truncate text-sm font-medium text-center text-zinc-500 dark:text-zinc-400">
{@title}
@@ -98,7 +98,7 @@ defmodule MusicLibraryWeb.ImportComponent do
<.focus_wrap
id={"actions-#{@release_group.id}"}
class={[
"hidden pointer-events-auto absolute right-0 z-10 mt-2 w-48 origin-top-right rounded-md bg-white dark:bg-zinc-800 py-2 shadow-lg ring-1 ring-zinc-900/5 focus:outline-none"
"hidden pointer-events-auto absolute right-0 z-10 mt-2 w-48 origin-top-right rounded-md bg-white dark:bg-zinc-800 py-2 shadow-lg ring-1 ring-zinc-900/5 focus:outline-hidden"
]}
role="menu"
aria-orientation="vertical"
@@ -54,7 +54,7 @@ defmodule MusicLibraryWeb.Pagination do
</div>
<div class="hidden sm:flex sm:flex-1 sm:items-center sm:justify-items-center sm:justify-center">
<div>
<nav class="isolate inline-flex -space-x-px rounded-md shadow-sm" aria-label="Pagination">
<nav class="isolate inline-flex -space-x-px rounded-md shadow-xs" aria-label="Pagination">
<.prev_link
:if={@page_links.prev_page}
page_number={@page_links.prev_page}
@@ -124,7 +124,7 @@ defmodule MusicLibraryWeb.RecordComponents do
<.focus_wrap
id={"actions-#{record.id}"}
class={[
"hidden pointer-events-auto absolute right-0 z-10 mt-2 w-48 origin-top-right rounded-md bg-white dark:bg-zinc-800 py-2 shadow-lg ring-1 ring-zinc-900/5 focus:outline-none"
"hidden pointer-events-auto absolute right-0 z-10 mt-2 w-48 origin-top-right rounded-md bg-white dark:bg-zinc-800 py-2 shadow-lg ring-1 ring-zinc-900/5 focus:outline-hidden"
]}
role="menu"
aria-orientation="vertical"
@@ -241,7 +241,7 @@ defmodule MusicLibraryWeb.RecordComponents do
/>
<button
type="button"
class="absolute inset-0 focus:outline-none"
class="absolute inset-0 focus:outline-hidden"
phx-click={JS.navigate(@record_path.(record))}
>
<span class="sr-only">{gettext("View details")}</span>