From 53af201734f702c66e507d16872c353263752ae8 Mon Sep 17 00:00:00 2001 From: Gemini Agent Date: Tue, 12 May 2026 06:13:28 +0000 Subject: [PATCH] Fix image scaling in Lager grid - The images were stuck at 30x30px due to an '!important' rule in the global style.css. - Overrode the rule in manage_packing_list_items.php to let images scale to 100px. - Made the grid cards smaller and squarish again (140px min-width) as requested. --- src/manage_packing_list_items.php | 14 ++++++++++---- 1 file changed, 10 insertions(+), 4 deletions(-) diff --git a/src/manage_packing_list_items.php b/src/manage_packing_list_items.php index c8a1ebb..9d75b36 100644 --- a/src/manage_packing_list_items.php +++ b/src/manage_packing_list_items.php @@ -151,7 +151,7 @@ $conn->close(); /* Lager Grid */ .lager-grid { display: grid; - grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); + grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 12px; padding: 5px; } .lager-card { @@ -161,11 +161,17 @@ $conn->close(); } .lager-card:hover { transform: translateY(-2px); box-shadow: 0 4px 8px rgba(0,0,0,0.05); } .lager-img-wrapper { - height: 220px; margin-bottom: 8px; display: flex; + height: 100px; margin-bottom: 8px; display: flex; align-items: center; justify-content: center; } - .lager-img-wrapper img { - max-height: 100%; max-width: 100%; object-fit: contain; border-radius: 4px; cursor: pointer; + .lager-img-wrapper img.article-image-trigger { + width: auto !important; + height: 100% !important; + max-width: 100%; + max-height: 100px; + object-fit: contain; + border-radius: 4px; + cursor: pointer; } .lager-title { font-size: 0.85em; font-weight: 600; margin-bottom: 4px;