From d34fc00078ef740d5b84389b463f251efe36bebf Mon Sep 17 00:00:00 2001
From: Hermes <hermes@kies-media.de>
Date: Sun, 14 Jun 2026 15:38:35 +0000
Subject: [PATCH] fix(issue-80): full-width floor plan images + styled room
 list + restored + icon

---
 app/views/home/index.php         | 15 ++++------
 public/css/haus-schleusingen.css | 51 +++++++++++++++++++++++++-------
 2 files changed, 47 insertions(+), 19 deletions(-)

diff --git a/app/views/home/index.php b/app/views/home/index.php
index c161315..08ae436 100644
--- a/app/views/home/index.php
+++ b/app/views/home/index.php
@@ -164,16 +164,15 @@ $gridItems = [
         <summary class="floor-header">
           <span class="floor-title"><?= htmlspecialchars($t($floor['titleKey']), ENT_QUOTES) ?></span>
           <span class="floor-area"><?= htmlspecialchars($t($floor['areaKey']), ENT_QUOTES) ?></span>
+          <span class="floor-icon" aria-hidden="true">+</span>
         </summary>
         <div class="floor-body">
           <?php
-            $primaryImg = $floorImageMap[$floor['id']] ?? 'bilder/grundrisse/EG.png';
-            $extra      = $floorImageMapExtra[$floor['id']] ?? null;
-            $imgWrapperClass = $extra ? 'floor-plan-multi' : '';
+            $primaryImg  = $floorImageMap[$floor['id']] ?? 'bilder/grundrisse/EG.png';
+            $extra       = $floorImageMapExtra[$floor['id']] ?? null;
+            $wrapperCls  = $extra ? 'floor-plan-multi' : 'floor-plan';
           ?>
-          <?php if ($imgWrapperClass !== ''): ?>
-            <div class="<?= htmlspecialchars($imgWrapperClass, ENT_QUOTES) ?>">
-          <?php endif; ?>
+          <div class="<?= htmlspecialchars($wrapperCls, ENT_QUOTES) ?>">
             <img src="/<?= htmlspecialchars($primaryImg, ENT_QUOTES) ?>"
                  alt="<?= htmlspecialchars($t($floor['altKey']), ENT_QUOTES) ?>"
                  loading="lazy" decoding="async"
@@ -184,9 +183,7 @@ $gridItems = [
                    loading="lazy" decoding="async"
                    class="floor-plan-img">
             <?php endif; ?>
-          <?php if ($imgWrapperClass !== ''): ?>
-            </div>
-          <?php endif; ?>
+          </div>
           <ul class="room-list">
             <?php foreach ($floor['rooms'] as $room): ?>
               <li>
diff --git a/public/css/haus-schleusingen.css b/public/css/haus-schleusingen.css
index 5bf345a..462f6d0 100755
--- a/public/css/haus-schleusingen.css
+++ b/public/css/haus-schleusingen.css
@@ -747,7 +747,8 @@ nav.scrolled {
   color: var(--stone);
 }
 
-.floor-plan {
+.floor-plan,
+.floor-plan-multi {
   margin-top: 1.5rem;
   border: 1px solid var(--warm);
   background: var(--white);
@@ -755,14 +756,6 @@ nav.scrolled {
   max-width: 100%;
 }
 
-.floor-plan img {
-  width: 100%;
-  max-width: 100%;
-  height: auto;
-  display: block;
-  object-fit: contain;
-}
-
 .floor-plan-multi {
   display: grid;
   grid-template-columns: 1fr 1fr;
@@ -770,7 +763,9 @@ nav.scrolled {
   background: var(--warm);
 }
 
-.floor-plan-multi img {
+.floor-plan img,
+.floor-plan-multi img,
+img.floor-plan-img {
   width: 100%;
   max-width: 100%;
   height: auto;
@@ -779,6 +774,42 @@ nav.scrolled {
   background: var(--white);
 }
 
+/* Room list — visible m² per floor */
+.room-list {
+  list-style: none;
+  margin: 1.5rem 0 0;
+  padding: 0;
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
+  gap: 0.5rem;
+}
+
+.room-list li {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 0.75rem;
+  padding: 0.75rem 1rem;
+  background: var(--cream);
+  font-size: 0.82rem;
+  color: var(--charcoal);
+}
+
+.room-name {
+  flex: 1 1 auto;
+  min-width: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.room-size {
+  flex: 0 0 auto;
+  font-size: 0.72rem;
+  color: var(--stone);
+  letter-spacing: 0.05em;
+}
+
 @media (width <= 768px) {
   .floor-plan-multi {
     grid-template-columns: 1fr;