Make hover effect stand out more
This commit is contained in:
@@ -71,7 +71,7 @@ defmodule MusicLibraryWeb.Components.AddRecord do
|
||||
|
||||
defp result(assigns) do
|
||||
~H"""
|
||||
<li id={@id} class="flex justify-between gap-x-6 py-5 hover:bg-zinc-50 dark:hover:bg-zinc-700">
|
||||
<li id={@id} class="flex justify-between gap-x-6 py-5 hover:bg-zinc-100 dark:hover:bg-zinc-700">
|
||||
<div class="flex w-full shrink-0 items-center justify-between px-4">
|
||||
<img
|
||||
class="mr-4 w-20 flex-none rounded-lg"
|
||||
|
||||
@@ -156,7 +156,7 @@ defmodule MusicLibraryWeb.Components.Chat do
|
||||
phx-click="select_chat"
|
||||
phx-value-id={chat.id}
|
||||
phx-target={@myself}
|
||||
class="w-full rounded-lg p-3 text-left transition-colors hover:bg-zinc-50 dark:hover:bg-zinc-800"
|
||||
class="w-full rounded-lg p-3 text-left transition-colors hover:bg-zinc-100 dark:hover:bg-zinc-800"
|
||||
>
|
||||
<p class="truncate text-sm font-medium text-zinc-900 dark:text-zinc-100">
|
||||
{chat.topic || gettext("Untitled")}
|
||||
|
||||
@@ -85,7 +85,7 @@ defmodule MusicLibraryWeb.RecordComponents do
|
||||
<li
|
||||
:for={{id, record} <- @records}
|
||||
phx-click={JS.navigate(@record_show_path.(record))}
|
||||
class="-mx-2 flex cursor-pointer justify-between gap-x-6 px-2 py-5 hover:bg-zinc-50 md:-mx-4 md:px-4 dark:hover:bg-zinc-800"
|
||||
class="-mx-2 flex cursor-pointer justify-between gap-x-6 px-2 py-5 hover:bg-zinc-100 md:-mx-4 md:px-4 dark:hover:bg-zinc-800"
|
||||
id={id}
|
||||
>
|
||||
<div class="flex min-w-0 items-center gap-x-4">
|
||||
|
||||
@@ -27,7 +27,7 @@ defmodule MusicLibraryWeb.SearchComponents do
|
||||
<div
|
||||
class={[
|
||||
"cursor-pointer rounded-lg p-3 transition-colors",
|
||||
"hover:bg-zinc-50 dark:hover:bg-zinc-700",
|
||||
"hover:bg-zinc-100 dark:hover:bg-zinc-700",
|
||||
"aria-selected:bg-zinc-200 dark:aria-selected:bg-zinc-700"
|
||||
]}
|
||||
role="option"
|
||||
@@ -90,7 +90,7 @@ defmodule MusicLibraryWeb.SearchComponents do
|
||||
<div
|
||||
class={[
|
||||
"cursor-pointer rounded-lg p-3 transition-colors",
|
||||
"hover:bg-zinc-50 dark:hover:bg-zinc-700",
|
||||
"hover:bg-zinc-100 dark:hover:bg-zinc-700",
|
||||
"aria-selected:bg-zinc-200 dark:aria-selected:bg-zinc-700"
|
||||
]}
|
||||
role="option"
|
||||
@@ -133,7 +133,7 @@ defmodule MusicLibraryWeb.SearchComponents do
|
||||
<div
|
||||
class={[
|
||||
"cursor-pointer rounded-lg p-3 transition-colors",
|
||||
"hover:bg-zinc-50 dark:hover:bg-zinc-700",
|
||||
"hover:bg-zinc-100 dark:hover:bg-zinc-700",
|
||||
"aria-selected:bg-zinc-200 dark:aria-selected:bg-zinc-700"
|
||||
]}
|
||||
role="option"
|
||||
@@ -175,7 +175,7 @@ defmodule MusicLibraryWeb.SearchComponents do
|
||||
<div
|
||||
class={[
|
||||
"cursor-pointer rounded-lg p-3 transition-colors",
|
||||
"hover:bg-zinc-50 dark:hover:bg-zinc-700",
|
||||
"hover:bg-zinc-100 dark:hover:bg-zinc-700",
|
||||
"aria-selected:bg-zinc-200 dark:aria-selected:bg-zinc-700"
|
||||
]}
|
||||
role="option"
|
||||
|
||||
@@ -414,7 +414,7 @@ defmodule MusicLibraryWeb.RecordSetLive.Index do
|
||||
"border-2 border-dashed border-zinc-300 dark:border-zinc-600",
|
||||
"flex items-center justify-center rounded-lg",
|
||||
"hover:border-zinc-400 dark:hover:border-zinc-500",
|
||||
"hover:bg-zinc-50 dark:hover:bg-zinc-800",
|
||||
"hover:bg-zinc-100 dark:hover:bg-zinc-800",
|
||||
"cursor-pointer transition-colors"
|
||||
]}
|
||||
>
|
||||
|
||||
@@ -77,7 +77,7 @@ defmodule MusicLibraryWeb.RecordSetLive.RecordPicker do
|
||||
<li
|
||||
role="option"
|
||||
class={[
|
||||
"flex cursor-pointer items-center gap-3 rounded-lg px-2 py-3 hover:bg-zinc-50 dark:hover:bg-zinc-800",
|
||||
"flex cursor-pointer items-center gap-3 rounded-lg px-2 py-3 hover:bg-zinc-100 dark:hover:bg-zinc-800",
|
||||
"aria-selected:bg-zinc-100 dark:aria-selected:bg-zinc-700"
|
||||
]}
|
||||
phx-click="add_record"
|
||||
|
||||
@@ -148,7 +148,7 @@ defmodule MusicLibraryWeb.RecordSetLive.Show do
|
||||
"border-2 border-dashed border-zinc-300 dark:border-zinc-600",
|
||||
"flex items-center justify-center rounded-lg",
|
||||
"hover:border-zinc-400 dark:hover:border-zinc-500",
|
||||
"hover:bg-zinc-50 dark:hover:bg-zinc-800",
|
||||
"hover:bg-zinc-100 dark:hover:bg-zinc-800",
|
||||
"cursor-pointer transition-colors"
|
||||
]}
|
||||
>
|
||||
|
||||
@@ -33,7 +33,7 @@ defmodule MusicLibraryWeb.ScrobbleLive.Index do
|
||||
:for={release_group <- @search_results}
|
||||
phx-click="select_release_group"
|
||||
phx-value-release_group_id={release_group.id}
|
||||
class="flex cursor-pointer justify-between gap-x-6 py-5 hover:bg-zinc-50 dark:hover:bg-zinc-700"
|
||||
class="flex cursor-pointer justify-between gap-x-6 py-5 hover:bg-zinc-100 dark:hover:bg-zinc-700"
|
||||
>
|
||||
<div class="flex w-full shrink-0 items-center justify-between px-4">
|
||||
<img
|
||||
@@ -81,7 +81,7 @@ defmodule MusicLibraryWeb.ScrobbleLive.Index do
|
||||
<li :for={release <- @releases}>
|
||||
<.link
|
||||
navigate={~p"/scrobble/#{release.id}"}
|
||||
class="flex items-center gap-x-4 px-4 py-5 transition-colors hover:bg-zinc-50 dark:hover:bg-zinc-700"
|
||||
class="flex items-center gap-x-4 px-4 py-5 transition-colors hover:bg-zinc-100 dark:hover:bg-zinc-700"
|
||||
>
|
||||
<img
|
||||
class="w-20 flex-none rounded-lg"
|
||||
|
||||
@@ -108,7 +108,7 @@ defmodule MusicLibraryWeb.ScrobbledTracksLive.Index do
|
||||
}} <- @streams.tracks
|
||||
}
|
||||
id={id}
|
||||
class="-mx-2 flex cursor-pointer justify-between gap-x-6 px-2 py-5 hover:bg-zinc-50 md:-mx-4 md:px-4 dark:hover:bg-zinc-800"
|
||||
class="-mx-2 flex cursor-pointer justify-between gap-x-6 px-2 py-5 hover:bg-zinc-100 md:-mx-4 md:px-4 dark:hover:bg-zinc-800"
|
||||
>
|
||||
<div class="flex min-w-0 flex-1 items-center space-x-4">
|
||||
<div class="shrink-0">
|
||||
|
||||
@@ -26,7 +26,7 @@ defmodule MusicLibraryWeb.StatsLive.TopAlbums do
|
||||
class={[
|
||||
"flex items-center space-x-3 p-2",
|
||||
(album.collected_record_id || album.wishlisted_record_id) &&
|
||||
"cursor-pointer hover:bg-zinc-50 dark:hover:bg-zinc-700"
|
||||
"cursor-pointer hover:bg-zinc-100 dark:hover:bg-zinc-700"
|
||||
]}
|
||||
>
|
||||
<img
|
||||
|
||||
@@ -30,7 +30,7 @@ defmodule MusicLibraryWeb.StatsLive.TopArtists do
|
||||
class={[
|
||||
"flex items-center space-x-3 p-2",
|
||||
artist.musicbrainz_id != "" &&
|
||||
"cursor-pointer hover:bg-zinc-50 dark:hover:bg-zinc-700"
|
||||
"cursor-pointer hover:bg-zinc-100 dark:hover:bg-zinc-700"
|
||||
]}
|
||||
>
|
||||
<.artist_image
|
||||
|
||||
Reference in New Issue
Block a user