From eb8284fdd2b10754ef37ae1eb6e2419232587dd5 Mon Sep 17 00:00:00 2001
From: "Adrian A. Baumann" <ade@adebaumann.com>
Date: Mon, 29 Dec 2025 20:11:25 +0100
Subject: [PATCH] Thing detail template adjusted

---
 argocd/deployment.yaml                  | 2 +-
 boxes/templates/boxes/thing_detail.html | 6 +++---
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/argocd/deployment.yaml b/argocd/deployment.yaml
index d931d6a..5678422 100644
--- a/argocd/deployment.yaml
+++ b/argocd/deployment.yaml
@@ -27,7 +27,7 @@ spec:
               mountPath: /data
       containers:
         - name: web
-          image: git.baumann.gr/adebaumann/labhelper:0.033
+          image: git.baumann.gr/adebaumann/labhelper:0.034
           imagePullPolicy: Always
           ports:
             - containerPort: 8000
diff --git a/boxes/templates/boxes/thing_detail.html b/boxes/templates/boxes/thing_detail.html
index 733a9ed..f3a2177 100644
--- a/boxes/templates/boxes/thing_detail.html
+++ b/boxes/templates/boxes/thing_detail.html
@@ -17,13 +17,13 @@
 {% block content %}
 <div class="section">
     <div class="thing-card" style="display: flex; gap: 40px; flex-wrap: wrap;">
-        <div class="thing-image" style="flex-shrink: 0;">
+        <div class="thing-image" style="flex-shrink: 0; width: 100%; max-width: 400px;">
             {% if thing.picture %}
             {% thumbnail thing.picture "400x400" crop="center" as thumb %}
-            <img src="{{ thumb.url }}" alt="{{ thing.name }}" style="max-width: 100%; width: 400px; height: 400px; object-fit: cover; border-radius: 12px; box-shadow: 0 8px 24px rgba(0,0,0,0.15);">
+            <img src="{{ thumb.url }}" alt="{{ thing.name }}" style="width: 100%; height: auto; max-height: 400px; object-fit: cover; border-radius: 12px; box-shadow: 0 8px 24px rgba(0,0,0,0.15);">
             {% endthumbnail %}
             {% else %}
-            <div style="max-width: 100%; width: 400px; height: 400px; background: linear-gradient(135deg, #e0e0e0 0%, #f0f0f0 100%); display: flex; align-items: center; justify-content: center; color: #999; border-radius: 12px; box-shadow: 0 8px 24px rgba(0,0,0,0.15);">
+            <div style="width: 100%; aspect-ratio: 1; max-width: 400px; max-height: 400px; background: linear-gradient(135deg, #e0e0e0 0%, #f0f0f0 100%); display: flex; align-items: center; justify-content: center; color: #999; border-radius: 12px; box-shadow: 0 8px 24px rgba(0,0,0,0.15);">
                 <div style="text-align: center;">
                     <i class="fas fa-image" style="font-size: 64px; margin-bottom: 15px; display: block;"></i>
                     No image