Thomas/Bratonien-Adventskalender
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

No message

Browse Source
This commit is contained in:
Thomas Dannenberg
2025-11-16 00:21:52 +01:00
parent 14a262618b
commit 46308b8143
7 changed files with 125 additions and 60 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
adventskalender/2025/content/day01.html
View File

@@ -1,10 +1,16 @@
<section class="popup-day popup-3part day01">
<!-- === Titelzeile === -->
<header class="popup-header">
<h2>🎁 1. Dezember – Der Anfang vom Zauber</h2>
</header>
<!-- HEADER + BUTTONS -->
<div class="popup-header">
<h2><🎁 1. Dezember – Der Anfang vom Zauber</h2>
<div class="popup-tools">
<button id="btn-font-toggle">Aa ↔ &#x1D49C;</button>
<button id="btn-font-up">A+</button>
<button id="btn-font-down">A−</button>
</div>
</div>
<!-- === Hauptbereich mit zwei Spalten === -->
<div class="popup-body">
<!-- Linke Spalte: Story (dein bisheriger Text 1:1 übernommen) -->
<div class="story">

18
adventskalender/2025/content/day02.html
View File

@@ -91,7 +91,7 @@
<!-- ============================
RECHTE SPALTE – REZEPT
RECHTE SPALTE – Basisbild
============================ -->
<div class="addon popup-recipe-content">
@@ -110,9 +110,10 @@
/2025/assets/images/1024/avif/Basisbild.avif 1024w,
/2025/assets/images/1366/avif/Basisbild.avif 1366w,
/2025/assets/images/1600/avif/Basisbild.avif 1600w,
/2025/assets/images/1920/avif/Basisbild.avif 1920w
/2025/assets/images/1920/avif/Basisbild.avif 1920w,
/2025/assets/images/2560/avif/Basisbild.avif 2560w,
/2025/assets/images/3840/avif/Basisbild.avif 3840w
"
sizes="(max-width: 900px) 100vw, 40vw"
>
<!-- WEBP -->
@@ -124,9 +125,10 @@
/2025/assets/images/1024/webp/Basisbild.webp 1024w,
/2025/assets/images/1366/webp/Basisbild.webp 1366w,
/2025/assets/images/1600/webp/Basisbild.webp 1600w,
/2025/assets/images/1920/webp/Basisbild.webp 1920w
/2025/assets/images/1920/webp/Basisbild.webp 1920w,
/2025/assets/images/2560/webp/Basisbild.webp 2560w,
/2025/assets/images/3840/webp/Basisbild.webp 3840w
"
sizes="(max-width: 900px) 100vw, 40vw"
>
<!-- JPEG -->
@@ -138,15 +140,15 @@
/2025/assets/images/1024/jpeg/Basisbild.jpg 1024w,
/2025/assets/images/1366/jpeg/Basisbild.jpg 1366w,
/2025/assets/images/1600/jpeg/Basisbild.jpg 1600w,
/2025/assets/images/1920/jpeg/Basisbild.jpg 1920w
/2025/assets/images/1920/jpeg/Basisbild.jpg 1920w,
/2025/assets/images/2560/jpeg/Basisbild.jpg 2560w,
/2025/assets/images/3840/jpeg/Basisbild.jpg 3840w
"
sizes="(max-width: 900px) 100vw, 40vw"
alt="Rezeptbild"
class="recipe-image"
decoding="async"
loading="lazy"
>
</picture>
<!-- Zutaten -->

45
adventskalender/shared/css/popup.css
View File

@@ -191,7 +191,7 @@
/* Bild floaten lassen */
.popup-recipe-content picture.recipe-image-wrapper {
float: left;
width: clamp(200px, 40%, 330px);
width: clamp(260px, 70%, 3840px);
margin: 0 1.5rem 1.2rem 0;
border-radius: 10px;
display: block;
@@ -279,7 +279,7 @@
padding: 0.15rem 0.45rem;
font-family: var(--ci-font-readable), serif;
font-size: 1.05rem;
font-size: 1.3rem;
font-weight: 600;
letter-spacing: 0.3px;
color: var(--ci-darkgreen);
@@ -295,4 +295,43 @@ display: flex;
.popup-tools button:hover {
background: color-mix(in srgb, var(--ci-gold) 35%, #fff2cc);
}
}
/* ============================================================
ADDON – PICTURE-VORLAGE
============================================================ */
.addon-picture {
display: flex;
justify-content: center;
}
.addon-picture-image {
width: 90%;
height: auto;
display: block;
}
.addon-audio {
width: 100%;
display: flex;
flex-direction: column;
gap: 0.6rem;
}
.addon-audio audio {
width: 100%;
max-width: 700px; /* gleiche Breite wie andere Addons */
}
.addon-video-wrapper {
display: flex;
justify-content: center;
}
.addon-video {
width: 90%;
height: auto;
display: block;
}