From 0c41d29c3405f6790fed15f95714fc2db3e76797 Mon Sep 17 00:00:00 2001
From: Bill Thornton <billt2006@gmail.com>
Date: Fri, 13 Aug 2021 10:09:36 -0400
Subject: [PATCH] Fix tv layout

---
 src/assets/css/librarybrowser.scss | 13 ++++++-------
 1 file changed, 6 insertions(+), 7 deletions(-)

diff --git a/src/assets/css/librarybrowser.scss b/src/assets/css/librarybrowser.scss
index 0bfac6d5ad..11aa27b008 100644
--- a/src/assets/css/librarybrowser.scss
+++ b/src/assets/css/librarybrowser.scss
@@ -624,8 +624,6 @@
 
 .layout-tv #itemDetailPage:not(.noBackdrop) .detailPagePrimaryContainer,
 .layout-desktop #itemDetailPage:not(.noBackdrop) .detailPagePrimaryContainer {
-    position: relative;
-    top: 0;
     padding-left: 32.45vw;
 }
 
@@ -679,7 +677,9 @@
 }
 
 .detailImageContainer .card {
-    position: absolute;
+    // important is needed here to override :focus setting
+    // the position to relative in the tv layout
+    position: absolute !important;
     top: 20%;
     max-width: 25vw;
     max-height: 80vh;
@@ -701,6 +701,7 @@
         left: 5%;
         bottom: 1rem;
         max-width: 30vw;
+        padding-left: 5%;
 
         @media all and (max-width: 32em) {
             left: 0;
@@ -715,15 +716,13 @@
     }
 
     .layout-tv & {
+        left: 5%;
+        width: 25vw;
         top: 50%;
         transform: translateY(-50%);
     }
 }
 
-.layout-mobile .detailImageContainer {
-    padding-left: 5%;
-}
-
 .layout-desktop .noBackdrop .detailImageContainer,
 .layout-tv .noBackdrop .detailImageContainer {
     margin-top: 0;