20-02-2026

2026-02-20 17:57:50 +01:00 · 2026-02-20 17:57:50 +01:00 · 4d6b4930b2
commit 4d6b4930b2
parent 854ce02bf6
128 changed files with 18247 additions and 2093 deletions
--- a/public/_cabinet/offers/slide-3-tando.html
+++ b/public/_cabinet/offers/slide-3-tando.html
@ -0,0 +1,109 @@
+<!DOCTYPE html>
+<html lang="de">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>CABINET – TANDO Spiegel</title>
+  <link rel="preconnect" href="https://fonts.googleapis.com">
+  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+  <link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@300;400;500;600;700&display=swap" rel="stylesheet">
+  <link rel="stylesheet" href="./shared-styles.css">
+  <style>
+    /* Slide-spezifische Anpassungen */
+    .hero {
+      background:
+        linear-gradient(180deg, rgba(245,245,245,0.9) 0%, rgba(250,250,250,0.95) 100%);
+    }
+
+    .hero.has-image {
+        background: url('../assets/tango.jpg') center/cover no-repeat;
+      }
+    .impulse-tag {
+      display: inline-block;
+      background: var(--accent);
+      color: white;
+      font-size: var(--text-sm);
+      font-weight: 600;
+      padding: 10px 18px;
+      border-radius: 10px;
+      margin-top: 12px;
+      letter-spacing: 0.03em;
+      text-transform: uppercase;
+    }
+
+    .hero-badge {
+        font-size: 24px;
+        font-weight: 500;
+        padding: 16px 28px;
+      }
+  </style>
+</head>
+<body>
+  <main class="screen">
+    <article class="slide" data-duration="10000">
+
+      <!-- HEADER -->
+      <header class="header">
+        <div class="brand">
+          <img src="./logo-cabinet-300.png" alt="CABINET" class="brand-logo">
+        </div>
+
+      </header>
+
+      <!-- HERO -->
+      <section class="hero has-image">
+        <span class="hero-badge">Ausstellungsstück</span>
+      </section>
+
+      <!-- BOTTOM: Info + QR -->
+      <section class="bottom">
+        <div class="info">
+          <div class="info-content">
+            <p class="eyebrow">Nur 1×</p>
+            <h1 class="title large">TANDO Spiegel</h1>
+            <p class="subline">Heute mitnehmen</p>
+          </div>
+
+          <div class="price-block">
+            <div class="price-row">
+              <span class="price">199 €</span>
+              <div class="price-note">
+                <span class="impulse-tag">Im Store verfügbar</span>
+              </div>
+            </div>
+          </div>
+        </div>
+
+        <aside class="qr-box">
+          <div class="qr-header">
+            <p class="qr-title">Sichern</p>
+            <p class="qr-subtitle">QR scannen</p>
+          </div>
+          <div class="qr-code-wrapper">
+            <img id="qr-code" src="" alt="QR Code">
+          </div>
+          <p class="qr-contact">0521 98620100<br>Tel. oder WhatsApp</p>
+        </aside>
+      </section>
+
+    </article>
+  </main>
+
+  <script>
+    // QR-Code Konfiguration – TANDO Produkt
+    const QR_URL = 'https://cabinet-bielefeld.de';
+
+    function generateQR(targetUrl) {
+      const size = '300x300';
+      const color = '000000';
+      const bg = 'ffffff';
+      const qrApiUrl = `https://api.qrserver.com/v1/create-qr-code/?size=${size}&color=${color}&bgcolor=${bg}&margin=8&data=${encodeURIComponent(targetUrl)}`;
+
+      const qrImg = document.getElementById('qr-code');
+      if (qrImg) qrImg.src = qrApiUrl;
+    }
+
+    document.addEventListener('DOMContentLoaded', () => generateQR(QR_URL));
+  </script>
+</body>
+</html>