From d5238eb35c2c80217776f254aafd0cf21818cc32 Mon Sep 17 00:00:00 2001
From: Claudio Ortolina <cloud8421@gmail.com>
Date: Sat, 28 Feb 2026 09:55:47 +0000
Subject: [PATCH] Stabilize record detail layout

---
 lib/music_library_web/live/collection_live/show.ex | 6 +++---
 lib/music_library_web/live/wishlist_live/show.ex   | 6 +++---
 2 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/lib/music_library_web/live/collection_live/show.ex b/lib/music_library_web/live/collection_live/show.ex
index 4682c735..0199d0ef 100644
--- a/lib/music_library_web/live/collection_live/show.ex
+++ b/lib/music_library_web/live/collection_live/show.ex
@@ -27,15 +27,15 @@ defmodule MusicLibraryWeb.CollectionLive.Show do
   def render(assigns) do
     ~H"""
     <Layouts.app flash={@flash} current_section={@current_section} socket={@socket}>
-      <div class="md:flex mt-4 px-4 md:gap-x-4">
-        <div class="drop-shadow-sm md:max-w-152 lg:min-w-152">
+      <div class="lg:grid lg:grid-cols-2 xl:grid-cols-5 mt-4 px-4 md:gap-x-4">
+        <div class="drop-shadow-sm xl:col-span-2">
           <.record_cover
             record={@record}
             class="w-full rounded-lg drop-shadow-sm"
           />
         </div>
 
-        <div class="grow">
+        <div class="xl:col-span-3">
           <div class="mt-4 md:mt-0 flex justify-between items-center">
             <h1 class="text-base font-medium leading-6 text-zinc-700">
               <.artist_links joinphrase_class="text-sm" artists={@record.artists} />
diff --git a/lib/music_library_web/live/wishlist_live/show.ex b/lib/music_library_web/live/wishlist_live/show.ex
index f4e5c383..05c3366f 100644
--- a/lib/music_library_web/live/wishlist_live/show.ex
+++ b/lib/music_library_web/live/wishlist_live/show.ex
@@ -24,15 +24,15 @@ defmodule MusicLibraryWeb.WishlistLive.Show do
   def render(assigns) do
     ~H"""
     <Layouts.app flash={@flash} current_section={@current_section} socket={@socket}>
-      <div class="md:flex mt-4 px-4 md:gap-x-4">
-        <div class="drop-shadow-sm md:max-w-152 lg:min-w-152">
+      <div class="lg:grid lg:grid-cols-2 xl:grid-cols-5 mt-4 px-4 md:gap-x-4">
+        <div class="drop-shadow-sm xl:col-span-2">
           <.record_cover
             record={@record}
             class="w-full rounded-lg drop-shadow-sm"
           />
         </div>
 
-        <div class="grow">
+        <div class="xl:col-span-3">
           <div class="mt-4 md:mt-0 flex justify-between items-center">
             <h1 class="text-base font-medium leading-6 text-zinc-700">
               <.artist_links joinphrase_class="text-sm" artists={@record.artists} />