m/onepager
1
0
Fork 0
Code Issues 2 Pull Requests Actions Packages Projects Releases Wiki Activity

feat: i18n annotations — data-de/data-en + toggle for all 54 custom sites

Browse Source 
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:
m
2026-04-01 13:19:40 +02:00
parent 846fc04444
commit 5c92a7b021
53 changed files with 1850 additions and 1475 deletions
Download Patch File Download Diff File Expand all files Collapse all files

59
sites/kitox.de/index.html
View File

@@ -321,14 +321,20 @@
<section class="hero">
<div class="breath-circle"></div>
<h1 class="logo"><span class="ki">KI</span>tox</h1>
<p class="subline">Dein KI-Detox beginnt hier.</p>
<p class="subline" data-de="Dein KI-Detox beginnt hier." data-en="Your AI detox starts here.">Dein KI-Detox beginnt hier.</p>
<div class="scroll-hint"></div>
</section>
<!-- Problem -->
<section class="problem fade-in">
<div class="section-label">Das Problem</div>
<p class="problem-text">
<div class="section-label" data-de="Das Problem" data-en="The problem">Das Problem</div>
<p class="problem-text" data-de="Du merkst es nicht sofort. Aber dein Denken hat sich verändert.<br><br>
Jede Frage geht zuerst an die <strong>KI</strong>.<br>
Jeder Text wird zuerst <strong>generiert</strong>.<br>
Jede Entscheidung zuerst <strong>delegiert</strong>." data-en="You don't notice it right away. But your thinking has changed.<br><br>
Every question goes to the <strong>AI</strong> first.<br>
Every text gets <strong>generated</strong> first.<br>
Every decision gets <strong>delegated</strong> first.">
Du merkst es nicht sofort. Aber dein Denken hat sich verändert.<br><br>
Jede Frage geht zuerst an die <strong>KI</strong>.<br>
Jeder Text wird zuerst <strong>generiert</strong>.<br>
@@ -340,58 +346,58 @@
<!-- Challenge -->
<section class="challenge fade-in">
<div class="section-label">Das Programm</div>
<h2>7 Tage KI-Detox</h2>
<p class="intro">Sieben Tage. Sieben Übungen. Kein Trick — nur du.</p>
<div class="section-label" data-de="Das Programm" data-en="The program">Das Programm</div>
<h2 data-de="7 Tage KI-Detox" data-en="7-day AI detox">7 Tage KI-Detox</h2>
<p class="intro" data-de="Sieben Tage. Sieben Übungen. Kein Trick — nur du." data-en="Seven days. Seven exercises. No trick — just you.">Sieben Tage. Sieben Übungen. Kein Trick — nur du.</p>
<div class="days">
<div class="day fade-in">
<div class="day-num">1</div>
<div class="day-content">
<h3>Keine KI-Suche</h3>
<p>Tippe deine Frage nicht in ChatGPT. Denk selbst nach. Oder frag einen Menschen.</p>
<h3 data-de="Keine KI-Suche" data-en="No AI search">Keine KI-Suche</h3>
<p data-de="Tippe deine Frage nicht in ChatGPT. Denk selbst nach. Oder frag einen Menschen." data-en="Don't type your question into ChatGPT. Think for yourself. Or ask a person.">Tippe deine Frage nicht in ChatGPT. Denk selbst nach. Oder frag einen Menschen.</p>
</div>
</div>
<div class="day fade-in">
<div class="day-num">2</div>
<div class="day-content">
<h3>Eigene Mails schreiben</h3>
<p>Jedes Wort von dir. Kein „Formuliere mir eine höfliche Absage". Deine Stimme.</p>
<h3 data-de="Eigene Mails schreiben" data-en="Write your own emails">Eigene Mails schreiben</h3>
<p data-de="Jedes Wort von dir. Kein „Formuliere mir eine höfliche Absage". Deine Stimme." data-en="Every word from you. No &quot;write me a polite rejection&quot;. Your voice.">Jedes Wort von dir. Kein „Formuliere mir eine höfliche Absage". Deine Stimme.</p>
</div>
</div>
<div class="day fade-in">
<div class="day-num">3</div>
<div class="day-content">
<h3>Eigene Texte formulieren</h3>
<p>Blog, Bericht, Nachricht — alles handgeschrieben. Darf unperfekt sein.</p>
<h3 data-de="Eigene Texte formulieren" data-en="Write your own texts">Eigene Texte formulieren</h3>
<p data-de="Blog, Bericht, Nachricht — alles handgeschrieben. Darf unperfekt sein." data-en="Blog, report, message — all handwritten. Allowed to be imperfect.">Blog, Bericht, Nachricht — alles handgeschrieben. Darf unperfekt sein.</p>
</div>
</div>
<div class="day fade-in">
<div class="day-num">4</div>
<div class="day-content">
<h3>Ohne Navigation fahren</h3>
<p>Karte anschauen, Route merken, losfahren. Dein Orientierungssinn lebt noch.</p>
<h3 data-de="Ohne Navigation fahren" data-en="Drive without navigation">Ohne Navigation fahren</h3>
<p data-de="Karte anschauen, Route merken, losfahren. Dein Orientierungssinn lebt noch." data-en="Look at the map, memorize the route, drive off. Your sense of direction is still alive.">Karte anschauen, Route merken, losfahren. Dein Orientierungssinn lebt noch.</p>
</div>
</div>
<div class="day fade-in">
<div class="day-num">5</div>
<div class="day-content">
<h3>Analog planen</h3>
<p>Papier und Stift. Keine App, kein Assistent. Dein Tag, dein Plan.</p>
<h3 data-de="Analog planen" data-en="Plan analog">Analog planen</h3>
<p data-de="Papier und Stift. Keine App, kein Assistent. Dein Tag, dein Plan." data-en="Paper and pen. No app, no assistant. Your day, your plan.">Papier und Stift. Keine App, kein Assistent. Dein Tag, dein Plan.</p>
</div>
</div>
<div class="day fade-in">
<div class="day-num">6</div>
<div class="day-content">
<h3>Langeweile aushalten</h3>
<p>Kein Prompt. Kein „Erzähl mir was". Sitz da und lass deinen Kopf machen.</p>
<h3 data-de="Langeweile aushalten" data-en="Endure boredom">Langeweile aushalten</h3>
<p data-de="Kein Prompt. Kein „Erzähl mir was". Sitz da und lass deinen Kopf machen." data-en="No prompt. No &quot;tell me something&quot;. Sit there and let your mind do its thing.">Kein Prompt. Kein „Erzähl mir was". Sitz da und lass deinen Kopf machen.</p>
</div>
</div>
<div class="day fade-in">
<div class="day-num">7</div>
<div class="day-content">
<h3>Reflektieren</h3>
<p>Was war schwer? Was war überraschend leicht? Was hat sich verändert?</p>
<h3 data-de="Reflektieren" data-en="Reflect">Reflektieren</h3>
<p data-de="Was war schwer? Was war überraschend leicht? Was hat sich verändert?" data-en="What was hard? What was surprisingly easy? What has changed?">Was war schwer? Was war überraschend leicht? Was hat sich verändert?</p>
</div>
</div>
</div>
@@ -401,13 +407,21 @@
<!-- Provocation -->
<section class="provocation fade-in">
<p>
<p data-de="Diese Seite wurde von einer KI gebaut.
<span class=&quot;highlight&quot;>Du siehst das Problem.</span>" data-en="This site was built by an AI.
<span class=&quot;highlight&quot;>You see the problem.</span>">
Diese Seite wurde von einer KI gebaut.
<span class="highlight">Du siehst das Problem.</span>
</p>
</section>
<footer>KItox &mdash; 2026</footer>
<footer>
<span>KItox &mdash; 2026</span>
<div style="text-align:center;margin-top:16px;opacity:1;">
<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>
</footer>
<script>
const observer = new IntersectionObserver((entries) => {
@@ -421,5 +435,6 @@
document.querySelectorAll('.fade-in').forEach(el => observer.observe(el));
</script>
<script src="/shared/i18n.js"></script>
</body>
</html>