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

Medien komplett neu strukturiert: 3 Welten (Dogfather/HasiDog/Casper) statt Galerie/Videos/Aktionen getrennt

Browse Source 
Auf Wunsch von Dogi: Medien-Menü zeigt jetzt Dogfather / HasiDog / Casper
statt Galerie / Videos / Aktionen. Jede der 3 neuen Seiten
(medien-dogfather.html / medien-hasidog.html / medien-casper.html) zeigt
alles zu ihrer Welt an einem Ort, sauber in 3 Bereiche kategorisiert:
Fotos, Videos, Events.

- Neu: assets/js/data-media.js (ersetzt gallery.js) - Fotos jetzt mit
  welt: dogfather|hasidog|casper statt dogfather/team/hasidog/manager.
  Team-Mitglieder-Fotos und Logo entfernt (Wunsch Dogi - passen in keine
  der 3 Welten, bleiben weiter auf ihren Profilseiten). Casper-Fotos aus
  der alten "hasidog"-Sammelkategorie sauber herausgelöst. Zusätzliche
  bisher ungenutzte Fotos ergänzt (dogfather-main, char-dogfather,
  manager-dogfather-portrait, char-hasidog, casper-main).
- Neu: assets/js/data-videos.js - Struktur pro Welt vorbereitet (noch
  keine echten Videos vorhanden, Platzhalter "folgt in Kürze")
- data-aktionen.js: alle 4 bestehenden Events als welt:"dogfather"
  getaggt (alles Team-Dogi-weite Community-Aktionen)
- Neu: assets/js/medien-welt.js - eine gemeinsame Render-Logik für alle
  3 Seiten (liest body[data-welt]), rendert Foto-Grid+Lightbox,
  Video-Grid, Events-Grid gefiltert nach Welt
- aktion-detail.html: "Zurück"-Button zeigt jetzt dynamisch auf die
  Events-Sektion der richtigen Welt (aktion.welt)
- main.js NAV: Medien-Untermenü aktualisiert
- Alle Querverweise site-weit korrigiert (casper.html, community.html,
  hasidog.html, index.html, streamer.html) - Anker-Links (#fotos/#videos/
  #events) für Deep-Links direkt in den passenden Bereich
- Alte Dateien gelöscht: medien.html, videos.html, aktionen.html,
  gallery.js
- sitemap.xml aktualisiert
This commit is contained in:
DogFatherGit
2026-08-01 16:30:36 +02:00
parent 47350df0c7
commit e9d0c98aed
19 changed files with 393 additions and 294 deletions
Download Patch File Download Diff File Expand all files Collapse all files
aktion-detail.html
+8 -2
View File
@@ -43,7 +43,7 @@
<section> <section>
<div class="container text-center"> <div class="container text-center">
<a class="btn btn-outline" href="aktionen.html">← Zurück zu allen Aktionen</a> <a class="btn btn-outline" id="aktion-back" href="medien-dogfather.html#events">← Zurück zu allen Events</a>
</div> </div>
</section> </section>
</main> </main>
@@ -61,14 +61,20 @@ document.addEventListener("DOMContentLoaded", () => {
const summaryEl = document.getElementById("aktion-summary"); const summaryEl = document.getElementById("aktion-summary");
const bodyEl = document.getElementById("aktion-body"); const bodyEl = document.getElementById("aktion-body");
const photoEl = document.getElementById("aktion-photo"); const photoEl = document.getElementById("aktion-photo");
const backEl = document.getElementById("aktion-back");
if (!aktion) { if (!aktion) {
titleEl.textContent = "Aktion nicht gefunden"; titleEl.textContent = "Aktion nicht gefunden";
summaryEl.textContent = "Diese Aktion existiert nicht (mehr) oder wurde noch nicht angelegt."; summaryEl.textContent = "Diese Aktion existiert nicht (mehr) oder wurde noch nicht angelegt.";
bodyEl.innerHTML = `<p>Bitte über <a href="aktionen.html">alle Aktionen</a> zurückgehen.</p>`; bodyEl.innerHTML = `<p>Bitte über <a href="medien-dogfather.html#events">alle Events</a> zurückgehen.</p>`;
return; return;
} }
// Zurück-Button zeigt auf die Events-Sektion der passenden Welt
// (jede Aktion gehört zu Dogfather/HasiDog/Casper, siehe data-aktionen.js).
const welt = ["dogfather", "hasidog", "casper"].includes(aktion.welt) ? aktion.welt : "dogfather";
if (backEl) backEl.href = `medien-${welt}.html#events`;
titleEl.textContent = aktion.title; titleEl.textContent = aktion.title;
summaryEl.textContent = aktion.summary; summaryEl.textContent = aktion.summary;
bodyEl.innerHTML = ` bodyEl.innerHTML = `
aktionen.html
-61
View File
@@ -1,61 +0,0 @@
<!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>Aktionen &amp; Projekte — DOGFATHER UNIVERSE</title>
<meta name="description" content="Aktionen und Projekte von Team Dogi: Weihnachtsaktion, Community-Treffen, Kooperationen und mehr." />
<link rel="icon" type="image/png" href="assets/img/favicon.png" />
<meta property="og:type" content="website" />
<meta property="og:site_name" content="DOGFATHER UNIVERSE" />
<meta property="og:title" content="Aktionen &amp; Projekte — DOGFATHER UNIVERSE" />
<meta property="og:description" content="Aktionen und Projekte von Team Dogi: Weihnachtsaktion, Community-Treffen, Kooperationen und mehr." />
<meta property="og:image" content="https://REPLACE-WITH-YOUR-DOMAIN.tld/assets/img/og-cover.jpg" />
<meta property="og:url" content="https://REPLACE-WITH-YOUR-DOMAIN.tld/aktionen.html" />
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="Aktionen &amp; Projekte — DOGFATHER UNIVERSE" />
<meta name="twitter:description" content="Aktionen und Projekte von Team Dogi: Weihnachtsaktion, Community-Treffen, Kooperationen und mehr." />
<meta name="twitter:image" content="https://REPLACE-WITH-YOUR-DOMAIN.tld/assets/img/og-cover.jpg" />
<link rel="stylesheet" href="assets/css/main.css" />
<link rel="stylesheet" href="assets/css/theme-dogfather.css" />
<link rel="stylesheet" href="assets/css/theme-hasidog.css" />
<link rel="stylesheet" href="assets/css/theme-spicymedia.css" />
</head>
<body>
<div id="site-header"></div>
<main>
<section class="hero">
<div class="container">
<span class="eyebrow">Aktionen &amp; Projekte</span>
<h1>Was Team Dogi gerade bewegt</h1>
<p class="lead worlds">Von Tierwohl-Aktionen bis Merchandise-Kooperationen.</p>
</div>
</section>
<section class="section-tight">
<div class="container">
<div id="aktionen-grid" class="grid grid-2"></div>
</div>
</section>
</main>
<div id="site-footer"></div>
<script src="assets/js/data-aktionen.js"></script>
<script src="assets/js/main.js"></script>
<script>
document.addEventListener("DOMContentLoaded", () => {
const grid = document.getElementById("aktionen-grid");
if (!grid || !window.AKTIONEN) return;
grid.innerHTML = window.AKTIONEN.map((a) => `
<a class="card" href="aktion-detail.html?id=${a.id}">
<span class="tag">${a.tag} · ${a.status}</span>
<h3>${a.title}</h3>
<p>${a.summary}</p>
<span class="small" style="color:var(--accent);">Details ansehen →</span>
</a>`).join("");
});
</script>
</body>
</html>
assets/js/data-aktionen.js
+11 -4
View File
@@ -1,15 +1,18 @@
/* ===================================================================== /* =====================================================================
data-aktionen.js — Aktionen & Projekte-Datenobjekt data-aktionen.js — Aktionen & Projekte-Datenobjekt
aktionen.html rendert daraus die Übersichtskarten, aktion-detail.html Die 3 Welten-Medienseiten (medien-dogfather.html / medien-hasidog.html
liest per URL-Parameter (?id=slug) den passenden Eintrag aus und / medien-casper.html) rendern daraus je Welt die passenden Events,
zeigt die Detailansicht — so gibt es EIN Template für alle Aktionen, aktion-detail.html liest per URL-Parameter (?id=slug) den passenden
ohne für jede neue Aktion eine neue HTML-Datei zu brauchen. Eintrag aus und zeigt die Detailansicht — so gibt es EIN Template für
alle Aktionen, ohne für jede neue Aktion eine neue HTML-Datei zu
brauchen.
Felder: Felder:
id – eindeutiger Slug (für aktion-detail.html?id=...) id – eindeutiger Slug (für aktion-detail.html?id=...)
title, summary, description (Array von Absätzen) title, summary, description (Array von Absätzen)
status – "geplant" | "läuft" | "abgeschlossen" status – "geplant" | "läuft" | "abgeschlossen"
welt – "dogfather" | "hasidog" | "casper"
tag – kurzer Kategorie-Text fürs Badge tag – kurzer Kategorie-Text fürs Badge
photo – Pfad zu assets/img/... oder "" für Platzhalter photo – Pfad zu assets/img/... oder "" für Platzhalter
===================================================================== */ ===================================================================== */
@@ -20,6 +23,7 @@ const AKTIONEN = [
title: "Weihnachtsaktion & Portugal-Trip", title: "Weihnachtsaktion & Portugal-Trip",
tag: "Tierwohl", tag: "Tierwohl",
status: "geplant", status: "geplant",
welt: "dogfather",
summary: "Weihnachtsaktion für Tierheime in Portugal — Team Dogi hilft Tieren in Not.", summary: "Weihnachtsaktion für Tierheime in Portugal — Team Dogi hilft Tieren in Not.",
description: [ description: [
"Jedes Jahr organisiert Team Dogi eine Weihnachtsaktion zugunsten von Tierheimen in Portugal.", "Jedes Jahr organisiert Team Dogi eine Weihnachtsaktion zugunsten von Tierheimen in Portugal.",
@@ -32,6 +36,7 @@ const AKTIONEN = [
title: "Community-Treffen (Geburtstag)", title: "Community-Treffen (Geburtstag)",
tag: "Community", tag: "Community",
status: "geplant", status: "geplant",
welt: "dogfather",
summary: "Ein persönliches Treffen mit der Community rund um Dogfathers Geburtstag.", summary: "Ein persönliches Treffen mit der Community rund um Dogfathers Geburtstag.",
description: [ description: [
"Team Dogi ist Familie — deshalb gibt es ein reales Treffen mit der Community.", "Team Dogi ist Familie — deshalb gibt es ein reales Treffen mit der Community.",
@@ -44,6 +49,7 @@ const AKTIONEN = [
title: "Kooperation: VanVan Teddys", title: "Kooperation: VanVan Teddys",
tag: "Merchandise", tag: "Merchandise",
status: "läuft", status: "läuft",
welt: "dogfather",
summary: "Merchandise-Kooperation rund um VanVan — Teddys für die Community.", summary: "Merchandise-Kooperation rund um VanVan — Teddys für die Community.",
description: [ description: [
"Gemeinsam mit VanVan entstehen limitierte Teddys als Teil des Merchandise-Angebots.", "Gemeinsam mit VanVan entstehen limitierte Teddys als Teil des Merchandise-Angebots.",
@@ -56,6 +62,7 @@ const AKTIONEN = [
title: "Online-Shop (in Planung)", title: "Online-Shop (in Planung)",
tag: "Merchandise", tag: "Merchandise",
status: "geplant", status: "geplant",
welt: "dogfather",
summary: "Der eigene Online-Shop für Tassen, Decken, Popsockets, Schlüsselanhänger, Sticker & mehr.", summary: "Der eigene Online-Shop für Tassen, Decken, Popsockets, Schlüsselanhänger, Sticker & mehr.",
description: [ description: [
"Aktuell läuft der Merchandise-Vertrieb nur über private Einzelbestellungen.", "Aktuell läuft der Merchandise-Vertrieb nur über private Einzelbestellungen.",
assets/js/data-media.js
+38
View File
@@ -0,0 +1,38 @@
/* =====================================================================
data-media.js — Foto-Datenobjekt für die 3 Welten-Medienseiten
(medien-dogfather.html / medien-hasidog.html / medien-casper.html)
Ersetzt das frühere gallery.js (eine gemeinsame Galerie mit
"dogfather/team/hasidog/manager"-Filter) — auf Wunsch von Dogi gibt es
jetzt genau 3 Welten: dogfather, hasidog, casper. Team-Mitglieder-Fotos
und das Logo passen in keine der 3 Welten und wurden bewusst entfernt
(bleiben aber weiterhin auf ihren eigenen Profilseiten sichtbar).
Felder pro Foto: { id, welt: "dogfather"|"hasidog"|"casper", alt, src }
===================================================================== */
const MEDIA = [
// ---- Dogfather ----
{ id: 1, welt: "dogfather", alt: "Dogfather Profilbild", src: "assets/img/dogfather-portrait.jpg" },
{ id: 2, welt: "dogfather", alt: "Dogfather — Team Dogi Karte", src: "assets/img/card-dogfather.jpg" },
{ id: 3, welt: "dogfather", alt: "Dogfather Hauptfoto", src: "assets/img/dogfather-main.jpg" },
{ id: 4, welt: "dogfather", alt: "Dogfather Charakter-Artwork", src: "assets/img/char-dogfather.jpg" },
{ id: 5, welt: "dogfather", alt: "Dogfather als Manager", src: "assets/img/manager-dogfather-portrait.jpg" },
// ---- HasiDog ----
{ id: 6, welt: "hasidog", alt: "HasiDog — das Maskottchen", src: "assets/img/char-hasidog.jpg" },
{ id: 7, welt: "hasidog", alt: "HasiDog &amp; Casper Sticker", src: "assets/img/sticker-hasidog-casper.png" },
{ id: 8, welt: "hasidog", alt: "Schlaft schön — Buch-Illustration", src: "assets/img/hasidog-casper-book.jpg" },
// ---- Casper ----
{ id: 9, welt: "casper", alt: "Casper Hauptfoto", src: "assets/img/casper-main.jpg" },
{ id: 10, welt: "casper", alt: "Husky Casper", src: "assets/img/casper-1.jpg" },
{ id: 11, welt: "casper", alt: "Casper unterwegs", src: "assets/img/casper-2.jpg" },
{ id: 12, welt: "casper", alt: "Casper", src: "assets/img/casper-3.jpg" },
{ id: 13, welt: "casper", alt: "Casper", src: "assets/img/casper-4.jpg" },
{ id: 14, welt: "casper", alt: "Casper &amp; Dogfather", src: "assets/img/dogfather-casper-1.jpg" },
{ id: 15, welt: "casper", alt: "Dogfather &amp; Casper Nase an Nase", src: "assets/img/dogfather-casper-2.jpg" },
// TODO: Aktionen-Fotos (Weihnachtsaktion, VanVan-Teddys) ergänzen, sobald vorhanden.
];
if (typeof window !== "undefined") window.MEDIA = MEDIA;
assets/js/data-videos.js
+21
View File
@@ -0,0 +1,21 @@
/* =====================================================================
data-videos.js — Video-Datenobjekt für die 3 Welten-Medienseiten
Bisher gibt es noch keine echten TikTok-Video-Links/Embeds — die
Struktur steht aber pro Welt bereit, damit nur noch echte Videos
eingetragen werden müssen (src leer = Platzhalter "folgt in Kürze").
Felder pro Video: { id, welt: "dogfather"|"hasidog"|"casper", title, src }
===================================================================== */
const VIDEOS = [
{ id: 1, welt: "dogfather", title: "Streamer-Highlight", src: "" },
{ id: 2, welt: "dogfather", title: "Halligalli-Moment", src: "" },
{ id: 3, welt: "hasidog", title: "HasiDog-Chaos", src: "" },
{ id: 4, welt: "hasidog", title: "Musik-Clip", src: "" },
{ id: 5, welt: "casper", title: "Casper-Moment", src: "" },
{ id: 6, welt: "casper", title: "Husky-Chaos", src: "" },
// TODO: Echte TikTok-Video-Links/Embeds ergänzen, sobald verfügbar.
];
if (typeof window !== "undefined") window.VIDEOS = VIDEOS;
assets/js/gallery.js
-94
View File
@@ -1,94 +0,0 @@
/* =====================================================================
gallery.js — filterbare Mediengalerie + Lightbox (für medien.html)
MEDIA-Array unten mit echten Bildern befüllen sobald verfügbar
(assets/img/...). Bis dahin rendert jeder Eintrag ohne "src" einen
Platzhalter-Block mit passendem Alt-Text, damit die Struktur schon
steht und nur noch Bilder eingehängt werden müssen.
===================================================================== */
const MEDIA = [
{ id: 1, category: "dogfather", alt: "Dogfather Profilbild", src: "assets/img/dogfather-portrait.jpg" },
{ id: 2, category: "dogfather", alt: "Dogfather — Team Dogi Karte", src: "assets/img/card-dogfather.jpg" },
{ id: 3, category: "team", alt: "VanVan — Team Dogi Karte", src: "assets/img/card-vanvan.jpg" },
{ id: 4, category: "team", alt: "Diene — Team Dogi Karte", src: "assets/img/card-diene.jpg" },
{ id: 5, category: "team", alt: "Miss — Team Dogi Karte", src: "assets/img/card-miss.jpg" },
{ id: 6, category: "team", alt: "Marina alias FlauschiRex — Team Dogi Karte", src: "assets/img/card-marina.jpg" },
{ id: 7, category: "hasidog", alt: "HasiDog &amp; Casper Sticker", src: "assets/img/sticker-hasidog-casper.png" },
{ id: 8, category: "hasidog", alt: "Husky Casper", src: "assets/img/casper-1.jpg" },
{ id: 9, category: "hasidog", alt: "Casper &amp; Dogfather", src: "assets/img/dogfather-casper-1.jpg" },
{ id: 10, category: "hasidog", alt: "Casper", src: "assets/img/casper-3.jpg" },
{ id: 11, category: "hasidog", alt: "Casper", src: "assets/img/casper-4.jpg" },
{ id: 12, category: "hasidog", alt: "Dogfather &amp; Casper Nase an Nase", src: "assets/img/dogfather-casper-2.jpg" },
{ id: 13, category: "hasidog", alt: "Schlaft schön — Buch-Illustration", src: "assets/img/hasidog-casper-book.jpg" },
{ id: 14, category: "hasidog", alt: "Casper unterwegs", src: "assets/img/casper-2.jpg" },
{ id: 15, category: "manager", alt: "Dogfather Logo", src: "assets/img/logo-dogfather.png" },
// TODO: Aktionen-Fotos (Weihnachtsaktion, VanVan-Teddys) ergänzen, sobald vorhanden.
];
function renderGalleryItem(item) {
const media = item.src
? `<img src="${item.src}" alt="${item.alt}" loading="lazy" />`
: `<div class="img-placeholder">${item.alt}<br><span class="small">Foto folgt</span></div>`;
return `
<figure class="gallery-item card" data-category="${item.category}" data-index="${item.id}">
${media}
<figcaption class="small muted" style="margin-top:.6rem;">${item.alt}</figcaption>
</figure>`;
}
function initGallery() {
const grid = document.getElementById("gallery-grid");
const filterBar = document.getElementById("gallery-filters");
if (!grid || !filterBar) return;
const categories = ["alle", ...new Set(MEDIA.map((m) => m.category))];
filterBar.innerHTML = categories
.map(
(c, i) =>
`<button class="filter-btn${i === 0 ? " active" : ""}" data-filter="${c}">${c[0].toUpperCase() + c.slice(1)}</button>`
)
.join("");
function draw(filter) {
const items = filter === "alle" ? MEDIA : MEDIA.filter((m) => m.category === filter);
grid.innerHTML = items.map(renderGalleryItem).join("") || `<p class="muted">Keine Bilder in dieser Kategorie.</p>`;
bindLightbox();
}
filterBar.addEventListener("click", (e) => {
const btn = e.target.closest(".filter-btn");
if (!btn) return;
filterBar.querySelectorAll(".filter-btn").forEach((b) => b.classList.remove("active"));
btn.classList.add("active");
draw(btn.dataset.filter);
});
function bindLightbox() {
const lb = document.getElementById("lightbox");
const lbContent = document.getElementById("lightbox-content");
if (!lb || !lbContent) return;
grid.querySelectorAll(".gallery-item").forEach((el) => {
el.addEventListener("click", () => {
lbContent.innerHTML = el.innerHTML;
lb.classList.add("open");
});
});
}
draw("alle");
const lb = document.getElementById("lightbox");
if (lb) {
lb.addEventListener("click", (e) => {
if (e.target === lb || e.target.closest(".lightbox-close")) {
lb.classList.remove("open");
}
});
document.addEventListener("keydown", (e) => {
if (e.key === "Escape") lb.classList.remove("open");
});
}
}
document.addEventListener("DOMContentLoaded", initGallery);
assets/js/main.js
+7 -3
View File
@@ -43,11 +43,15 @@
], ],
}, },
{ {
// Medien ist bewusst nach den 3 Welten aufgeteilt statt nach
// Foto/Video/Aktionen getrennt zu sein — Wunsch von Dogi: pro Welt
// (Dogfather/HasiDog/Casper) gibt es EINE Seite mit allem
// kategorisiert (Fotos, Videos, Events), siehe medien-*.html.
label: "Medien", label: "Medien",
children: [ children: [
{ label: "Galerie", href: "medien.html" }, { label: "Dogfather", href: "medien-dogfather.html" },
{ label: "Videos", href: "videos.html" }, { label: "HasiDog", href: "medien-hasidog.html" },
{ label: "Aktionen", href: "aktionen.html" }, { label: "Casper", href: "medien-casper.html" },
], ],
}, },
{ label: "Links", href: "links.html" }, { label: "Links", href: "links.html" },
assets/js/medien-welt.js
+78
View File
@@ -0,0 +1,78 @@
/* =====================================================================
medien-welt.js — gemeinsame Render-Logik für die 3 Welten-Medienseiten
(medien-dogfather.html / medien-hasidog.html / medien-casper.html)
Jede der 3 Seiten setzt <body data-welt="dogfather|hasidog|casper"> und
lädt data-media.js, data-videos.js, data-aktionen.js VOR dieser Datei —
so gibt es EIN Template/Skript für alle 3 Welten, ohne Code-Verdopplung.
===================================================================== */
function renderFotoItem(item) {
const media = item.src
? `<img src="${item.src}" alt="${item.alt}" loading="lazy" />`
: `<div class="img-placeholder">${item.alt}<br><span class="small">Foto folgt</span></div>`;
return `<figure class="gallery-item card">${media}<figcaption class="small muted" style="margin-top:.6rem;">${item.alt}</figcaption></figure>`;
}
function renderVideoItem(item) {
const media = item.src
? `<video src="${item.src}" controls style="width:100%;aspect-ratio:9/16;object-fit:cover;border-radius:8px;"></video>`
: `<div class="img-placeholder" style="aspect-ratio:9/16;">${item.title}<br><span class="small">Video folgt</span></div>`;
return `<figure class="card">${media}<figcaption class="small muted" style="margin-top:.6rem;">${item.title}</figcaption></figure>`;
}
function renderAktionItem(a) {
return `
<a class="card" href="aktion-detail.html?id=${a.id}">
<span class="tag">${a.tag} · ${a.status}</span>
<h3>${a.title}</h3>
<p>${a.summary}</p>
<span class="small" style="color:var(--accent);">Details ansehen →</span>
</a>`;
}
function bindLightbox() {
const lb = document.getElementById("lightbox");
const lbContent = document.getElementById("lightbox-content");
if (!lb || !lbContent) return;
document.querySelectorAll("#foto-grid .gallery-item").forEach((el) => {
el.addEventListener("click", () => {
lbContent.innerHTML = el.innerHTML;
lb.classList.add("open");
});
});
}
document.addEventListener("DOMContentLoaded", () => {
const welt = document.body.dataset.welt;
if (!welt) return;
const fotoGrid = document.getElementById("foto-grid");
if (fotoGrid) {
const fotos = (window.MEDIA || []).filter((m) => m.welt === welt);
fotoGrid.innerHTML = fotos.map(renderFotoItem).join("") || `<p class="muted">Noch keine Fotos in dieser Welt.</p>`;
bindLightbox();
}
const videoGrid = document.getElementById("video-grid");
if (videoGrid) {
const videos = (window.VIDEOS || []).filter((v) => v.welt === welt);
videoGrid.innerHTML = videos.map(renderVideoItem).join("") || `<p class="muted">Noch keine Videos in dieser Welt.</p>`;
}
const aktionenGrid = document.getElementById("aktionen-grid");
if (aktionenGrid) {
const aktionen = (window.AKTIONEN || []).filter((a) => a.welt === welt);
aktionenGrid.innerHTML = aktionen.map(renderAktionItem).join("") || `<p class="muted">Aktuell keine Events in dieser Welt.</p>`;
}
const lb = document.getElementById("lightbox");
if (lb) {
lb.addEventListener("click", (e) => {
if (e.target === lb || e.target.closest(".lightbox-close")) lb.classList.remove("open");
});
document.addEventListener("keydown", (e) => {
if (e.key === "Escape") lb.classList.remove("open");
});
}
});
casper.html
+1 -1
View File
@@ -76,7 +76,7 @@
<div class="collage-photo frame-tuerkis" 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 frame-tuerkis" 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;">
<a class="btn btn-outline" href="medien.html">Zur ganzen Galerie</a> <a class="btn btn-outline" href="medien-casper.html#fotos">Zur ganzen Galerie</a>
</div> </div>
</div> </div>
</section> </section>
community.html
+1 -1
View File
@@ -74,7 +74,7 @@
<div class="card text-center"><h3>💬 Offenes Ohr</h3><p>Immer erreichbar, immer präsent.</p></div> <div class="card text-center"><h3>💬 Offenes Ohr</h3><p>Immer erreichbar, immer präsent.</p></div>
</div> </div>
<div class="btn-row" style="justify-content:center;"> <div class="btn-row" style="justify-content:center;">
<a class="btn btn-outline" href="aktionen.html">Community-Aktionen ansehen</a> <a class="btn btn-outline" href="medien-dogfather.html#events">Community-Aktionen ansehen</a>
<a class="btn btn-outline" href="stimmen.html">Stimmen aus der Community</a> <a class="btn btn-outline" href="stimmen.html">Stimmen aus der Community</a>
</div> </div>
</div> </div>
hasidog.html
+2 -2
View File
@@ -175,8 +175,8 @@
<div class="btn-row" style="justify-content:center;"> <div class="btn-row" style="justify-content:center;">
<a class="btn btn-primary" href="https://open.spotify.com/intl-de/artist/2INiE1VVJGUQdEURsltuJU" target="_blank" rel="noopener">🎵 HasiDog-Musik entdecken</a> <a class="btn btn-primary" href="https://open.spotify.com/intl-de/artist/2INiE1VVJGUQdEURsltuJU" target="_blank" rel="noopener">🎵 HasiDog-Musik entdecken</a>
<a class="btn btn-secondary" href="casper.html">🐺 Casper kennenlernen</a> <a class="btn btn-secondary" href="casper.html">🐺 Casper kennenlernen</a>
<a class="btn btn-outline" href="videos.html">🎥 Videos ansehen</a> <a class="btn btn-outline" href="medien-hasidog.html#videos">🎥 Videos ansehen</a>
<a class="btn btn-outline" href="medien.html">📸 Galerie öffnen</a> <a class="btn btn-outline" href="medien-hasidog.html#fotos">📸 Galerie öffnen</a>
<a class="btn btn-outline" href="community.html">👨‍👩‍👧‍👦 Die HasiDog-Familie entdecken</a> <a class="btn btn-outline" href="community.html">👨‍👩‍👧‍👦 Die HasiDog-Familie entdecken</a>
</div> </div>
</div> </div>
index.html
+5 -5
View File
@@ -166,9 +166,9 @@
<a class="card" href="community.html"><h3>🩵 Community</h3><p class="small">Team Dogi ist Familie.</p></a> <a class="card" href="community.html"><h3>🩵 Community</h3><p class="small">Team Dogi ist Familie.</p></a>
<a class="card" href="casper.html"><h3>🐾 Casper</h3><p class="small">Der Husky an Dogfathers Seite.</p></a> <a class="card" href="casper.html"><h3>🐾 Casper</h3><p class="small">Der Husky an Dogfathers Seite.</p></a>
<a class="card" href="team-modis.html"><h3>🧑‍🤝‍🧑 Modi-Team</h3><p class="small">VanVan, Diene &amp; Co.</p></a> <a class="card" href="team-modis.html"><h3>🧑‍🤝‍🧑 Modi-Team</h3><p class="small">VanVan, Diene &amp; Co.</p></a>
<a class="card" href="aktionen.html"><h3>🎁 Aktionen</h3><p class="small">Projekte, Kooperationen, Tierwohl.</p></a> <a class="card" href="medien-dogfather.html"><h3>🖼️ Medien: Dogfather</h3><p class="small">Fotos, Videos &amp; Events.</p></a>
<a class="card" href="medien.html"><h3>🖼️ Galerie</h3><p class="small">Fotos aus allen drei Welten.</p></a> <a class="card" href="medien-hasidog.html"><h3>🐰 Medien: HasiDog</h3><p class="small">Fotos, Videos &amp; Events.</p></a>
<a class="card" href="videos.html"><h3>▶️ Videos</h3><p class="small">Die besten Highlights.</p></a> <a class="card" href="medien-casper.html"><h3>🐺 Medien: Casper</h3><p class="small">Fotos, Videos &amp; Events.</p></a>
</div> </div>
</div> </div>
</section> </section>
@@ -192,7 +192,7 @@
<h2 class="text-center">Was gerade läuft</h2> <h2 class="text-center">Was gerade läuft</h2>
<div id="aktionen-teaser" class="grid grid-3"></div> <div id="aktionen-teaser" class="grid grid-3"></div>
<div class="btn-row" style="justify-content:center;"> <div class="btn-row" style="justify-content:center;">
<a class="btn btn-outline" href="aktionen.html">Alle Aktionen &amp; Projekte</a> <a class="btn btn-outline" href="medien-dogfather.html#events">Alle Aktionen &amp; Projekte</a>
</div> </div>
</div> </div>
</section> </section>
@@ -208,7 +208,7 @@
<div class="collage-photo frame-gold" 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 frame-gold" 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;">
<a class="btn btn-outline" href="medien.html">Zur ganzen Galerie</a> <a class="btn btn-outline" href="medien-dogfather.html">Zur ganzen Galerie</a>
</div> </div>
</div> </div>
</section> </section>
medien-casper.html
+72
View File
@@ -0,0 +1,72 @@
<!DOCTYPE html>
<html lang="de" data-theme="hasidog">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Medien — Casper — DOGFATHER UNIVERSE</title>
<meta name="description" content="Fotos, Videos und Events rund um Husky Casper an einem Ort." />
<link rel="icon" type="image/png" href="assets/img/favicon.png" />
<meta property="og:type" content="website" />
<meta property="og:site_name" content="DOGFATHER UNIVERSE" />
<meta property="og:title" content="Medien — Casper — DOGFATHER UNIVERSE" />
<meta property="og:description" content="Fotos, Videos und Events rund um Husky Casper an einem Ort." />
<meta property="og:image" content="https://REPLACE-WITH-YOUR-DOMAIN.tld/assets/img/og-cover.jpg" />
<meta property="og:url" content="https://REPLACE-WITH-YOUR-DOMAIN.tld/medien-casper.html" />
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="Medien — Casper — DOGFATHER UNIVERSE" />
<meta name="twitter:description" content="Fotos, Videos und Events rund um Husky Casper an einem Ort." />
<meta name="twitter:image" content="https://REPLACE-WITH-YOUR-DOMAIN.tld/assets/img/og-cover.jpg" />
<link rel="stylesheet" href="assets/css/main.css" />
<link rel="stylesheet" href="assets/css/theme-dogfather.css" />
<link rel="stylesheet" href="assets/css/theme-hasidog.css" />
<link rel="stylesheet" href="assets/css/theme-spicymedia.css" />
</head>
<body class="mit-hintergrund" data-welt="casper" style="--page-bg:url('/assets/img/bg-casper.jpg');--page-bg-mobile:url('/assets/img/bg-casper-mobile.jpg');">
<div id="site-header"></div>
<main>
<section class="hero page-bg">
<div class="hero-banner"><img src="/assets/img/bg-casper.jpg" alt="" loading="eager" /></div>
<div class="container">
<span class="eyebrow">Welt 2 — HasiDog</span>
<h1>Medien — Casper</h1>
<p class="lead worlds">Fotos, Videos und Events rund um Husky Casper — alles an einem Ort.</p>
</div>
</section>
<section class="section-tight" id="fotos">
<div class="container">
<h2 class="text-center">📸 Fotos</h2>
<div id="foto-grid" class="grid grid-4"></div>
</div>
</section>
<section class="section-tight" id="videos">
<div class="container">
<h2 class="text-center">🎥 Videos</h2>
<div id="video-grid" class="grid grid-3"></div>
</div>
</section>
<section class="section-tight" id="events">
<div class="container">
<h2 class="text-center">🎉 Events</h2>
<div id="aktionen-grid" class="grid grid-2"></div>
</div>
</section>
</main>
<div id="lightbox" class="lightbox">
<button class="lightbox-close" aria-label="Schließen">×</button>
<div id="lightbox-content"></div>
</div>
<div id="site-footer"></div>
<script src="assets/js/data-media.js"></script>
<script src="assets/js/data-videos.js"></script>
<script src="assets/js/data-aktionen.js"></script>
<script src="assets/js/medien-welt.js"></script>
<script src="assets/js/main.js"></script>
</body>
</html>
medien-dogfather.html
+72
View File
@@ -0,0 +1,72 @@
<!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>Medien — Dogfather — DOGFATHER UNIVERSE</title>
<meta name="description" content="Fotos, Videos und Events aus Dogfathers Welt an einem Ort." />
<link rel="icon" type="image/png" href="assets/img/favicon.png" />
<meta property="og:type" content="website" />
<meta property="og:site_name" content="DOGFATHER UNIVERSE" />
<meta property="og:title" content="Medien — Dogfather — DOGFATHER UNIVERSE" />
<meta property="og:description" content="Fotos, Videos und Events aus Dogfathers Welt an einem Ort." />
<meta property="og:image" content="https://REPLACE-WITH-YOUR-DOMAIN.tld/assets/img/og-cover.jpg" />
<meta property="og:url" content="https://REPLACE-WITH-YOUR-DOMAIN.tld/medien-dogfather.html" />
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="Medien — Dogfather — DOGFATHER UNIVERSE" />
<meta name="twitter:description" content="Fotos, Videos und Events aus Dogfathers Welt an einem Ort." />
<meta name="twitter:image" content="https://REPLACE-WITH-YOUR-DOMAIN.tld/assets/img/og-cover.jpg" />
<link rel="stylesheet" href="assets/css/main.css" />
<link rel="stylesheet" href="assets/css/theme-dogfather.css" />
<link rel="stylesheet" href="assets/css/theme-hasidog.css" />
<link rel="stylesheet" href="assets/css/theme-spicymedia.css" />
</head>
<body class="mit-hintergrund" data-welt="dogfather" style="--page-bg:url('/assets/img/bg-dogfather.jpg');--page-bg-mobile:url('/assets/img/bg-dogfather-mobile.jpg');">
<div id="site-header"></div>
<main>
<section class="hero page-bg">
<div class="hero-banner"><img src="/assets/img/bg-dogfather.jpg" alt="" loading="eager" /></div>
<div class="container">
<span class="eyebrow">Welt 1 — Dogfather</span>
<h1>Medien — Dogfather</h1>
<p class="lead worlds">Fotos, Videos und Events aus Dogfathers Welt — alles an einem Ort.</p>
</div>
</section>
<section class="section-tight" id="fotos">
<div class="container">
<h2 class="text-center">📸 Fotos</h2>
<div id="foto-grid" class="grid grid-4"></div>
</div>
</section>
<section class="section-tight" id="videos">
<div class="container">
<h2 class="text-center">🎥 Videos</h2>
<div id="video-grid" class="grid grid-3"></div>
</div>
</section>
<section class="section-tight" id="events">
<div class="container">
<h2 class="text-center">🎉 Events</h2>
<div id="aktionen-grid" class="grid grid-2"></div>
</div>
</section>
</main>
<div id="lightbox" class="lightbox">
<button class="lightbox-close" aria-label="Schließen">×</button>
<div id="lightbox-content"></div>
</div>
<div id="site-footer"></div>
<script src="assets/js/data-media.js"></script>
<script src="assets/js/data-videos.js"></script>
<script src="assets/js/data-aktionen.js"></script>
<script src="assets/js/medien-welt.js"></script>
<script src="assets/js/main.js"></script>
</body>
</html>
medien-hasidog.html
+72
View File
@@ -0,0 +1,72 @@
<!DOCTYPE html>
<html lang="de" data-theme="hasidog">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Medien — HasiDog — DOGFATHER UNIVERSE</title>
<meta name="description" content="Fotos, Videos und Events aus der HasiDog-Welt an einem Ort." />
<link rel="icon" type="image/png" href="assets/img/favicon.png" />
<meta property="og:type" content="website" />
<meta property="og:site_name" content="DOGFATHER UNIVERSE" />
<meta property="og:title" content="Medien — HasiDog — DOGFATHER UNIVERSE" />
<meta property="og:description" content="Fotos, Videos und Events aus der HasiDog-Welt an einem Ort." />
<meta property="og:image" content="https://REPLACE-WITH-YOUR-DOMAIN.tld/assets/img/og-cover.jpg" />
<meta property="og:url" content="https://REPLACE-WITH-YOUR-DOMAIN.tld/medien-hasidog.html" />
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="Medien — HasiDog — DOGFATHER UNIVERSE" />
<meta name="twitter:description" content="Fotos, Videos und Events aus der HasiDog-Welt an einem Ort." />
<meta name="twitter:image" content="https://REPLACE-WITH-YOUR-DOMAIN.tld/assets/img/og-cover.jpg" />
<link rel="stylesheet" href="assets/css/main.css" />
<link rel="stylesheet" href="assets/css/theme-dogfather.css" />
<link rel="stylesheet" href="assets/css/theme-hasidog.css" />
<link rel="stylesheet" href="assets/css/theme-spicymedia.css" />
</head>
<body class="mit-hintergrund" data-welt="hasidog" style="--page-bg:url('/assets/img/bg-hasidog.jpg');--page-bg-mobile:url('/assets/img/bg-hasidog-mobile.jpg');">
<div id="site-header"></div>
<main>
<section class="hero page-bg">
<div class="hero-banner"><img src="/assets/img/bg-hasidog.jpg" alt="" loading="eager" /></div>
<div class="container">
<span class="eyebrow">Welt 2 — HasiDog</span>
<h1>Medien — HasiDog</h1>
<p class="lead worlds">Fotos, Videos und Events aus der HasiDog-Welt — alles an einem Ort.</p>
</div>
</section>
<section class="section-tight" id="fotos">
<div class="container">
<h2 class="text-center">📸 Fotos</h2>
<div id="foto-grid" class="grid grid-4"></div>
</div>
</section>
<section class="section-tight" id="videos">
<div class="container">
<h2 class="text-center">🎥 Videos</h2>
<div id="video-grid" class="grid grid-3"></div>
</div>
</section>
<section class="section-tight" id="events">
<div class="container">
<h2 class="text-center">🎉 Events</h2>
<div id="aktionen-grid" class="grid grid-2"></div>
</div>
</section>
</main>
<div id="lightbox" class="lightbox">
<button class="lightbox-close" aria-label="Schließen">×</button>
<div id="lightbox-content"></div>
</div>
<div id="site-footer"></div>
<script src="assets/js/data-media.js"></script>
<script src="assets/js/data-videos.js"></script>
<script src="assets/js/data-aktionen.js"></script>
<script src="assets/js/medien-welt.js"></script>
<script src="assets/js/main.js"></script>
</body>
</html>
medien.html
-55
View File
@@ -1,55 +0,0 @@
<!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>Medien-Galerie — DOGFATHER UNIVERSE</title>
<meta name="description" content="Alle Bilder von Dogfather, Team, HasiDog/Casper und Manager Dogfather an einem Ort — filterbar." />
<link rel="icon" type="image/png" href="assets/img/favicon.png" />
<meta property="og:type" content="website" />
<meta property="og:site_name" content="DOGFATHER UNIVERSE" />
<meta property="og:title" content="Medien-Galerie — DOGFATHER UNIVERSE" />
<meta property="og:description" content="Alle Bilder von Dogfather, Team, HasiDog/Casper und Manager Dogfather an einem Ort — filterbar." />
<meta property="og:image" content="https://REPLACE-WITH-YOUR-DOMAIN.tld/assets/img/og-cover.jpg" />
<meta property="og:url" content="https://REPLACE-WITH-YOUR-DOMAIN.tld/medien.html" />
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="Medien-Galerie — DOGFATHER UNIVERSE" />
<meta name="twitter:description" content="Alle Bilder von Dogfather, Team, HasiDog/Casper und Manager Dogfather an einem Ort — filterbar." />
<meta name="twitter:image" content="https://REPLACE-WITH-YOUR-DOMAIN.tld/assets/img/og-cover.jpg" />
<link rel="stylesheet" href="assets/css/main.css" />
<link rel="stylesheet" href="assets/css/theme-dogfather.css" />
<link rel="stylesheet" href="assets/css/theme-hasidog.css" />
<link rel="stylesheet" href="assets/css/theme-spicymedia.css" />
</head>
<body>
<div id="site-header"></div>
<main>
<section class="hero">
<div class="container">
<span class="eyebrow">Medien</span>
<h1>Galerie</h1>
<p class="lead worlds">Bilder aus allen drei Welten — filterbar nach Kategorie.</p>
</div>
</section>
<section class="section-tight">
<div class="container">
<div class="filter-bar" id="gallery-filters"></div>
<div id="gallery-grid" class="grid grid-4"></div>
<!-- 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. -->
</div>
</section>
</main>
<div id="lightbox" class="lightbox">
<button class="lightbox-close" aria-label="Schließen">×</button>
<div id="lightbox-content"></div>
</div>
<div id="site-footer"></div>
<script src="assets/js/gallery.js"></script>
<script src="assets/js/main.js"></script>
</body>
</html>
sitemap.xml
+3 -3
View File
@@ -8,10 +8,10 @@
<url><loc>https://REPLACE-WITH-YOUR-DOMAIN.tld/community.html</loc><lastmod>2026-07-30</lastmod></url> <url><loc>https://REPLACE-WITH-YOUR-DOMAIN.tld/community.html</loc><lastmod>2026-07-30</lastmod></url>
<url><loc>https://REPLACE-WITH-YOUR-DOMAIN.tld/hasidog.html</loc><lastmod>2026-07-30</lastmod></url> <url><loc>https://REPLACE-WITH-YOUR-DOMAIN.tld/hasidog.html</loc><lastmod>2026-07-30</lastmod></url>
<url><loc>https://REPLACE-WITH-YOUR-DOMAIN.tld/casper.html</loc><lastmod>2026-07-30</lastmod></url> <url><loc>https://REPLACE-WITH-YOUR-DOMAIN.tld/casper.html</loc><lastmod>2026-07-30</lastmod></url>
<url><loc>https://REPLACE-WITH-YOUR-DOMAIN.tld/aktionen.html</loc><lastmod>2026-07-30</lastmod></url>
<url><loc>https://REPLACE-WITH-YOUR-DOMAIN.tld/zeitreise.html</loc><lastmod>2026-07-30</lastmod></url> <url><loc>https://REPLACE-WITH-YOUR-DOMAIN.tld/zeitreise.html</loc><lastmod>2026-07-30</lastmod></url>
<url><loc>https://REPLACE-WITH-YOUR-DOMAIN.tld/medien.html</loc><lastmod>2026-07-30</lastmod></url> <url><loc>https://REPLACE-WITH-YOUR-DOMAIN.tld/medien-dogfather.html</loc><lastmod>2026-08-01</lastmod></url>
<url><loc>https://REPLACE-WITH-YOUR-DOMAIN.tld/videos.html</loc><lastmod>2026-07-30</lastmod></url> <url><loc>https://REPLACE-WITH-YOUR-DOMAIN.tld/medien-hasidog.html</loc><lastmod>2026-08-01</lastmod></url>
<url><loc>https://REPLACE-WITH-YOUR-DOMAIN.tld/medien-casper.html</loc><lastmod>2026-08-01</lastmod></url>
<url><loc>https://REPLACE-WITH-YOUR-DOMAIN.tld/links.html</loc><lastmod>2026-07-30</lastmod></url> <url><loc>https://REPLACE-WITH-YOUR-DOMAIN.tld/links.html</loc><lastmod>2026-07-30</lastmod></url>
<url><loc>https://REPLACE-WITH-YOUR-DOMAIN.tld/manager.html</loc><lastmod>2026-07-30</lastmod></url> <url><loc>https://REPLACE-WITH-YOUR-DOMAIN.tld/manager.html</loc><lastmod>2026-07-30</lastmod></url>
<url><loc>https://REPLACE-WITH-YOUR-DOMAIN.tld/werte.html</loc><lastmod>2026-07-30</lastmod></url> <url><loc>https://REPLACE-WITH-YOUR-DOMAIN.tld/werte.html</loc><lastmod>2026-07-30</lastmod></url>
streamer.html
+2 -2
View File
@@ -151,8 +151,8 @@
<p><strong>– DogFather 🩵</strong></p> <p><strong>– DogFather 🩵</strong></p>
<div class="btn-row" style="justify-content:center;"> <div class="btn-row" style="justify-content:center;">
<a class="btn btn-primary" href="streamplan.html">📅 Streamingplan öffnen</a> <a class="btn btn-primary" href="streamplan.html">📅 Streamingplan öffnen</a>
<a class="btn btn-secondary" href="videos.html">🎞️ Video-Highlights entdecken</a> <a class="btn btn-secondary" href="medien-dogfather.html#videos">🎞️ Video-Highlights entdecken</a>
<a class="btn btn-outline" href="medien.html">📸 Foto-Galerie ansehen</a> <a class="btn btn-outline" href="medien-dogfather.html#fotos">📸 Foto-Galerie ansehen</a>
<a class="btn btn-outline" href="community.html">🩵 Team Dogi kennenlernen</a> <a class="btn btn-outline" href="community.html">🩵 Team Dogi kennenlernen</a>
<a class="btn btn-outline" href="https://www.instagram.com/sf0118?igsh=MWo2eXFlcXFicXN5OQ==" target="_blank" rel="noopener">📱 DogFather auf Instagram</a> <a class="btn btn-outline" href="https://www.instagram.com/sf0118?igsh=MWo2eXFlcXFicXN5OQ==" target="_blank" rel="noopener">📱 DogFather auf Instagram</a>
<a class="btn btn-outline" href="https://www.snapchat.com/add/dogfather0804?share_id=m8mR6ylEtLo&amp;locale=de-DE" target="_blank" rel="noopener">👻 DogFather auf Snapchat</a> <a class="btn btn-outline" href="https://www.snapchat.com/add/dogfather0804?share_id=m8mR6ylEtLo&amp;locale=de-DE" target="_blank" rel="noopener">👻 DogFather auf Snapchat</a>
videos.html
-61
View File
@@ -1,61 +0,0 @@
<!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>Video-Highlights — DOGFATHER UNIVERSE</title>
<meta name="description" content="Video-Highlights von Dogfather." />
<link rel="icon" type="image/png" href="assets/img/favicon.png" />
<meta property="og:type" content="website" />
<meta property="og:site_name" content="DOGFATHER UNIVERSE" />
<meta property="og:title" content="Video-Highlights — DOGFATHER UNIVERSE" />
<meta property="og:description" content="Video-Highlights von Dogfather." />
<meta property="og:image" content="https://REPLACE-WITH-YOUR-DOMAIN.tld/assets/img/og-cover.jpg" />
<meta property="og:url" content="https://REPLACE-WITH-YOUR-DOMAIN.tld/videos.html" />
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="Video-Highlights — DOGFATHER UNIVERSE" />
<meta name="twitter:description" content="Video-Highlights von Dogfather." />
<meta name="twitter:image" content="https://REPLACE-WITH-YOUR-DOMAIN.tld/assets/img/og-cover.jpg" />
<link rel="stylesheet" href="assets/css/main.css" />
<link rel="stylesheet" href="assets/css/theme-dogfather.css" />
<link rel="stylesheet" href="assets/css/theme-hasidog.css" />
<link rel="stylesheet" href="assets/css/theme-spicymedia.css" />
</head>
<body>
<div id="site-header"></div>
<main>
<section class="hero">
<div class="container">
<span class="eyebrow">Medien</span>
<h1>Video-Highlights</h1>
<p class="lead worlds">Die besten Momente von TikTok &amp; Co.</p>
</div>
</section>
<section class="section-tight">
<div class="container">
<div class="grid grid-3">
<div class="card">
<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>
</div>
<div class="card">
<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>
</div>
<div class="card">
<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>
</div>
</div>
<!-- TODO: Echte TikTok-Video-Links/Embeds ergänzen, sobald ausgewählt. Struktur ist bereit für TikTok-Embed-Code oder direkte Video-Dateien. -->
</div>
</section>
</main>
<div id="site-footer"></div>
<script src="assets/js/main.js"></script>
</body>
</html>