DogFatherGit/dogfather-universe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Hero-Bilder, TODO-Bereinigung und Foto-Zuschnitte

Browse Source 
- Neue Husky-/Hasen-Hero-Bilder aus echtem Artwork, runde Portrait-Optik
- Alle sichtbaren TODO-/Platzhalter-Texte entfernt (jetzt HTML-Kommentare
  oder freundliche "folgt in Kürze"-Texte)
- Foto-Zuschnitte gefixt: object-position pro Bild, damit Gesichter und
  Caspers Kopf nie abgeschnitten werden
- Team-Avatare zoomen jetzt auf den Gesichtsbereich der Karten

Co-Authored-By: Claude Opus 5 <[email protected]>
This commit is contained in:
DogFatherGit
2026-07-31 01:25:20 +02:00
co-authored by Claude Opus 5
parent 3a0935e12f
commit 49d1019c61
23 changed files with 82 additions and 113 deletions
Download Patch File Download Diff File Expand all files Collapse all files
aktion-detail.html
+1 -1
View File
@@ -78,7 +78,7 @@ document.addEventListener("DOMContentLoaded", () => {
if (aktion.photo) { if (aktion.photo) {
photoEl.outerHTML = `<img src="${aktion.photo}" alt="${aktion.title}" style="border-radius:var(--radius);" />`; photoEl.outerHTML = `<img src="${aktion.photo}" alt="${aktion.title}" style="border-radius:var(--radius);" />`;
} else { } else {
photoEl.innerHTML = `Foto folgt<br><span class="small">assets/img/aktion-${aktion.id}.jpg</span>`; photoEl.innerHTML = `Foto folgt in Kürze`;
} }
}); });
</script> </script>
assets/css/main.css
+22 -7
View File
@@ -318,8 +318,19 @@ header.site-header {
font-size: 1.6rem; font-size: 1.6rem;
color: var(--accent-contrast); color: var(--accent-contrast);
overflow: hidden; overflow: hidden;
position: relative;
}
/* Team-Karten sind quadratische Motive mit viel Rahmen — der Avatar zoomt
deshalb auf den Gesichtsbereich (ca. 50% / 33% des Motivs), damit das
Gesicht im 96px-Kreis wirklich erkennbar bleibt. */
.avatar img {
position: absolute;
width: 190%;
height: 190%;
left: -45%;
top: -13%;
object-fit: cover;
} }
.avatar img { width: 100%; height: 100%; object-fit: cover; }
.profile-card .role { color: var(--accent); font-weight: 600; font-size: .85rem; margin-bottom: .6rem; } .profile-card .role { color: var(--accent); font-weight: 600; font-size: .85rem; margin-bottom: .6rem; }
.profile-card .quote { font-style: italic; font-size: .9rem; } .profile-card .quote { font-style: italic; font-size: .9rem; }
.profile-card .socials { display: flex; justify-content: center; gap: .6rem; margin-top: .8rem; } .profile-card .socials { display: flex; justify-content: center; gap: .6rem; margin-top: .8rem; }
@@ -600,16 +611,20 @@ footer.site-footer {
.hero-critter img { .hero-critter img {
display: block; display: block;
width: 100%; width: 100%;
height: auto; aspect-ratio: 1 / 1;
border-radius: 14px; object-fit: cover;
border-radius: 50%;
border: 3px solid var(--accent);
box-shadow: 0 0 0 6px rgba(143, 217, 234, .14), 0 14px 32px rgba(0, 0, 0, .55);
} }
.hero-critter.rabbit img { border-color: #c7ccd1; box-shadow: 0 0 0 6px rgba(199, 204, 209, .14), 0 14px 32px rgba(0, 0, 0, .55); }
.hero-critter.main { .hero-critter.main {
width: min(16vw, 175px); width: min(17vw, 190px);
opacity: .95; opacity: .98;
} }
.hero-critter.small { .hero-critter.small {
width: min(9vw, 105px); width: min(10vw, 115px);
opacity: .55; opacity: .65;
animation-duration: 12s; animation-duration: 12s;
filter: drop-shadow(0 0 14px rgba(143, 217, 234, .35)); filter: drop-shadow(0 0 14px rgba(143, 217, 234, .35));
} }
assets/img/hero-husky.png
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 193 KiB

After

Width:  |  Height:  |  Size: 290 KiB

assets/img/hero-rabbit.png
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 173 KiB

After

Width:  |  Height:  |  Size: 278 KiB

bewerben.html
+1 -3
View File
@@ -111,9 +111,7 @@
</form> </form>
</div> </div>
<div class="todo-note"> <!-- TODO: Hinweis: Es ist noch kein Formular-Backend angebunden. Aktuell wird nach der Validierung ein vorausgefüllter E-Mail-Entwurf angeboten. Sobald Hosting steht, hier echten Versand (z.B. Formspree) konfigurieren — siehe assets/js/forms.js. -->
<strong>Hinweis:</strong> Es ist noch kein Formular-Backend angebunden. Aktuell wird nach der Validierung ein vorausgefüllter E-Mail-Entwurf angeboten. Sobald Hosting steht, hier echten Versand (z.B. Formspree) konfigurieren — siehe <code>assets/js/forms.js</code>.
</div>
</div> </div>
</section> </section>
</main> </main>
casper.html
+4 -4
View File
@@ -37,7 +37,7 @@
<section class="section-tight"> <section class="section-tight">
<div class="container grid grid-2" style="align-items:center;"> <div class="container grid grid-2" style="align-items:center;">
<div class="collage-photo" style="aspect-ratio:4/3;border-radius:var(--radius);"> <div class="collage-photo" style="aspect-ratio:4/3;border-radius:var(--radius);">
<img src="assets/img/casper-1.jpg" alt="Casper" style="width:100%;height:100%;object-fit:cover;" /> <img src="assets/img/casper-1.jpg" alt="Casper" style="width:100%;height:100%;object-fit:cover;object-position:center top;" />
</div> </div>
<div> <div>
<h2>Wer ist Casper?</h2> <h2>Wer ist Casper?</h2>
@@ -51,9 +51,9 @@
<div class="container"> <div class="container">
<h2 class="text-center">Casper-Galerie</h2> <h2 class="text-center">Casper-Galerie</h2>
<div class="grid grid-4"> <div class="grid grid-4">
<div class="collage-photo" style="aspect-ratio:1;border-radius:var(--radius);"><img src="assets/img/casper-3.jpg" alt="Casper" style="width:100%;height:100%;object-fit:cover;" /></div> <div class="collage-photo" style="aspect-ratio:1;border-radius:var(--radius);"><img src="assets/img/casper-3.jpg" alt="Casper" style="width:100%;height:100%;object-fit:cover;object-position:center 20%;" /></div>
<div class="collage-photo" style="aspect-ratio:1;border-radius:var(--radius);"><img src="assets/img/casper-4.jpg" alt="Casper" style="width:100%;height:100%;object-fit:cover;" /></div> <div class="collage-photo" style="aspect-ratio:1;border-radius:var(--radius);"><img src="assets/img/casper-4.jpg" alt="Casper" style="width:100%;height:100%;object-fit:cover;object-position:42% center;" /></div>
<div class="collage-photo" style="aspect-ratio:1;border-radius:var(--radius);"><img src="assets/img/dogfather-casper-2.jpg" alt="Dogfather und Casper" style="width:100%;height:100%;object-fit:cover;" /></div> <div class="collage-photo" style="aspect-ratio:1;border-radius:var(--radius);"><img src="assets/img/dogfather-casper-2.jpg" alt="Dogfather und Casper" style="width:100%;height:100%;object-fit:cover;object-position:center 38%;" /></div>
<div class="collage-photo" style="aspect-ratio:1;border-radius:var(--radius);"><img src="assets/img/hasidog-casper-book.jpg" alt="HasiDog &amp; Casper Buch-Illustration" style="width:100%;height:100%;object-fit:cover;" /></div> <div class="collage-photo" style="aspect-ratio:1;border-radius:var(--radius);"><img src="assets/img/hasidog-casper-book.jpg" alt="HasiDog &amp; Casper Buch-Illustration" style="width:100%;height:100%;object-fit:cover;" /></div>
</div> </div>
<div class="btn-row" style="justify-content:center;"> <div class="btn-row" style="justify-content:center;">
creator.html
+1 -3
View File
@@ -38,9 +38,7 @@
<div class="container"> <div class="container">
<div class="filter-bar" id="creator-filters"></div> <div class="filter-bar" id="creator-filters"></div>
<div id="creator-grid" class="grid grid-4"></div> <div id="creator-grid" class="grid grid-4"></div>
<div class="todo-note"> <!-- TODO: Noch keine Creator-Profile final geklärt. Sobald Namen/Infos feststehen, in assets/js/data-creator.js ergänzen — diese Seite rendert automatisch. -->
<strong>TODO:</strong> Noch keine Creator-Profile final geklärt. Sobald Namen/Infos feststehen, in <code>assets/js/data-creator.js</code> ergänzen — diese Seite rendert automatisch.
</div>
<div class="btn-row" style="justify-content:center;"> <div class="btn-row" style="justify-content:center;">
<a class="btn btn-primary" href="bewerben.html">Als Creator bewerben</a> <a class="btn btn-primary" href="bewerben.html">Als Creator bewerben</a>
</div> </div>
dogfather.html
+3 -7
View File
@@ -37,15 +37,13 @@
<section class="section-tight"> <section class="section-tight">
<div class="container grid grid-2" style="align-items:center;"> <div class="container grid grid-2" style="align-items:center;">
<div class="collage-photo" style="aspect-ratio:1/1;border-radius:var(--radius);"> <div class="collage-photo" style="aspect-ratio:1/1;border-radius:var(--radius);">
<img src="assets/img/dogfather-portrait.jpg" alt="Dogfather" style="width:100%;height:100%;object-fit:cover;" /> <img src="assets/img/dogfather-portrait.jpg" alt="Dogfather" style="width:100%;height:100%;object-fit:cover;object-position:center top;" />
</div> </div>
<div> <div>
<h2>Wer ist Dogfather?</h2> <h2>Wer ist Dogfather?</h2>
<p class="lead">Content Creator, Streamer auf TikTok (<strong>@dogfather0804</strong>) und das Herz einer wachsenden Community.</p> <p class="lead">Content Creator, Streamer auf TikTok (<strong>@dogfather0804</strong>) und das Herz einer wachsenden Community.</p>
<p>An seiner Seite: Husky <a href="casper.html">Casper</a> und Kater Simba — treue Begleiter, die längst Teil der Marke geworden sind. Mit seinem Core-Team baut Dogfather jeden Tag daran, dass sich Menschen in seiner Community nicht allein fühlen.</p> <p>An seiner Seite: Husky <a href="casper.html">Casper</a> und Kater Simba — treue Begleiter, die längst Teil der Marke geworden sind. Mit seinem Core-Team baut Dogfather jeden Tag daran, dass sich Menschen in seiner Community nicht allein fühlen.</p>
<div class="todo-note"> <!-- TODO: Hinweis zur Privatsphäre: Auf dieser Website wird ausschließlich der Persona-Name „Dogfather / Dogi" veröffentlicht — keine echten bürgerlichen Daten (kein Nachname, kein genaues Alter, keine genaue Herkunft). -->
<strong>Hinweis zur Privatsphäre:</strong> Auf dieser Website wird ausschließlich der Persona-Name „Dogfather / Dogi" veröffentlicht — keine echten bürgerlichen Daten (kein Nachname, kein genaues Alter, keine genaue Herkunft).
</div>
</div> </div>
</div> </div>
</section> </section>
@@ -86,9 +84,7 @@
<div class="card"><h3>🧸 Merchandise-Creator</h3><p>Tassen, Decken, Popsockets, Schlüsselanhänger, Sticker.</p></div> <div class="card"><h3>🧸 Merchandise-Creator</h3><p>Tassen, Decken, Popsockets, Schlüsselanhänger, Sticker.</p></div>
<div class="card"><h3>📖 Autor</h3><p>Ein Buch über Hasidog &amp; Casper.</p></div> <div class="card"><h3>📖 Autor</h3><p>Ein Buch über Hasidog &amp; Casper.</p></div>
</div> </div>
<div class="todo-note"> <!-- TODO: Weitere persönliche Details, Anekdoten und Insider-Fragen aus dem Masterplan-Fragenkatalog (Block „Über Dogfather") werden hier iterativ ergänzt, sobald sie mit Dogi geklärt sind. -->
<strong>TODO:</strong> Weitere persönliche Details, Anekdoten und Insider-Fragen aus dem Masterplan-Fragenkatalog (Block „Über Dogfather") werden hier iterativ ergänzt, sobald sie mit Dogi geklärt sind.
</div>
</div> </div>
</section> </section>
</main> </main>
hasidog.html
+1 -3
View File
@@ -58,9 +58,7 @@
<div class="card text-center"><h3>🐕 Casper</h3><p>Der Husky, der zum Gesicht der HasiDog-Welt wurde — eigene Seite: <a href="casper.html">Casper</a>.</p></div> <div class="card text-center"><h3>🐕 Casper</h3><p>Der Husky, der zum Gesicht der HasiDog-Welt wurde — eigene Seite: <a href="casper.html">Casper</a>.</p></div>
<div class="card text-center"><h3>📖 Buch</h3><p>„Hasidog &amp; Casper" — die Geschichte in Buchform.</p></div> <div class="card text-center"><h3>📖 Buch</h3><p>„Hasidog &amp; Casper" — die Geschichte in Buchform.</p></div>
</div> </div>
<div class="todo-note"> <!-- TODO: Herkunftsgeschichte des Maskottchens, Design-Beschreibung des Logos und weitere HasiDog-Lore aus dem Masterplan werden hier ergänzt. -->
<strong>TODO:</strong> Herkunftsgeschichte des Maskottchens, Design-Beschreibung des Logos und weitere HasiDog-Lore aus dem Masterplan werden hier ergänzt.
</div>
</div> </div>
</section> </section>
index.html
+8 -8
View File
@@ -108,15 +108,15 @@
<h2>Dogfather &amp; Casper</h2> <h2>Dogfather &amp; Casper</h2>
<div class="collage-wrap" id="collage-wrap"> <div class="collage-wrap" id="collage-wrap">
<div class="collage-item"> <div class="collage-item">
<div class="collage-photo"><img class="collage-img" data-fallback="Dogfather" src="assets/img/dogfather-portrait.jpg" alt="Dogfather"></div> <div class="collage-photo"><img class="collage-img" data-fallback="Dogfather" src="assets/img/dogfather-portrait.jpg" alt="Dogfather" style="object-position:center top;"></div>
<p class="collage-caption">Dogfather 🩵</p> <p class="collage-caption">Dogfather 🩵</p>
</div> </div>
<div class="collage-item"> <div class="collage-item">
<div class="collage-photo"><img class="collage-img" data-fallback="Casper" src="assets/img/casper-1.jpg" alt="Casper"></div> <div class="collage-photo"><img class="collage-img" data-fallback="Casper" src="assets/img/casper-1.jpg" alt="Casper" style="object-position:center top;"></div>
<p class="collage-caption">Casper 🐾</p> <p class="collage-caption">Casper 🐾</p>
</div> </div>
<div class="collage-item"> <div class="collage-item">
<div class="collage-photo"><img class="collage-img" data-fallback="Dogfather &amp; Casper" src="assets/img/dogfather-casper-1.jpg" alt="Dogfather und Casper zusammen"></div> <div class="collage-photo"><img class="collage-img" data-fallback="Dogfather &amp; Casper" src="assets/img/dogfather-casper-1.jpg" alt="Dogfather und Casper zusammen" style="object-position:center 18%;"></div>
<p class="collage-caption">Team 🩵🐾</p> <p class="collage-caption">Team 🩵🐾</p>
</div> </div>
<div class="collage-item"> <div class="collage-item">
@@ -128,7 +128,7 @@
<p class="collage-caption">Nase an Nase 🩵</p> <p class="collage-caption">Nase an Nase 🩵</p>
</div> </div>
</div> </div>
<p class="small muted" style="max-width:50ch;margin:0 auto;">Echte Fotos folgen — sobald sie da sind, erscheinen sie hier automatisch in genau diesem Collagen-Look.</p> <p class="small muted" style="max-width:50ch;margin:0 auto;">Dogfather &amp; Casper — die zwei Gesichter hinter dem ganzen Universum. 🩵🐾</p>
</div> </div>
</section> </section>
@@ -191,9 +191,9 @@
<div class="container"> <div class="container">
<h2 class="text-center">Impressionen</h2> <h2 class="text-center">Impressionen</h2>
<div class="grid grid-4"> <div class="grid grid-4">
<div class="collage-photo" style="aspect-ratio:1;border-radius:var(--radius);"><img src="assets/img/casper-3.jpg" alt="Casper" style="width:100%;height:100%;object-fit:cover;" /></div> <div class="collage-photo" style="aspect-ratio:1;border-radius:var(--radius);"><img src="assets/img/casper-3.jpg" alt="Casper" style="width:100%;height:100%;object-fit:cover;object-position:center 20%;" /></div>
<div class="collage-photo" style="aspect-ratio:1;border-radius:var(--radius);"><img src="assets/img/card-vanvan.jpg" alt="VanVan" style="width:100%;height:100%;object-fit:cover;" /></div> <div class="collage-photo" style="aspect-ratio:1;border-radius:var(--radius);"><img src="assets/img/card-vanvan.jpg" alt="VanVan" style="width:100%;height:100%;object-fit:cover;" /></div>
<div class="collage-photo" style="aspect-ratio:1;border-radius:var(--radius);"><img src="assets/img/casper-4.jpg" alt="Casper" style="width:100%;height:100%;object-fit:cover;" /></div> <div class="collage-photo" style="aspect-ratio:1;border-radius:var(--radius);"><img src="assets/img/casper-4.jpg" alt="Casper" style="width:100%;height:100%;object-fit:cover;object-position:42% center;" /></div>
<div class="collage-photo" style="aspect-ratio:1;border-radius:var(--radius);"><img src="assets/img/card-dogfather.jpg" alt="Dogfather" style="width:100%;height:100%;object-fit:cover;" /></div> <div class="collage-photo" style="aspect-ratio:1;border-radius:var(--radius);"><img src="assets/img/card-dogfather.jpg" alt="Dogfather" style="width:100%;height:100%;object-fit:cover;" /></div>
</div> </div>
<div class="btn-row" style="justify-content:center;"> <div class="btn-row" style="justify-content:center;">
@@ -207,8 +207,8 @@
<div class="container text-center"> <div class="container text-center">
<span class="eyebrow">Was andere sagen</span> <span class="eyebrow">Was andere sagen</span>
<div class="card" style="max-width:640px;margin:1rem auto 0;"> <div class="card" style="max-width:640px;margin:1rem auto 0;">
<p class="quote" style="font-size:1.15rem;">„Platzhalter-Zitat — echtes Testimonial folgt."</p> <p class="quote" style="font-size:1.15rem;">„Hier stehen bald echte Stimmen aus der Community. 🩵"</p>
<p class="small muted">— Community-Mitglied</p> <p class="small muted">— Team Dogi</p>
</div> </div>
<div class="btn-row" style="justify-content:center;"> <div class="btn-row" style="justify-content:center;">
<a class="btn btn-outline" href="stimmen.html">Mehr Stimmen</a> <a class="btn btn-outline" href="stimmen.html">Mehr Stimmen</a>
kontakt.html
+7 -19
View File
@@ -39,7 +39,7 @@
<h3>Kontakt</h3> <h3>Kontakt</h3>
<p>Für Anfragen zu Kooperationen, Presse oder allgemeine Fragen:</p> <p>Für Anfragen zu Kooperationen, Presse oder allgemeine Fragen:</p>
<p><a href="mailto:[email protected]">[email protected]</a></p> <p><a href="mailto:[email protected]">[email protected]</a></p>
<p class="small muted">TODO: echte Kontakt-E-Mail eintragen (auch in <code>assets/js/forms.js</code> → <code>CONTACT_EMAIL</code> anpassen).</p> <!-- TODO: echte Kontakt-E-Mail eintragen (auch in assets/js/forms.js -> CONTACT_EMAIL anpassen). -->
</div> </div>
<div class="card"> <div class="card">
<h3>Social</h3> <h3>Social</h3>
@@ -51,23 +51,13 @@
<section> <section>
<div class="container"> <div class="container">
<h2>Impressum</h2> <h2>Impressum</h2>
<div class="todo-note"> <!-- TODO: WICHTIG — offene rechtliche Frage: Ein Impressum ist in Deutschland/EU für geschäftlich genutzte Websites gesetzlich vorgeschrieben (§5 TMG bzw. Nachfolgeregelungen) und verlangt Angaben wie Name, ladungsfähige Anschrift und Kontakt des Betreibers. Das steht im Spannungsfeld zur Entscheidung „nur Persona-Name, keine echten bürgerlichen Daten öffentlich". Mögliche Lösungswege (mit Dogi klären, bevor die Seite live geht): 1) Impressum über die Spicy-Media-Firmendaten statt Privatperson, 2) rechtliche Beratung einholen, welche Mindestangaben nötig sind, 3) vorerst nur lokal/offline nutzen, bis das geklärt ist. -->
<strong>WICHTIG — offene rechtliche Frage:</strong> Ein Impressum ist in Deutschland/EU für
geschäftlich genutzte Websites gesetzlich vorgeschrieben (§5 TMG bzw. Nachfolgeregelungen)
und verlangt Angaben wie Name, ladungsfähige Anschrift und Kontakt des Betreibers. Das steht
im Spannungsfeld zur Entscheidung „nur Persona-Name, keine echten bürgerlichen Daten
öffentlich". Mögliche Lösungswege (mit Dogi klären, bevor die Seite live geht):
<br>1) Impressum über die Spicy-Media-Firmendaten statt Privatperson,
<br>2) rechtliche Beratung einholen, welche Mindestangaben nötig sind,
<br>3) vorerst nur lokal/offline nutzen, bis das geklärt ist.
</div>
<p class="small muted">Platzhalter-Struktur (mit echten Daten zu befüllen, sobald geklärt):</p>
<p class="small muted"> <p class="small muted">
Angaben gemäß § 5 TMG<br> Angaben gemäß § 5 TMG<br>
[Firmenname / Betreiber] — TODO<br> [Firmenname / Betreiber]<br>
[Anschrift] — TODO<br> [Anschrift]<br>
[Kontakt] — TODO<br> [Kontakt]<br>
Vertreten durch: [Name] — TODO Vertreten durch: [Name]
</p> </p>
</div> </div>
</section> </section>
@@ -76,9 +66,7 @@
<div class="container"> <div class="container">
<h2>Datenschutz</h2> <h2>Datenschutz</h2>
<p>Diese Website wird aktuell lokal/offline entwickelt und ist noch nicht öffentlich gehostet. Sobald ein Hosting-Anbieter feststeht und Formulare (z.B. Bewerbung) echte Daten versenden, wird hier eine vollständige Datenschutzerklärung ergänzt (Verarbeitungszwecke, Rechtsgrundlage, Speicherdauer, Empfänger, Rechte der Nutzer:innen).</p> <p>Diese Website wird aktuell lokal/offline entwickelt und ist noch nicht öffentlich gehostet. Sobald ein Hosting-Anbieter feststeht und Formulare (z.B. Bewerbung) echte Daten versenden, wird hier eine vollständige Datenschutzerklärung ergänzt (Verarbeitungszwecke, Rechtsgrundlage, Speicherdauer, Empfänger, Rechte der Nutzer:innen).</p>
<div class="todo-note"> <!-- TODO: Datenschutzerklärung final ausformulieren, sobald Hosting/Formular-Backend feststehen. -->
<strong>TODO:</strong> Datenschutzerklärung final ausformulieren, sobald Hosting/Formular-Backend feststehen.
</div>
</div> </div>
</section> </section>
</main> </main>
links.html
+6 -8
View File
@@ -51,11 +51,11 @@
</a> </a>
<a class="card text-center" href="#" target="_blank" rel="noopener"> <a class="card text-center" href="#" target="_blank" rel="noopener">
<h3>💬 Discord</h3> <h3>💬 Discord</h3>
<p class="small muted">TODO: Discord-Einladungslink ergänzen</p> <p class="small muted">Folgt in Kürze</p>
</a> </a>
<a class="card text-center" href="#" target="_blank" rel="noopener"> <a class="card text-center" href="#" target="_blank" rel="noopener">
<h3>🛒 Merchandise / Shop</h3> <h3>🛒 Merchandise / Shop</h3>
<p class="small muted">TODO: Shop-Link ergänzen (siehe Aktionen)</p> <p class="small muted">Folgt in Kürze</p>
</a> </a>
<a class="card text-center" href="bewerben.html"> <a class="card text-center" href="bewerben.html">
<h3>📝 Bewerben</h3> <h3>📝 Bewerben</h3>
@@ -70,21 +70,19 @@
<h2 class="text-center">QR-Codes</h2> <h2 class="text-center">QR-Codes</h2>
<div class="grid grid-3" style="max-width:800px;margin:0 auto;"> <div class="grid grid-3" style="max-width:800px;margin:0 auto;">
<div class="card qr-card"> <div class="card qr-card">
<div class="img-placeholder">QR: Scout-Bewerbung<br><span class="small">assets/qr/scout-bewerbung-qr.png</span></div> <div class="img-placeholder">QR: Scout-Bewerbung<br><span class="small">folgt in Kürze</span></div>
<p class="small">Scout-Bewerbung</p> <p class="small">Scout-Bewerbung</p>
</div> </div>
<div class="card qr-card"> <div class="card qr-card">
<div class="img-placeholder">QR: DOGFATHER UNIVERSE<br><span class="small">assets/qr/universe-qr.png</span></div> <div class="img-placeholder">QR: DOGFATHER UNIVERSE<br><span class="small">folgt in Kürze</span></div>
<p class="small">Diese Seite teilen</p> <p class="small">Diese Seite teilen</p>
</div> </div>
<div class="card qr-card"> <div class="card qr-card">
<div class="img-placeholder">QR: Deine eigene Teilen-Seite<br><span class="small">assets/qr/dogi-share-qr.png</span></div> <div class="img-placeholder">QR: Deine eigene Teilen-Seite<br><span class="small">folgt in Kürze</span></div>
<p class="small">Dogis persönlicher Teilen-Baustein</p> <p class="small">Dogis persönlicher Teilen-Baustein</p>
</div> </div>
</div> </div>
<div class="todo-note"> <!-- TODO: Vorhandenen QR-Code scout-qr-1785422377936.png nach assets/qr/scout-bewerbung-qr.png kopieren, sobald die Datei bereitsteht. Restliche Links (Discord, Shop) mit echten URLs befüllen — Spotify ist bereits verlinkt. -->
<strong>TODO:</strong> Vorhandenen QR-Code <code>scout-qr-1785422377936.png</code> nach <code>assets/qr/scout-bewerbung-qr.png</code> kopieren, sobald die Datei bereitsteht. Restliche Links (Discord, Shop) mit echten URLs befüllen — Spotify ist bereits verlinkt.
</div>
</div> </div>
</section> </section>
</main> </main>
manager.html
+2 -4
View File
@@ -44,12 +44,10 @@
<h2>Spicy Media Agency</h2> <h2>Spicy Media Agency</h2>
<p>Neben seiner Arbeit als Streamer ist Dogfather Manager bei der Spicy Media Agency. Er unterstützt Scouts und Creator dabei, gemeinsam zu wachsen — professionell, aber mit demselben Herz wie im restlichen DOGFATHER UNIVERSE.</p> <p>Neben seiner Arbeit als Streamer ist Dogfather Manager bei der Spicy Media Agency. Er unterstützt Scouts und Creator dabei, gemeinsam zu wachsen — professionell, aber mit demselben Herz wie im restlichen DOGFATHER UNIVERSE.</p>
<p>Scouts arbeiten in einem 50/50 Gewinn-Sharing-Modell mit Dogfather zusammen.</p> <p>Scouts arbeiten in einem 50/50 Gewinn-Sharing-Modell mit Dogfather zusammen.</p>
<div class="todo-note"> <!-- TODO: TODO / zu bestätigen: Genaue Kommissions-/Gewinnbeteiligungs-Details sollen so öffentlich stehen? Bitte mit Dogi final absegnen, bevor die Seite live geht. -->
<strong>TODO / zu bestätigen:</strong> Genaue Kommissions-/Gewinnbeteiligungs-Details sollen so öffentlich stehen? Bitte mit Dogi final absegnen, bevor die Seite live geht.
</div>
</div> </div>
<div class="img-placeholder" style="aspect-ratio:4/3;"> <div class="img-placeholder" style="aspect-ratio:4/3;">
Spicy Media Logo<br><span class="small">Foto folgt (assets/img/spicy-media-logo.jpg)</span> Spicy Media Logo<br><span class="small">folgt in Kürze</span>
</div> </div>
</div> </div>
</section> </section>
medien.html
+1 -3
View File
@@ -38,9 +38,7 @@
<div class="container"> <div class="container">
<div class="filter-bar" id="gallery-filters"></div> <div class="filter-bar" id="gallery-filters"></div>
<div id="gallery-grid" class="grid grid-4"></div> <div id="gallery-grid" class="grid grid-4"></div>
<div class="todo-note"> <!-- TODO: Echte Fotos aus den vom User gelieferten Assets in assets/img/ ablegen und Pfade in assets/js/gallery.js (MEDIA-Array) eintragen. HEIC-Dateien (z.B. Casper-Fotos) vorher nach JPG/WebP konvertieren. -->
<strong>TODO:</strong> Echte Fotos aus den vom User gelieferten Assets in <code>assets/img/</code> ablegen und Pfade in <code>assets/js/gallery.js</code> (MEDIA-Array) eintragen. HEIC-Dateien (z.B. Casper-Fotos) vorher nach JPG/WebP konvertieren.
</div>
</div> </div>
</section> </section>
</main> </main>
stimmen.html
+7 -9
View File
@@ -37,21 +37,19 @@
<section class="section-tight"> <section class="section-tight">
<div class="container grid grid-3"> <div class="container grid grid-3">
<div class="card"> <div class="card">
<p class="quote">„Platzhalter-Zitat — echtes Testimonial folgt."</p> <p class="quote">„Hier steht bald eine echte Stimme aus der Community. 🩵"</p>
<p class="small muted">— Community-Mitglied (TODO: Name/Erlaubnis einholen)</p> <p class="small muted">— Community-Mitglied</p>
</div> </div>
<div class="card"> <div class="card">
<p class="quote">„Platzhalter-Zitat — echtes Testimonial folgt."</p> <p class="quote">„Hier steht bald eine echte Stimme aus dem Team. 🩵"</p>
<p class="small muted">— Team-Mitglied (TODO)</p> <p class="small muted">— Team-Mitglied</p>
</div> </div>
<div class="card"> <div class="card">
<p class="quote">„Platzhalter-Zitat — echtes Testimonial folgt."</p> <p class="quote">„Hier steht bald eine echte Stimme von Scouts &amp; Creatorn. 🩵"</p>
<p class="small muted">— Scout/Creator (TODO)</p> <p class="small muted">— Scout/Creator</p>
</div> </div>
</div> </div>
<div class="todo-note"> <!-- TODO: Echte Testimonials von Community, Team, Scouts und Creator sammeln (mit Einverständnis zur Veröffentlichung). Bis dahin bleiben hier Platzhalter stehen. -->
<strong>TODO:</strong> Echte Testimonials von Community, Team, Scouts und Creator sammeln (mit Einverständnis zur Veröffentlichung). Bis dahin bleiben hier Platzhalter stehen.
</div>
</section> </section>
</main> </main>
streamer.html
+2 -4
View File
@@ -66,12 +66,10 @@
<div> <div>
<h2>Warum schauen Menschen zu?</h2> <h2>Warum schauen Menschen zu?</h2>
<p>Weil hier niemand nur zuschaut, sondern dazugehört. Dogfather ist loyal, witzig, konfliktscheu aber direkt wenn es drauf ankommt — und immer erreichbar für seine Community.</p> <p>Weil hier niemand nur zuschaut, sondern dazugehört. Dogfather ist loyal, witzig, konfliktscheu aber direkt wenn es drauf ankommt — und immer erreichbar für seine Community.</p>
<div class="todo-note"> <!-- TODO: TODO (Masterplan Block D — Streamformate/Insider): Konkrete Streamformate, wiederkehrende Segmente, Running Gags und Insider-Begriffe werden hier ergänzt, sobald die entsprechenden Fragen aus dem 110-Fragen-Katalog mit Dogi geklärt sind. -->
<strong>TODO (Masterplan Block D — Streamformate/Insider):</strong> Konkrete Streamformate, wiederkehrende Segmente, Running Gags und Insider-Begriffe werden hier ergänzt, sobald die entsprechenden Fragen aus dem 110-Fragen-Katalog mit Dogi geklärt sind.
</div>
</div> </div>
<div class="img-placeholder" style="aspect-ratio:16/10;"> <div class="img-placeholder" style="aspect-ratio:16/10;">
Stream-Szene / Highlight-Bild<br><span class="small">Foto folgt (assets/img/streamer-highlight.jpg)</span> Stream-Szene / Highlight-Bild<br><span class="small">folgt in Kürze</span>
</div> </div>
</div> </div>
</section> </section>
streamplan.html
+1 -3
View File
@@ -51,9 +51,7 @@
<p>Oft geht's auch schon tagsüber live — die Uhrzeit dafür variiert von Tag zu Tag. Am besten TikTok-Benachrichtigungen für @dogfather0804 aktivieren, um keinen Stream zu verpassen.</p> <p>Oft geht's auch schon tagsüber live — die Uhrzeit dafür variiert von Tag zu Tag. Am besten TikTok-Benachrichtigungen für @dogfather0804 aktivieren, um keinen Stream zu verpassen.</p>
</div> </div>
</div> </div>
<div class="todo-note"> <!-- TODO: Streamformate, wiederkehrende Segmente und Running Gags (Masterplan Block D) hier noch ergänzen, sobald geklärt. -->
<strong>TODO:</strong> Streamformate, wiederkehrende Segmente und Running Gags (Masterplan Block D) hier noch ergänzen, sobald geklärt.
</div>
</div> </div>
</section> </section>
</main> </main>
team-modis.html
+1 -3
View File
@@ -54,9 +54,7 @@
<h2 class="text-center">Team-Hierarchie</h2> <h2 class="text-center">Team-Hierarchie</h2>
<div id="modis-grid" class="grid grid-4"></div> <div id="modis-grid" class="grid grid-4"></div>
<div class="todo-note"> <!-- TODO: Hinweis: Reihenfolge/Rollen basieren auf: VanVan (rechte Hand) → Diene (rechte Hand von VanVan) → Funny (Modi) → Miss (Modi + Cutterin) → Marina/Michi (Clip-Account-Kommentare). Änderungen einfach in assets/js/data-modis.js pflegen. -->
<strong>Hinweis:</strong> Reihenfolge/Rollen basieren auf: VanVan (rechte Hand) → Diene (rechte Hand von VanVan) → Funny (Modi) → Miss (Modi + Cutterin) → Marina/Michi (Clip-Account-Kommentare). Änderungen einfach in <code>assets/js/data-modis.js</code> pflegen.
</div>
</div> </div>
</section> </section>
</main> </main>
team-scouts.html
+1 -3
View File
@@ -37,9 +37,7 @@
<section class="section-tight"> <section class="section-tight">
<div class="container"> <div class="container">
<div id="scouts-grid" class="grid grid-4"></div> <div id="scouts-grid" class="grid grid-4"></div>
<div class="todo-note"> <!-- TODO: Dogi liefert die vollständige, aktuelle Scout-Liste per Text nach — assets/js/data-scouts.js ist so gebaut, dass neue Scouts einfach als Objekt ergänzt werden können, ohne dass diese Seite verändert werden muss. -->
<strong>TODO:</strong> Dogi liefert die vollständige, aktuelle Scout-Liste per Text nach — <code>assets/js/data-scouts.js</code> ist so gebaut, dass neue Scouts einfach als Objekt ergänzt werden können, ohne dass diese Seite verändert werden muss.
</div>
<div class="btn-row" style="justify-content:center;"> <div class="btn-row" style="justify-content:center;">
<a class="btn btn-primary" href="bewerben.html">Als Scout bewerben</a> <a class="btn btn-primary" href="bewerben.html">Als Scout bewerben</a>
</div> </div>
vanvan.html
+1 -3
View File
@@ -55,9 +55,7 @@
<div class="card text-center"><h3>🗂️ Organisation</h3><p>Behält den Überblick und delegiert an das richtige Teammitglied.</p></div> <div class="card text-center"><h3>🗂️ Organisation</h3><p>Behält den Überblick und delegiert an das richtige Teammitglied.</p></div>
<div class="card text-center"><h3>🎵 Musik</h3><p>Produziert eigene Songs als „Van-Van" auf <a href="https://open.spotify.com/intl-de/artist/4J9PcKZBkh6V8dVY3CGliw" target="_blank" rel="noopener">Spotify</a>.</p></div> <div class="card text-center"><h3>🎵 Musik</h3><p>Produziert eigene Songs als „Van-Van" auf <a href="https://open.spotify.com/intl-de/artist/4J9PcKZBkh6V8dVY3CGliw" target="_blank" rel="noopener">Spotify</a>.</p></div>
</div> </div>
<div class="todo-note"> <!-- TODO: Persönliches Zitat, Story und Social-Links von VanVan noch einholen (siehe Masterplan-Fragenkatalog, Block Team). -->
<strong>TODO:</strong> Persönliches Zitat, Story und Social-Links von VanVan noch einholen (siehe Masterplan-Fragenkatalog, Block Team).
</div>
<div class="btn-row" style="justify-content:center;"> <div class="btn-row" style="justify-content:center;">
<a class="btn btn-outline" href="team-modis.html">← Zurück zum Modi-Team</a> <a class="btn btn-outline" href="team-modis.html">← Zurück zum Modi-Team</a>
</div> </div>
videos.html
+4 -6
View File
@@ -38,21 +38,19 @@
<div class="container"> <div class="container">
<div class="grid grid-3"> <div class="grid grid-3">
<div class="card"> <div class="card">
<div class="img-placeholder" style="aspect-ratio:9/16;">Video folgt<br><span class="small">TikTok-Embed / Link TODO</span></div> <div class="img-placeholder" style="aspect-ratio:9/16;">Video folgt<br><span class="small">Video folgt in Kürze</span></div>
<h3 style="margin-top:1rem;">Highlight #1</h3> <h3 style="margin-top:1rem;">Highlight #1</h3>
</div> </div>
<div class="card"> <div class="card">
<div class="img-placeholder" style="aspect-ratio:9/16;">Video folgt<br><span class="small">TikTok-Embed / Link TODO</span></div> <div class="img-placeholder" style="aspect-ratio:9/16;">Video folgt<br><span class="small">Video folgt in Kürze</span></div>
<h3 style="margin-top:1rem;">Highlight #2</h3> <h3 style="margin-top:1rem;">Highlight #2</h3>
</div> </div>
<div class="card"> <div class="card">
<div class="img-placeholder" style="aspect-ratio:9/16;">Video folgt<br><span class="small">TikTok-Embed / Link TODO</span></div> <div class="img-placeholder" style="aspect-ratio:9/16;">Video folgt<br><span class="small">Video folgt in Kürze</span></div>
<h3 style="margin-top:1rem;">Highlight #3</h3> <h3 style="margin-top:1rem;">Highlight #3</h3>
</div> </div>
</div> </div>
<div class="todo-note"> <!-- TODO: Echte TikTok-Video-Links/Embeds ergänzen, sobald ausgewählt. Struktur ist bereit für TikTok-Embed-Code oder direkte Video-Dateien. -->
<strong>TODO:</strong> Echte TikTok-Video-Links/Embeds ergänzen, sobald ausgewählt. Struktur ist bereit für TikTok-Embed-Code oder direkte Video-Dateien.
</div>
</div> </div>
</section> </section>
</main> </main>
werte.html
+1 -3
View File
@@ -62,9 +62,7 @@
<p>Team Dogi ist Familie — dieses Prinzip gilt auch im geschäftlichen Teil des Universums.</p> <p>Team Dogi ist Familie — dieses Prinzip gilt auch im geschäftlichen Teil des Universums.</p>
</div> </div>
</div> </div>
<div class="todo-note"> <!-- TODO: Weitere konkrete Grundsätze/Richtlinien aus dem Masterplan (Block Manager-Werte) ergänzen. -->
<strong>TODO:</strong> Weitere konkrete Grundsätze/Richtlinien aus dem Masterplan (Block Manager-Werte) ergänzen.
</div>
<div class="btn-row" style="justify-content:center;"> <div class="btn-row" style="justify-content:center;">
<a class="btn btn-primary" href="bewerben.html">Jetzt bewerben</a> <a class="btn btn-primary" href="bewerben.html">Jetzt bewerben</a>
</div> </div>
zeitreise.html
+7 -9
View File
@@ -38,27 +38,27 @@
<div class="container"> <div class="container">
<div class="timeline"> <div class="timeline">
<div class="timeline-item"> <div class="timeline-item">
<div class="date">TODO: Datum</div> <div class="date">Datum folgt</div>
<h3>Start als Content Creator</h3> <h3>Start als Content Creator</h3>
<p>Die ersten Schritte auf TikTok. TODO: genaues Datum &amp; Story ergänzen.</p> <p>Die ersten Schritte auf TikTok.</p>
</div> </div>
<div class="timeline-item"> <div class="timeline-item">
<div class="date">TODO: Datum</div> <div class="date">Datum folgt</div>
<h3>HasiDog entsteht</h3> <h3>HasiDog entsteht</h3>
<p>Aus dem Spitznamen wird eine eigene Marke — inkl. Musikprojekt auf Spotify.</p> <p>Aus dem Spitznamen wird eine eigene Marke — inkl. Musikprojekt auf Spotify.</p>
</div> </div>
<div class="timeline-item"> <div class="timeline-item">
<div class="date">TODO: Datum</div> <div class="date">Datum folgt</div>
<h3>Start als Manager bei Spicy Media</h3> <h3>Start als Manager bei Spicy Media</h3>
<p>Dogfather übernimmt die Manager-Rolle, erste Scouts und Creator kommen dazu.</p> <p>Dogfather übernimmt die Manager-Rolle, erste Scouts und Creator kommen dazu.</p>
</div> </div>
<div class="timeline-item"> <div class="timeline-item">
<div class="date">TODO: Datum</div> <div class="date">Datum folgt</div>
<h3>Buch „Hasidog &amp; Casper"</h3> <h3>Buch „Hasidog &amp; Casper"</h3>
<p>Die Geschichte von Dogfather und seinem Husky wird zum Buch.</p> <p>Die Geschichte von Dogfather und seinem Husky wird zum Buch.</p>
</div> </div>
<div class="timeline-item"> <div class="timeline-item">
<div class="date">TODO: Datum</div> <div class="date">Datum folgt</div>
<h3>Kooperation VanVan Teddys</h3> <h3>Kooperation VanVan Teddys</h3>
<p>Merchandise-Kooperation rund um VanVan startet.</p> <p>Merchandise-Kooperation rund um VanVan startet.</p>
</div> </div>
@@ -68,9 +68,7 @@
<p>Die eigene Website vereint alle drei Welten erstmals an einem Ort.</p> <p>Die eigene Website vereint alle drei Welten erstmals an einem Ort.</p>
</div> </div>
</div> </div>
<div class="todo-note"> <!-- TODO: Echte Meilensteine &amp; Daten aus dem Masterplan-Fragenkatalog (Block Zeitreise) ergänzen — Struktur/Timeline-Komponente steht bereits. -->
<strong>TODO:</strong> Echte Meilensteine &amp; Daten aus dem Masterplan-Fragenkatalog (Block Zeitreise) ergänzen — Struktur/Timeline-Komponente steht bereits.
</div>
</div> </div>
</section> </section>
</main> </main>