DogFatherGitandClaude Opus 5
43264c0990
Wunsch 27.08.2026: "soll nur noch hochwertiger und professioneller
aussehen." Kein neues Design, sondern die Details, die den Unterschied
zwischen "gemacht" und "gesetzt" ausmachen:
- Ueberschrift enger gesetzt (-.022em, Zeilenabstand 1.08, text-wrap:
balance). Bei 4rem wirkt normale Laufweite auseinandergefallen; die
drei Zeilen verteilen sich jetzt gleichmaessig statt mit kurzer
Restzeile.
- Jede Welt-Kachel traegt die Farbe IHRER Welt statt dreimal derselben:
Babyblau, Silber, das gedeckte Rot von Spicy Media. Die Werte sind
nicht erfunden, sondern die --accent-Toene der drei Themendateien.
- Plaketten ("WELT 1") klein, in Versalien, weit gesperrt -- liest sich
als Kapitelmarke statt als Beschriftung.
- Event-Karte: Datum als gesperrte Versalzeile (ordnet sich dem Titel
unter), "Mehr erfahren" als ruhiger Knopf statt nacktem Textlink,
Haarlinie am Bild, Text auf 5 Zeilen begrenzt -- damit nicht die
Textlaenge aus der Verwaltung das Aussehen der Startseite bestimmt und
bei zwei Events beide Kacheln gleich hoch sind (geprueft: 572/572px).
ZWEI FUNDE BEIM PRUEFEN, BEIDE WICHTIGER ALS DER FEINSCHLIFF:
1. INHALTSRICHTLINIE UND ZEILENENDEN. Der Browser rechnet die Pruefsumme
eines Inline-Skripts NICHT ueber die Bytes der Datei, sondern ueber
den Text im Dokument -- und der HTML-Parser ersetzt beim Einlesen
jedes CR LF durch LF (HTML-Spezifikation, "preprocessing the input
stream"). Eine Datei mit Windows-Zeilenenden ergibt serverseitig also
eine ANDERE Summe, und die Seite fuehrt ihr eigenes Skript nicht mehr
aus: kein Live-Status, keine Events, nichts. Live war es unauffaellig
(Linux-Auscheckung hat LF), auf dem Windows-Rechner sofort tot
(core.autocrlf=true). inhaltsrichtlinie.js vereinheitlicht jetzt vor
dem Rechnen auf LF -- das ist die Summe, die der Browser wirklich
bildet, und macht die Richtlinie unabhaengig davon, mit welchem
Werkzeug eine Datei zuletzt gespeichert wurde.
2. TESTS MIT FESTEM PORT KOENNEN LUEGEN. Drei Server aus frueheren
Laeufen liefen noch. Neue Testlaeufe konnten ihren Port nicht belegen,
starben still -- und massen weiter gegen den ALTEN Code. Ergebnis
waren Fehlermeldungen zu einem laengst behobenen Fehler. pruef-musik,
pruef-kasse und pruef-startseite suchen sich jetzt einen freien Port.
Neuer Test pruef-startseite.mjs (19 Pruefungen) mit FESTEN Event-Daten:
Beim Pruefen kam einmal nichts vom Server, der Abschnitt blieb leer und
der Test haette "kein Fehler" gemeldet, obwohl er nichts gesehen hat.
Geprueft werden Maske am Artwork, genau eine Kachel bei einem Event,
volle Breite, saubere Textkuerzung auf ganze Zeilen, eigene Weltfarben,
zwei gleich hohe Kacheln bei zwei Events, Handy ohne Ueberlauf.
Alles gruen: startseite 19, musik 17, kasse 15, inhaltsrichtlinie 22,
handy 56.
Co-Authored-By: Claude Opus 5 <[email protected]>
269 lines
13 KiB
HTML
269 lines
13 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="de" data-theme="dogfather">
|
||
<head>
|
||
<meta charset="UTF-8" />
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||
<title>Zeitreise — DOGFATHER UNIVERSE</title>
|
||
<meta name="description" content="Die Geschichte von DogFather in einer interaktiven Zeitleiste." />
|
||
<link rel="icon" type="image/png" href="assets/img/favicon.png" />
|
||
<link rel="manifest" href="/manifest.json" />
|
||
<meta name="theme-color" content="#0b0d10" />
|
||
<meta property="og:type" content="website" />
|
||
<meta property="og:site_name" content="DOGFATHER UNIVERSE" />
|
||
<meta property="og:title" content="Zeitreise — DOGFATHER UNIVERSE" />
|
||
<meta property="og:description" content="Die Geschichte von DogFather in einer interaktiven Zeitleiste." />
|
||
<meta property="og:image" content="https://dogfather-universe.com/assets/img/og-cover.jpg" />
|
||
<meta property="og:url" content="https://dogfather-universe.com/zeitreise.html" />
|
||
<meta name="twitter:card" content="summary_large_image" />
|
||
<meta name="twitter:title" content="Zeitreise — DOGFATHER UNIVERSE" />
|
||
<meta name="twitter:description" content="Die Geschichte von DogFather in einer interaktiven Zeitleiste." />
|
||
<meta name="twitter:image" content="https://dogfather-universe.com/assets/img/og-cover.jpg" />
|
||
|
||
<link rel="stylesheet" href="assets/css/main.css?v=20260828e" />
|
||
<link rel="stylesheet" href="assets/css/theme-dogfather.css?v=20260828e" />
|
||
<link rel="stylesheet" href="assets/css/theme-hasidog.css?v=20260828e" />
|
||
<link rel="stylesheet" href="assets/css/theme-spicymedia.css?v=20260828e" />
|
||
</head>
|
||
<body class="mit-hintergrund" style="--page-bg:url('/assets/img/bg-zeitreise.jpg');--page-bg-mobile:url('/assets/img/bg-zeitreise-mobile.jpg');">
|
||
<div id="site-header"></div>
|
||
|
||
<main>
|
||
<section class="hero page-bg">
|
||
<div class="hero-banner"><img src="/assets/img/bg-zeitreise.jpg" alt="" loading="eager" /></div>
|
||
<div class="container">
|
||
<span class="eyebrow" data-i18n="zr_eyebrow">Welt 1 — DogFather</span>
|
||
<h1 data-i18n="zr_h1">Zeitreise</h1>
|
||
<p class="lead worlds" data-i18n="zr_lead">Die Geschichte von DogFather & Team Dogi.</p>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="section-tight">
|
||
<div class="container">
|
||
<!-- Nutzer-Wunsch 20.08.2026: gleich am Anfang gut sichtbar zeigen, dass
|
||
diese Zeitreise noch aktiv wächst/nicht fertig ist — bewusst NICHT
|
||
die alte .todo-note-Optik (die war für Entwickler gedacht und wurde
|
||
am 31.07.2026 sitewide unsichtbar gemacht), sondern ein einladender,
|
||
für Besucher gestalteter Hinweis im Wachstums-Baum-Thema dieser
|
||
Seite (passt zu 🌱 "Der Anfang" oben und 🌳 "...wächst weiter" unten). -->
|
||
<div class="zeit-baustelle">
|
||
<span class="zeit-baustelle-icon" aria-hidden="true">🌱</span>
|
||
<div>
|
||
<strong data-i18n="zr_baustelle_h3">Diese Zeitreise wächst noch</strong>
|
||
<p data-i18n="zr_baustelle_p">Wir ergänzen laufend weitere Kapitel, Daten und Momente aus der Geschichte von DogFather & Team Dogi — schau gern öfter mal wieder vorbei.</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="zeit-baum">
|
||
<div class="zeit-baum-kappe">
|
||
<span aria-hidden="true">🌱</span>
|
||
<span data-i18n="zr_baum_start">Der Anfang</span>
|
||
</div>
|
||
|
||
<!-- Nutzer-Wunsch 20.08.2026: echtes Datum nachgetragen (24. Oktober 2023) --
|
||
bleibt weiterhin die erste Karte, da es das früheste Datum der ganzen
|
||
Zeitleiste ist. -->
|
||
<div class="zeit-ast">
|
||
<div class="zeit-node" aria-hidden="true"></div>
|
||
<div class="zeit-karte">
|
||
<div class="zeit-datum" data-i18n="zr_ev1_date">24. Oktober 2023</div>
|
||
<h3 data-i18n="zr_ev1_h3">Start als Content Creator</h3>
|
||
<p data-i18n="zr_ev1_p">DogFather beginnt seine Reise auf TikTok.</p>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Nutzer-Wunsch 20.08.2026: echtes Datum nachgetragen (Anfang 2025) — bleibt
|
||
an dieser Stelle, da "Anfang 2025" chronologisch weiterhin vor "Ostern
|
||
2025" (nächste Karte) liegt. -->
|
||
<div class="zeit-ast">
|
||
<div class="zeit-node" aria-hidden="true"></div>
|
||
<div class="zeit-karte">
|
||
<div class="zeit-datum" data-i18n="zr_ev2_date">Anfang 2025</div>
|
||
<h3 data-i18n="zr_ev2_h3">Team Dogi entsteht</h3>
|
||
<p data-i18n="zr_ev2_p">Aus einzelnen Zuschauern wird eine starke Gemeinschaft.</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="zeit-ast meilenstein">
|
||
<div class="zeit-node" aria-hidden="true"></div>
|
||
<div class="zeit-karte">
|
||
<div class="zeit-datum" data-i18n="zr_ev3_date">Ostern 2025</div>
|
||
<h3 data-i18n="zr_ev3_h3">HasiDog wird geboren</h3>
|
||
<p data-i18n="zr_ev3_p">Aus einem Spitznamen entsteht eine eigenständige Marke.</p>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Nutzer-Wunsch 20.08.2026: echtes Datum nachgetragen (November 2025) und
|
||
an die chronologisch richtige Stelle verschoben (lag vorher weiter unten
|
||
unter "Datum folgt"). -->
|
||
<div class="zeit-ast">
|
||
<div class="zeit-node" aria-hidden="true"></div>
|
||
<div class="zeit-karte">
|
||
<div class="zeit-datum" data-i18n="zr_ev13_date">November 2025</div>
|
||
<h3 data-i18n="zr_ev13_h3">Das Buch „HasiDog & Casper"</h3>
|
||
<p data-i18n="zr_ev13_p">Die Geschichte von DogFather, HasiDog und seinem Husky Casper wird zum Buch.</p>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Nutzer-Wunsch 20.08.2026: echtes Datum nachgetragen (1. Januar 2026) und
|
||
an die chronologisch richtige Stelle verschoben (lag vorher weiter unten
|
||
unter "Datum folgt"). -->
|
||
<div class="zeit-ast">
|
||
<div class="zeit-node" aria-hidden="true"></div>
|
||
<div class="zeit-karte">
|
||
<div class="zeit-datum" data-i18n="zr_ev14_date">1. Januar 2026</div>
|
||
<h3 data-i18n="zr_ev14_h3">HasiDog startet auf Spotify</h3>
|
||
<p data-i18n="zr_ev14_p">HasiDog erhält sein eigenes Musikprojekt.</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="zeit-ast meilenstein">
|
||
<div class="zeit-node" aria-hidden="true"></div>
|
||
<div class="zeit-karte">
|
||
<div class="zeit-datum" data-i18n="zr_ev4_date">7. März 2026</div>
|
||
<h3 data-i18n="zr_ev4_h3">Der 28-Stunden-Stream</h3>
|
||
<p data-i18n="zr_ev4_p">DogFather stellt sich einer besonderen Herausforderung und streamt 28 Stunden.</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="zeit-ast">
|
||
<div class="zeit-node" aria-hidden="true"></div>
|
||
<div class="zeit-karte">
|
||
<div class="zeit-datum" data-i18n="zr_ev6_date">2. bis 15. Juni 2026</div>
|
||
<h3 data-i18n="zr_ev6_h3">Die große 12-Stunden-Challenge</h3>
|
||
<p data-i18n="zr_ev6_p">Eine weitere Streaming-Herausforderung gemeinsam mit Team Dogi.</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="zeit-ast">
|
||
<div class="zeit-node" aria-hidden="true"></div>
|
||
<div class="zeit-karte">
|
||
<div class="zeit-datum" data-i18n="zr_ev7_date">Juli 2026</div>
|
||
<h3 data-i18n="zr_ev7_h3">Start als Manager bei Spicy Media</h3>
|
||
<p data-i18n="zr_ev7_p">DogFather übernimmt bei Spicy Media die Rolle als Manager.</p>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Nutzer-Wunsch 21.08.2026: neue Station, chronologisch nach "Juli 2026 —
|
||
Start als Manager" (kein genauer Tag) und vor "27. Juli bis 2. August 2026 —
|
||
Creator Cup" einsortiert, weil 25. Juli das genauere Datum ist. Als
|
||
Meilenstein markiert -- zwei besondere Premieren an einem Tag (erstes
|
||
TiliDog-Fan-Treffen UND erstes persönliches Treffen von DogFather und Tili). -->
|
||
<div class="zeit-ast meilenstein">
|
||
<div class="zeit-node" aria-hidden="true"></div>
|
||
<div class="zeit-karte">
|
||
<div class="zeit-datum" data-i18n="zr_ev21_date">25. Juli 2026</div>
|
||
<h3 data-i18n="zr_ev21_h3">Erstes Fan-Treffen: Team TiliDog</h3>
|
||
<p data-i18n="zr_ev21_p">In Wuppertal kommt die Community von Dogi & Tili zum allerersten Mal persönlich zusammen – ein richtig mega Tag voller guter Laune. Es ist gleichzeitig etwas ganz Besonderes: das erste Aufeinandertreffen von DogFather und Tili überhaupt.</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="zeit-ast meilenstein">
|
||
<div class="zeit-node" aria-hidden="true"></div>
|
||
<div class="zeit-karte">
|
||
<div class="zeit-datum" data-i18n="zr_ev9_date">27. Juli bis 2. August 2026</div>
|
||
<h3 data-i18n="zr_ev9_h3">Der Creator Cup</h3>
|
||
<p data-i18n="zr_ev9_p">Gemeinsam mit Cigdem organisiert DogFather den Creator Cup.</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="zeit-ast">
|
||
<div class="zeit-node" aria-hidden="true"></div>
|
||
<div class="zeit-karte">
|
||
<div class="zeit-datum" data-i18n="zr_ev10_date">28. Juli 2026</div>
|
||
<h3 data-i18n="zr_ev10_h3">Patrick und Bananenstift werden Scouts</h3>
|
||
<p data-i18n="zr_ev10_p">Sie schließen sich DogFather als Scouts an.</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="zeit-ast">
|
||
<div class="zeit-node" aria-hidden="true"></div>
|
||
<div class="zeit-karte">
|
||
<div class="zeit-datum" data-i18n="zr_ev11_date">28. Juli 2026</div>
|
||
<h3 data-i18n="zr_ev11_h3">Aufbau eines eigenen Creator-Systems</h3>
|
||
<p data-i18n="zr_ev11_p">Eine langfristige Struktur für Creator, Scouts und zukünftige Manager.</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="zeit-ast meilenstein">
|
||
<div class="zeit-node" aria-hidden="true"></div>
|
||
<div class="zeit-karte">
|
||
<div class="zeit-datum" data-i18n="zr_ev12_date">Ende Juli 2026</div>
|
||
<h3 data-i18n="zr_ev12_h3">Das DOGFATHER UNIVERSE nimmt Form an</h3>
|
||
<p data-i18n="zr_ev12_p">Die Planung einer eigenen Website beginnt.</p>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Reihenfolge getauscht (Nutzer-Wunsch 20.08.2026): der Website-Start hat
|
||
ein konkretes Datum (21.08.2026) und steht deshalb VOR der Teddy-
|
||
Kooperation, deren Datum noch offen ist ("Datum folgt") -- so bleibt die
|
||
Zeitleiste durchgehend chronologisch lesbar. -->
|
||
<div class="zeit-ast meilenstein">
|
||
<div class="zeit-node" aria-hidden="true"></div>
|
||
<div class="zeit-karte">
|
||
<div class="zeit-datum" data-i18n="zr_ev19_date">21. August 2026, 21 Uhr</div>
|
||
<h3 data-i18n="zr_ev19_h3">DOGFATHER UNIVERSE geht online</h3>
|
||
<p data-i18n="zr_ev19_p">Die offizielle Website öffnet ihre Türen.</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="zeit-ast">
|
||
<div class="zeit-node" aria-hidden="true"></div>
|
||
<div class="zeit-karte">
|
||
<div class="zeit-datum" data-i18n="zr_datum_folgt">Datum folgt</div>
|
||
<h3 data-i18n="zr_ev15_h3">Kooperation mit VanVan Teddys</h3>
|
||
<p data-i18n="zr_ev15_p">Eine eigene Merchandise-Kooperation rund um VanVan startet.</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="zeit-ast meilenstein zeit-final">
|
||
<div class="zeit-node" aria-hidden="true"></div>
|
||
<div class="zeit-karte">
|
||
<div class="zeit-datum" data-i18n="zr_ev20_date">Fortsetzung folgt</div>
|
||
<h3 data-i18n="zr_ev20_h3">Die Geschichte ist noch lange nicht vorbei</h3>
|
||
<p data-i18n="zr_ev20_p">Das DOGFATHER UNIVERSE wächst weiter.</p>
|
||
<p class="zeit-zitat" data-i18n="zr_ev20_quote">Denn aus einem einzelnen TikTok-Livestream wurde eine Community – und aus dieser Community wurde eine Familie.</p>
|
||
<p class="zeit-familie" data-i18n="zr_ev20_familie">Team Dogi ist Familie. 🩵</p>
|
||
<p class="zeit-signoff" data-i18n="zr_ev20_signoff">Liebe Grüße<br>-euer DogFather</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="zeit-baum-wurzel">
|
||
<span aria-hidden="true">🌳</span>
|
||
<span data-i18n="zr_baum_wächst">…und die Geschichte wächst weiter</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
</main>
|
||
|
||
<div id="site-footer"></div>
|
||
<script src="assets/js/i18n-zeitreise.js?v=20260828e"></script>
|
||
<script src="assets/js/main.js?v=20260828e"></script>
|
||
<script>
|
||
/* Wachstums-Reveal: Äste blenden sich beim Scrollen sanft ein — passt
|
||
zum "wachsenden Baum"-Konzept dieser Seite. Rein page-lokal, betrifft
|
||
keine andere Seite. */
|
||
(function () {
|
||
var aeste = document.querySelectorAll(".zeit-ast");
|
||
if (!aeste.length) return;
|
||
if (!("IntersectionObserver" in window)) {
|
||
aeste.forEach(function (el) { el.classList.add("zeit-sichtbar"); });
|
||
return;
|
||
}
|
||
var beobachter = new IntersectionObserver(
|
||
function (eintraege) {
|
||
eintraege.forEach(function (eintrag) {
|
||
if (eintrag.isIntersecting) {
|
||
eintrag.target.classList.add("zeit-sichtbar");
|
||
beobachter.unobserve(eintrag.target);
|
||
}
|
||
});
|
||
},
|
||
{ threshold: 0.15, rootMargin: "0px 0px -40px 0px" }
|
||
);
|
||
aeste.forEach(function (el) { beobachter.observe(el); });
|
||
})();
|
||
</script>
|
||
</body>
|
||
</html>
|