feat: i18n annotations — data-de/data-en + toggle for all 54 custom sites
Phase 2 of i18n rollout: - All 54 static custom sites now have data-de/data-en attributes on visible text elements with English translations - i18n.js script tag injected into all sites - Language toggle button with machine-translation disclaimer added to every site's footer area - Brand names / domain wordplay preserved unchanged in both languages - 2 dynamic sites (dasbes.de, dumusst.com) skipped — no static HTML
This commit is contained in:
@@ -172,7 +172,7 @@
|
||||
<nav>
|
||||
<div class="container">
|
||||
<div class="logo"><span class="bird">🐦</span> <span class="ki">KI</span>libri</div>
|
||||
<a href="#features">Entdecken</a>
|
||||
<a href="#features" data-de="Entdecken" data-en="Discover">Entdecken</a>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
@@ -180,45 +180,45 @@
|
||||
<div class="container">
|
||||
<span class="hero-bird">🐦</span>
|
||||
<h1><span class="ki">KI</span>libri</h1>
|
||||
<p>Die kleinste KI die du je gesehen hast. Klein wie ein Kolibri. Schnell wie ein Kolibri. Bunt wie ein Kolibri. Nur ohne Flügel.</p>
|
||||
<a href="#features" class="hero-cta">Mikro-KI entdecken</a>
|
||||
<p data-de="Die kleinste KI die du je gesehen hast. Klein wie ein Kolibri. Schnell wie ein Kolibri. Bunt wie ein Kolibri. Nur ohne Flügel." data-en="The smallest AI you've ever seen. Small like a hummingbird. Fast like a hummingbird. Colourful like a hummingbird. Just without wings.">Die kleinste KI die du je gesehen hast. Klein wie ein Kolibri. Schnell wie ein Kolibri. Bunt wie ein Kolibri. Nur ohne Flügel.</p>
|
||||
<a href="#features" class="hero-cta" data-de="Mikro-KI entdecken" data-en="Discover micro-AI">Mikro-KI entdecken</a>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section" id="features">
|
||||
<div class="container">
|
||||
<div class="section-label">Smart. Klein. Bunt.</div>
|
||||
<h2>Was <span class="ki">KI</span>libri kann</h2>
|
||||
<div class="section-label" data-de="Smart. Klein. Bunt." data-en="Smart. Small. Colourful.">Smart. Klein. Bunt.</div>
|
||||
<h2 data-de="Was <span class="ki">KI</span>libri kann" data-en="What <span class="ki">KI</span>libri can do">Was <span class="ki">KI</span>libri kann</h2>
|
||||
<div class="features-grid">
|
||||
<div class="feature-card">
|
||||
<div class="feature-icon teal">💡</div>
|
||||
<h3>Licht-Flüsterer</h3>
|
||||
<p>Dimmt das Licht bevor du es merkst. Weil KIlibri schon weiß, dass du müde bist. Du weißt es nur noch nicht.</p>
|
||||
<h3 data-de="Licht-Flüsterer" data-en="Light Whisperer">Licht-Flüsterer</h3>
|
||||
<p data-de="Dimmt das Licht bevor du es merkst. Weil KIlibri schon weiß, dass du müde bist. Du weißt es nur noch nicht." data-en="Dims the light before you notice. Because KIlibri already knows you're tired. You just don't know it yet.">Dimmt das Licht bevor du es merkst. Weil KIlibri schon weiß, dass du müde bist. Du weißt es nur noch nicht.</p>
|
||||
</div>
|
||||
<div class="feature-card">
|
||||
<div class="feature-icon orange">🌡️</div>
|
||||
<h3>Klima-Kolibri</h3>
|
||||
<p>Regelt die Heizung. Auf 0,01 Grad genau. Niemand merkt den Unterschied. Aber KIlibri ist stolz.</p>
|
||||
<h3 data-de="Klima-Kolibri" data-en="Climate Hummingbird">Klima-Kolibri</h3>
|
||||
<p data-de="Regelt die Heizung. Auf 0,01 Grad genau. Niemand merkt den Unterschied. Aber KIlibri ist stolz." data-en="Controls the heating. To 0.01 degrees. Nobody notices the difference. But KIlibri is proud.">Regelt die Heizung. Auf 0,01 Grad genau. Niemand merkt den Unterschied. Aber KIlibri ist stolz.</p>
|
||||
</div>
|
||||
<div class="feature-card">
|
||||
<div class="feature-icon pink">🎵</div>
|
||||
<h3>Nest-DJ</h3>
|
||||
<p>Spielt Musik passend zur Stimmung. Erkennt 47 verschiedene Formen von "keine Lust". Für jede den passenden Song.</p>
|
||||
<h3 data-de="Nest-DJ" data-en="Nest DJ">Nest-DJ</h3>
|
||||
<p data-de="Spielt Musik passend zur Stimmung. Erkennt 47 verschiedene Formen von "keine Lust". Für jede den passenden Song." data-en="Plays music to match the mood. Recognises 47 different forms of "not feeling it". A matching song for each.">Spielt Musik passend zur Stimmung. Erkennt 47 verschiedene Formen von "keine Lust". Für jede den passenden Song.</p>
|
||||
</div>
|
||||
<div class="feature-card">
|
||||
<div class="feature-icon sky">🔒</div>
|
||||
<h3>Tür-Wächter</h3>
|
||||
<p>Erkennt wer vor der Tür steht. Öffnet nur für Freunde. Und den Lieferdienst. Prioritäten.</p>
|
||||
<h3 data-de="Tür-Wächter" data-en="Door Guardian">Tür-Wächter</h3>
|
||||
<p data-de="Erkennt wer vor der Tür steht. Öffnet nur für Freunde. Und den Lieferdienst. Prioritäten." data-en="Recognises who's at the door. Opens only for friends. And the delivery service. Priorities.">Erkennt wer vor der Tür steht. Öffnet nur für Freunde. Und den Lieferdienst. Prioritäten.</p>
|
||||
</div>
|
||||
<div class="feature-card">
|
||||
<div class="feature-icon lime">🌱</div>
|
||||
<h3>Pflanzen-Pfleger</h3>
|
||||
<p>Gießt deine Pflanzen automatisch. Hat bisher nur 3 ertränkt. Lernkurve. Die vierte lebt noch.</p>
|
||||
<h3 data-de="Pflanzen-Pfleger" data-en="Plant Carer">Pflanzen-Pfleger</h3>
|
||||
<p data-de="Gießt deine Pflanzen automatisch. Hat bisher nur 3 ertränkt. Lernkurve. Die vierte lebt noch." data-en="Waters your plants automatically. Has only drowned 3 so far. Learning curve. The fourth is still alive.">Gießt deine Pflanzen automatisch. Hat bisher nur 3 ertränkt. Lernkurve. Die vierte lebt noch.</p>
|
||||
</div>
|
||||
<div class="feature-card">
|
||||
<div class="feature-icon warm">☕</div>
|
||||
<h3>Kaffee-Prophet</h3>
|
||||
<p>Startet die Kaffeemaschine 4 Minuten bevor dein Wecker klingelt. Wahre KI versteht: erst Kaffee, dann Mensch.</p>
|
||||
<h3 data-de="Kaffee-Prophet" data-en="Coffee Prophet">Kaffee-Prophet</h3>
|
||||
<p data-de="Startet die Kaffeemaschine 4 Minuten bevor dein Wecker klingelt. Wahre KI versteht: erst Kaffee, dann Mensch." data-en="Starts the coffee machine 4 minutes before your alarm. True AI understands: coffee first, then human.">Startet die Kaffeemaschine 4 Minuten bevor dein Wecker klingelt. Wahre KI versteht: erst Kaffee, dann Mensch.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -226,28 +226,28 @@
|
||||
|
||||
<section class="specs-section">
|
||||
<div class="container">
|
||||
<div class="section-label" style="text-align: center;">Technische Daten</div>
|
||||
<h2 style="text-align: center; margin-bottom: 40px;"><span class="ki" style="color: var(--teal);">KI</span>libri in Zahlen</h2>
|
||||
<div class="section-label" style="text-align: center;" data-de="Technische Daten" data-en="Technical Specs">Technische Daten</div>
|
||||
<h2 style="text-align: center; margin-bottom: 40px;" data-de="<span class="ki" style="color: var(--teal);">KI</span>libri in Zahlen" data-en="<span class="ki" style="color: var(--teal);">KI</span>libri by the numbers"><span class="ki" style="color: var(--teal);">KI</span>libri in Zahlen</h2>
|
||||
<div class="specs-grid">
|
||||
<div class="spec-item">
|
||||
<div class="spec-value">3</div>
|
||||
<div class="spec-unit">Gramm</div>
|
||||
<div class="spec-label">Gewicht (wie ein Kolibri)</div>
|
||||
<div class="spec-label" data-de="Gewicht (wie ein Kolibri)" data-en="Weight (like a hummingbird)">Gewicht (wie ein Kolibri)</div>
|
||||
</div>
|
||||
<div class="spec-item">
|
||||
<div class="spec-value">80</div>
|
||||
<div class="spec-unit">Flügelschläge/s</div>
|
||||
<div class="spec-label">Rechenleistung</div>
|
||||
<div class="spec-unit" data-de="Flügelschläge/s" data-en="wingbeats/s">Flügelschläge/s</div>
|
||||
<div class="spec-label" data-de="Rechenleistung" data-en="Processing power">Rechenleistung</div>
|
||||
</div>
|
||||
<div class="spec-item">
|
||||
<div class="spec-value">∞</div>
|
||||
<div class="spec-unit">Blumen</div>
|
||||
<div class="spec-label">Datenpunkte besucht</div>
|
||||
<div class="spec-unit" data-de="Blumen" data-en="Flowers">Blumen</div>
|
||||
<div class="spec-label" data-de="Datenpunkte besucht" data-en="Data points visited">Datenpunkte besucht</div>
|
||||
</div>
|
||||
<div class="spec-item">
|
||||
<div class="spec-value">1</div>
|
||||
<div class="spec-unit">Zuhause</div>
|
||||
<div class="spec-label">Optimales Habitat</div>
|
||||
<div class="spec-unit" data-de="Zuhause" data-en="Home">Zuhause</div>
|
||||
<div class="spec-label" data-de="Optimales Habitat" data-en="Optimal habitat">Optimales Habitat</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -256,20 +256,24 @@
|
||||
<section class="cta-section">
|
||||
<div class="container">
|
||||
<div class="cta-box">
|
||||
<h3>Hol dir deinen <span class="ki">KI</span>libri</h3>
|
||||
<p>Die kleinste, schnellste, bunteste KI für dein Zuhause. Passt in jede Ecke. Macht jede Ecke smarter.</p>
|
||||
<a href="#" class="hero-cta" style="display: inline-block; padding: 14px 36px; background: var(--teal); color: #fff; font-weight: 700; border-radius: 100px; text-decoration: none;">Jetzt vorbestellen*</a>
|
||||
<p class="note">* Existiert nicht wirklich. Wie die meisten Smart-Home-Versprechen.</p>
|
||||
<h3 data-de="Hol dir deinen <span class="ki">KI</span>libri" data-en="Get your <span class="ki">KI</span>libri">Hol dir deinen <span class="ki">KI</span>libri</h3>
|
||||
<p data-de="Die kleinste, schnellste, bunteste KI für dein Zuhause. Passt in jede Ecke. Macht jede Ecke smarter." data-en="The smallest, fastest, most colourful AI for your home. Fits in every corner. Makes every corner smarter.">Die kleinste, schnellste, bunteste KI für dein Zuhause. Passt in jede Ecke. Macht jede Ecke smarter.</p>
|
||||
<a href="#" class="hero-cta" style="display: inline-block; padding: 14px 36px; background: var(--teal); color: #fff; font-weight: 700; border-radius: 100px; text-decoration: none;" data-de="Jetzt vorbestellen*" data-en="Pre-order now*">Jetzt vorbestellen*</a>
|
||||
<p class="note" data-de="* Existiert nicht wirklich. Wie die meisten Smart-Home-Versprechen." data-en="* Doesn't really exist. Like most smart home promises.">* Existiert nicht wirklich. Wie die meisten Smart-Home-Versprechen.</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<footer>
|
||||
<div class="container">
|
||||
<p>🐦 <span class="ki">KI</span>libri — Klein, schnell, bunt. Die <span class="ki">KI</span> für dein Nest.</p>
|
||||
|
||||
<p data-de="🐦 <span class="ki">KI</span>libri — Klein, schnell, bunt. Die <span class="ki">KI</span> für dein Nest." data-en="🐦 <span class="ki">KI</span>libri — Small, fast, colourful. The <span class="ki">KI</span> for your nest.">🐦 <span class="ki">KI</span>libri — Klein, schnell, bunt. Die <span class="ki">KI</span> für dein Nest.</p>
|
||||
<div style="text-align:center;margin-top:16px;">
|
||||
<button data-i18n-toggle title="Maschinell übersetzt / Machine-translated — German is the original." style="background:none;border:1px solid var(--text-muted,#444);color:var(--text-muted,#444);font-size:0.65rem;letter-spacing:0.1em;padding:4px 12px;border-radius:4px;cursor:pointer;">EN</button>
|
||||
<br><small data-de="Maschinell übersetzt" data-en="Machine-translated" style="color:var(--text-muted,#444);font-size:0.6rem;opacity:0.5;">Maschinell übersetzt</small>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
<script src="/shared/impressum.js"></script>
|
||||
<script src="/shared/i18n.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
Reference in New Issue
Block a user