fix(issue-80): full-width floor plan images + styled room list + restored + icon
All checks were successful
Lint / PHP Syntax Check (push) Successful in 58s
PHPUnit / PHP Unit Tests (push) Successful in 1m8s
Lint / PHP Syntax Check (pull_request) Successful in 29s
Lint / HTML Lint (htmlhint) (push) Successful in 1m39s
Lint / CSS Lint (stylelint) (push) Successful in 1m43s
PHPUnit / PHP Unit Tests (pull_request) Successful in 36s
Lint / CSS Lint (stylelint) (pull_request) Successful in 1m11s
Lint / HTML Lint (htmlhint) (pull_request) Successful in 1m5s
All checks were successful
Lint / PHP Syntax Check (push) Successful in 58s
PHPUnit / PHP Unit Tests (push) Successful in 1m8s
Lint / PHP Syntax Check (pull_request) Successful in 29s
Lint / HTML Lint (htmlhint) (push) Successful in 1m39s
Lint / CSS Lint (stylelint) (push) Successful in 1m43s
PHPUnit / PHP Unit Tests (pull_request) Successful in 36s
Lint / CSS Lint (stylelint) (pull_request) Successful in 1m11s
Lint / HTML Lint (htmlhint) (pull_request) Successful in 1m5s
This commit is contained in:
@@ -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' : '';
|
||||
$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; ?>
|
||||
<ul class="room-list">
|
||||
<?php foreach ($floor['rooms'] as $room): ?>
|
||||
<li>
|
||||
|
||||
@@ -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;
|
||||
|
||||
Reference in New Issue
Block a user