From 27a83da463ad8a2bfccbbd13022e767556e5a29c Mon Sep 17 00:00:00 2001
From: Mike Colagrosso <colagrosso@users.noreply.github.com>
Date: Sun, 15 Dec 2024 15:22:09 -0700
Subject: [PATCH] Make placeholder outlines responsive

---
 www/css/core.css | 13 +++++++++++--
 1 file changed, 11 insertions(+), 2 deletions(-)

diff --git a/www/css/core.css b/www/css/core.css
index 7bfa3a93..454ea016 100644
--- a/www/css/core.css
+++ b/www/css/core.css
@@ -1576,12 +1576,21 @@ ol.ebooks-list > li p.author a{
 	justify-content: center;
 }
 
+ol.ebooks-list > li .thumbnail-container > a:has(.placeholder-cover){
+	max-width: 224px;
+	width: 100%; /* for responsive placeholder width */
+}
+
+ol.ebooks-list.list > li .thumbnail-container > a:has(.placeholder-cover){
+	width: auto; /* center the placeholder above the title in narrow list view */
+}
+
 .placeholder-cover{
+	aspect-ratio: 224 / 335;
 	background-color: transparent;
 	border-radius: .25rem;
 	border: 2px dashed var(--sub-text);
-	height: 331px;
-	width: 221px;
+	box-sizing: border-box;
 }
 
 ol.ebooks-list.list .placeholder-cover{