From c480e44e0ec0a3fbfd6b73de43e41c007b291376 Mon Sep 17 00:00:00 2001
From: edde746 <86283021+edde746@users.noreply.github.com>
Date: Wed, 25 Feb 2026 22:53:58 +0100
Subject: [PATCH] fix: skeleton card visibility and layout

---
 .../libraries/tabs/library_browse_tab.dart    | 48 +++++++++++--------
 lib/widgets/media_card.dart                   |  2 +-
 2 files changed, 30 insertions(+), 20 deletions(-)

diff --git a/lib/screens/libraries/tabs/library_browse_tab.dart b/lib/screens/libraries/tabs/library_browse_tab.dart
index b8321fcd..1dc6b04a 100644
--- a/lib/screens/libraries/tabs/library_browse_tab.dart
+++ b/lib/screens/libraries/tabs/library_browse_tab.dart
@@ -1257,26 +1257,36 @@ class _SkeletonCard extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    return Column(
-      crossAxisAlignment: CrossAxisAlignment.stretch,
-      children: [
-        // Poster area
-        const Expanded(child: SkeletonLoader()),
-        const SizedBox(height: 4),
-        // Title bar
-        const SkeletonLoader(
-          child: SizedBox(height: 10, width: double.infinity),
-        ),
-        const SizedBox(height: 3),
-        // Subtitle bar
-        const FractionallySizedBox(
-          alignment: Alignment.centerLeft,
-          widthFactor: 0.6,
-          child: SkeletonLoader(
-            child: SizedBox(height: 8, width: double.infinity),
+    return Padding(
+      padding: const EdgeInsets.all(8),
+      child: Column(
+        crossAxisAlignment: CrossAxisAlignment.start,
+        children: [
+          // Poster area — matches the Expanded poster in _buildGridCard
+          Expanded(
+            child: ClipRRect(
+              borderRadius: BorderRadius.circular(8),
+              child: const SkeletonLoader(child: SizedBox.expand()),
+            ),
           ),
-        ),
-      ],
+          const SizedBox(height: 4),
+          // Title bar
+          SkeletonLoader(
+            borderRadius: BorderRadius.circular(4),
+            child: const SizedBox(height: 13, width: double.infinity),
+          ),
+          const SizedBox(height: 3),
+          // Subtitle bar
+          FractionallySizedBox(
+            alignment: Alignment.centerLeft,
+            widthFactor: 0.6,
+            child: SkeletonLoader(
+              borderRadius: BorderRadius.circular(4),
+              child: const SizedBox(height: 11),
+            ),
+          ),
+        ],
+      ),
     );
   }
 }
diff --git a/lib/widgets/media_card.dart b/lib/widgets/media_card.dart
index d8a7df17..2b9eb2fb 100644
--- a/lib/widgets/media_card.dart
+++ b/lib/widgets/media_card.dart
@@ -828,7 +828,7 @@ class _SkeletonLoaderState extends State<SkeletonLoader> with SingleTickerProvid
           identifier: "skeleton-loader",
           child: Container(
             decoration: BoxDecoration(
-              color: Theme.of(context).colorScheme.surfaceContainerHighest.withValues(alpha: _animation.value),
+              color: Theme.of(context).colorScheme.onSurface.withValues(alpha: _animation.value * 0.15),
               borderRadius: widget.borderRadius ?? BorderRadius.circular(tokens(context).radiusSm),
             ),
             child: widget.child,