From 900ae8dde31d797ec21e8c46d878ade726e95a61 Mon Sep 17 00:00:00 2001
From: Bill Thornton <billt2006@gmail.com>
Date: Fri, 18 Dec 2020 13:19:44 -0500
Subject: [PATCH] Tweak max-height of square primary images

---
 src/assets/css/librarybrowser.css    | 4 ++++
 src/controllers/itemDetails/index.js | 3 +++
 2 files changed, 7 insertions(+)

diff --git a/src/assets/css/librarybrowser.css b/src/assets/css/librarybrowser.css
index ac04bbd955..5352468c2b 100644
--- a/src/assets/css/librarybrowser.css
+++ b/src/assets/css/librarybrowser.css
@@ -261,6 +261,10 @@
     max-height: 50vh;
 }
 
+.primaryImageWrapper > img.aspect-square {
+    max-height: 45vh;
+}
+
 .layout-mobile .primaryImageWrapper {
     display: block;
     flex: 1 0 auto;
diff --git a/src/controllers/itemDetails/index.js b/src/controllers/itemDetails/index.js
index b0e6bc4a33..a32e63e7eb 100644
--- a/src/controllers/itemDetails/index.js
+++ b/src/controllers/itemDetails/index.js
@@ -600,6 +600,9 @@ function renderPrimaryImage(page, item, apiClient) {
         const imageElem = page.querySelector('#primaryImage');
         imageElem.src = imageUrl;
         imageElem.alt = item.Name;
+        if (item.PrimaryImageAspectRatio === 1) {
+            imageElem.classList.add('aspect-square');
+        }
         page.querySelector('.primaryImageWrapper')?.classList.remove('hide');
     }
 }