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

43
templates/recipe.txt
View File

@@ -3,28 +3,34 @@
<!-- TITEL -->
<div class="popup-header">
<h2><!-- TITEL HIER --></h2>
<!-- TOOLS: Schriftart & Schriftgröße -->
<div class="popup-tools">
<button id="btn-font-toggle" aria-label="Schriftart umschalten">Aa ↔ &#x1D49C;</button>
<button id="btn-font-up" aria-label="Schrift vergrößern">A+</button>
<button id="btn-font-down" aria-label="Schrift verkleinern">A−</button>
</div>
</div>
<!-- HAUPTBEREICH -->
<!-- ZWEI-SPALTEN-LAYOUT -->
<div class="popup-body">
<!-- =====================================
LINKE SPALTE – STORYTEXT
===================================== -->
<div class="story">
<!-- DEIN STORYTEXT HIER REIN -->
<!-- DEIN STORYTEXT -->
</div>
<!-- =====================================
RECHTE SPALTE – REZEPT (mit responsivem Bild)
RECHTE SPALTE – REZEPT
===================================== -->
<div class="addon popup-recipe-content">
<!-- REZEPTNAME -->
<!-- Rezeptname -->
<h3 class="recipe-title"><!-- Rezeptname --></h3>
<!-- RESPONSIVES REZEPTBILD -->
<!-- RESPONSIVES BILD -->
<picture class="recipe-image-wrapper">
<!-- AVIF -->
@@ -36,9 +42,10 @@
/2025/assets/images/rezepte/1024/avif/REZEPT.avif 1024w,
/2025/assets/images/rezepte/1366/avif/REZEPT.avif 1366w,
/2025/assets/images/rezepte/1600/avif/REZEPT.avif 1600w,
/2025/assets/images/rezepte/1920/avif/REZEPT.avif 1920w
/2025/assets/images/rezepte/1920/avif/REZEPT.avif 1920w,
/2025/assets/images/rezepte/2560/avif/REZEPT.avif 2560w,
/2025/assets/images/rezepte/3840/avif/REZEPT.avif 3840w
"
sizes="(max-width: 900px) 100vw, 40vw"
>
<!-- WEBP -->
@@ -50,12 +57,13 @@
/2025/assets/images/rezepte/1024/webp/REZEPT.webp 1024w,
/2025/assets/images/rezepte/1366/webp/REZEPT.webp 1366w,
/2025/assets/images/rezepte/1600/webp/REZEPT.webp 1600w,
/2025/assets/images/rezepte/1920/webp/REZEPT.webp 1920w
/2025/assets/images/rezepte/1920/webp/REZEPT.webp 1920w,
/2025/assets/images/rezepte/2560/webp/REZEPT.webp 2560w,
/2025/assets/images/rezepte/3840/webp/REZEPT.webp 3840w
"
sizes="(max-width: 900px) 100vw, 40vw"
>
<!-- JPEG Fallback -->
<!-- JPEG -->
<img
src="/2025/assets/images/rezepte/1024/jpeg/REZEPT.jpg"
srcset="
@@ -64,32 +72,29 @@
/2025/assets/images/rezepte/1024/jpeg/REZEPT.jpg 1024w,
/2025/assets/images/rezepte/1366/jpeg/REZEPT.jpg 1366w,
/2025/assets/images/rezepte/1600/jpeg/REZEPT.jpg 1600w,
/2025/assets/images/rezepte/1920/jpeg/REZEPT.jpg 1920w
/2025/assets/images/rezepte/1920/jpeg/REZEPT.jpg 1920w,
/2025/assets/images/rezepte/2560/jpeg/REZEPT.jpg 2560w,
/2025/assets/images/rezepte/3840/jpeg/REZEPT.jpg 3840w
"
sizes="(max-width: 900px) 100vw, 40vw"
alt="Rezeptbild"
class="recipe-image"
decoding="async"
loading="lazy"
>
</picture>
<!-- Zutaten -->
<h4>Zutaten</h4>
<ul>
<!-- Zutaten -->
<!-- Zutatenliste -->
</ul>
<!-- Zubereitung -->
<h4>Zubereitung</h4>
<p>
<!-- Zubereitung -->
<!-- Zubereitungstext -->
</p>
</div>
</div>
</section>