190 lines
8.9 KiB
PHP
190 lines
8.9 KiB
PHP
<!DOCTYPE html>
|
||
<html lang="de">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>Bratonien Adventskalender 2025</title>
|
||
|
||
<!-- === Styles === -->
|
||
<link rel="preload" href="/shared/css/style.css" as="style" onload="this.rel='stylesheet'">
|
||
<link rel="preload" href="/2025/css/popup.css" as="style" onload="this.rel='stylesheet'">
|
||
<link rel="preload" href="/2025/css/main.css" as="style" onload="this.rel='stylesheet'">
|
||
|
||
<noscript>
|
||
<!-- du hattest hier /adventskalender/... stehen, ich lasse es so,
|
||
wenn dein Server das genau so erwartet – sonst auf /shared/ ändern -->
|
||
<link rel="stylesheet" href="/adventskalender/shared/css/style.css">
|
||
<link rel="stylesheet" href="/2025/css/popup.css">
|
||
<link rel="stylesheet" href="/2025/css/main.css">
|
||
</noscript>
|
||
|
||
<!-- === Favicon === -->
|
||
<link rel="icon" type="image/png" href="favicon-2025.webp">
|
||
</head>
|
||
|
||
<body>
|
||
|
||
<?php include __DIR__ . '/../includes/header.html'; ?>
|
||
|
||
<main>
|
||
<div class="kalenderbild">
|
||
<picture>
|
||
<!-- AVIF -->
|
||
<source
|
||
type="image/avif"
|
||
srcset="
|
||
assets/images/420/avif/Basisbild.avif 420w,
|
||
assets/images/768/avif/Basisbild.avif 768w,
|
||
assets/images/1024/avif/Basisbild.avif 1024w,
|
||
assets/images/1280/avif/Basisbild.avif 1280w,
|
||
assets/images/1600/avif/Basisbild.avif 1600w,
|
||
assets/images/1920/avif/Basisbild.avif 1920w,
|
||
assets/images/2560/avif/Basisbild.avif 2560w,
|
||
assets/images/3840/avif/Basisbild.avif 3840w"
|
||
sizes="
|
||
(min-width: 3840px) 3840px,
|
||
(min-width: 2560px) 2560px,
|
||
(min-width: 1920px) 1920px,
|
||
(min-width: 1600px) 1600px,
|
||
(min-width: 1280px) 1280px,
|
||
100vw">
|
||
|
||
<!-- WebP -->
|
||
<source
|
||
type="image/webp"
|
||
srcset="
|
||
assets/images/420/webp/Basisbild.webp 420w,
|
||
assets/images/768/webp/Basisbild.webp 768w,
|
||
assets/images/1024/webp/Basisbild.webp 1024w,
|
||
assets/images/1280/webp/Basisbild.webp 1280w,
|
||
assets/images/1600/webp/Basisbild.webp 1600w,
|
||
assets/images/1920/webp/Basisbild.webp 1920w,
|
||
assets/images/2560/webp/Basisbild.webp 2560w,
|
||
assets/images/3840/webp/Basisbild.webp 3840w"
|
||
sizes="
|
||
(min-width: 3840px) 3840px,
|
||
(min-width: 2560px) 2560px,
|
||
(min-width: 1920px) 1920px,
|
||
(min-width: 1600px) 1600px,
|
||
(min-width: 1280px) 1280px,
|
||
100vw">
|
||
|
||
<!-- JPEG-Fallback -->
|
||
<img
|
||
src="assets/images/1280/jpeg/Basisbild.jpg"
|
||
srcset="
|
||
assets/images/420/jpeg/Basisbild.jpg 420w,
|
||
assets/images/768/jpeg/Basisbild.jpg 768w,
|
||
assets/images/1024/jpeg/Basisbild.jpg 1024w,
|
||
assets/images/1280/jpeg/Basisbild.jpg 1280w,
|
||
assets/images/1600/jpeg/Basisbild.jpg 1600w,
|
||
assets/images/1920/jpeg/Basisbild.jpg 1920w,
|
||
assets/images/2560/jpeg/Basisbild.jpg 2560w,
|
||
assets/images/3840/jpeg/Basisbild.jpg 3840w"
|
||
sizes="
|
||
(min-width: 3840px) 3840px,
|
||
(min-width: 2560px) 2560px,
|
||
(min-width: 1920px) 1920px,
|
||
(min-width: 1600px) 1600px,
|
||
(min-width: 1280px) 1280px,
|
||
100vw"
|
||
alt="Bratonien Adventskalender 2025"
|
||
decoding="async"
|
||
fetchpriority="high">
|
||
</picture>
|
||
|
||
<!-- deine 24 Türen unverändert -->
|
||
<div class="door hinge-right" data-day="18" data-left="6" data-top="9" data-width="8.5">18</div>
|
||
<div class="openfield" data-day="18" data-left="6" data-top="9" data-width="8.5"></div>
|
||
|
||
<div class="door hinge-left" data-day="2" data-left="23" data-top="12" data-width="8.5">2</div>
|
||
<div class="openfield" data-day="2" data-left="23" data-top="12" data-width="8.5"></div>
|
||
|
||
<div class="door hinge-right" data-day="21" data-left="38" data-top="8" data-width="8.5">21</div>
|
||
<div class="openfield" data-day="21" data-left="38" data-top="8" data-width="8.5"></div>
|
||
|
||
<div class="door hinge-left" data-day="10" data-left="54" data-top="11" data-width="8.5">10</div>
|
||
<div class="openfield" data-day="10" data-left="54" data-top="11" data-width="8.5"></div>
|
||
|
||
<div class="door hinge-right" data-day="5" data-left="69" data-top="13" data-width="8.5">5</div>
|
||
<div class="openfield" data-day="5" data-left="69" data-top="13" data-width="8.5"></div>
|
||
|
||
<div class="door hinge-right" data-day="14" data-left="82" data-top="6" data-width="8.5">14</div>
|
||
<div class="openfield" data-day="14" data-left="82" data-top="6" data-width="8.5"></div>
|
||
|
||
<div class="fluegel left" data-day="6" data-top="28" data-left="9" data-width="6">6</div>
|
||
<div class="fluegel right" data-day="6" data-top="28" data-left="15" data-width="6"></div>
|
||
<div class="openfield" data-day="6" data-top="28" data-left="9" data-width="12"></div>
|
||
|
||
<div class="door hinge-left" data-day="1" data-left="29" data-top="30" data-width="8.5">1</div>
|
||
<div class="openfield" data-day="1" data-left="29" data-top="30" data-width="8.5"></div>
|
||
|
||
<div class="door hinge-right" data-day="23" data-left="39" data-top="31" data-width="8.5">23</div>
|
||
<div class="openfield" data-day="23" data-left="39" data-top="31" data-width="8.5"></div>
|
||
|
||
<div class="door hinge-left" data-day="4" data-left="55" data-top="27" data-width="8.5">4</div>
|
||
<div class="openfield" data-day="4" data-left="55" data-top="27" data-width="8.5"></div>
|
||
|
||
<div class="door hinge-right" data-day="9" data-left="68" data-top="34" data-width="8.5">9</div>
|
||
<div class="openfield" data-day="9" data-left="68" data-top="34" data-width="8.5"></div>
|
||
|
||
<div class="door hinge-left" data-day="17" data-left="84" data-top="29" data-width="8.5">17</div>
|
||
<div class="openfield" data-day="17" data-left="84" data-top="29" data-width="8.5"></div>
|
||
|
||
<div class="door hinge-right" data-day="8" data-left="4" data-top="50" data-width="8.5">8</div>
|
||
<div class="openfield" data-day="8" data-left="4" data-top="50" data-width="8.5"></div>
|
||
|
||
<div class="door hinge-left" data-day="16" data-left="21" data-top="52" data-width="8.5">16</div>
|
||
<div class="openfield" data-day="16" data-left="21" data-top="52" data-width="8.5"></div>
|
||
|
||
<div class="door hinge-right" data-day="3" data-left="35" data-top="50" data-width="8.5">3</div>
|
||
<div class="openfield" data-day="3" data-left="35" data-top="50" data-width="8.5"></div>
|
||
|
||
<div class="door hinge-left" data-day="12" data-left="52" data-top="49" data-width="8.5">12</div>
|
||
<div class="openfield" data-day="12" data-left="52" data-top="49" data-width="8.5"></div>
|
||
|
||
<div class="door hinge-right" data-day="19" data-left="64" data-top="55" data-width="8.5">19</div>
|
||
<div class="openfield" data-day="19" data-left="64" data-top="55" data-width="8.5"></div>
|
||
|
||
<div class="door hinge-left" data-day="7" data-left="84" data-top="50" data-width="8.5">7</div>
|
||
<div class="openfield" data-day="7" data-left="84" data-top="50" data-width="8.5"></div>
|
||
|
||
<div class="door hinge-right" data-day="13" data-left="8" data-top="72" data-width="8.5">13</div>
|
||
<div class="openfield" data-day="13" data-left="8" data-top="72" data-width="8.5"></div>
|
||
|
||
<div class="door hinge-left" data-day="15" data-left="24" data-top="69" data-width="8.5">15</div>
|
||
<div class="openfield" data-day="15" data-left="24" data-top="69" data-width="8.5"></div>
|
||
|
||
<div class="door hinge-right" data-day="22" data-left="37" data-top="73" data-width="8.5">22</div>
|
||
<div class="openfield" data-day="22" data-left="37" data-top="73" data-width="8.5"></div>
|
||
|
||
<div class="door hinge-left" data-day="11" data-left="54" data-top="68" data-width="8.5">11</div>
|
||
<div class="openfield" data-day="11" data-left="54" data-top="68" data-width="8.5"></div>
|
||
|
||
<div class="fluegel left" data-day="24" data-top="67" data-left="81" data-width="7.5">2</div>
|
||
<div class="fluegel right" data-day="24" data-top="67" data-left="88.5" data-width="7.5">4</div>
|
||
<div class="openfield" data-day="24" data-top="67" data-left="81" data-width="15.0"></div>
|
||
</div>
|
||
</main>
|
||
|
||
<!-- Popup -->
|
||
<div id="popup-overlay">
|
||
<div id="popup-box">
|
||
<button id="popup-close">×</button>
|
||
<div id="popup-content"></div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- FOOTER -->
|
||
<?php include __DIR__ . '/../includes/footer.html'; ?>
|
||
|
||
<!-- === Scripts === -->
|
||
<script src="../shared/js/position.js" defer></script>
|
||
<script src="../shared/js/glitter.js" defer></script>
|
||
<script src="../shared/js/save-progress.js" defer></script>
|
||
<script src="../shared/js/lock.js" defer></script>
|
||
<script src="js/background.js" defer></script>
|
||
<script src="js/popup.js" defer></script>
|
||
<script src="../shared/js/door-open.js" defer></script>
|
||
</body>
|
||
</html>
|