Files
dogfather-universe/medien-dogfather.html
T
DogFatherGit c940538b1d PWA-Installierbarkeit: Seite kann jetzt als App installiert werden (Desktop-Icon)
Recherche (developer.chrome.com, Lighthouse-Doku, Stand 2026): Chrome/Edge
zeigen "App installieren" bei gültigem Web App Manifest (name, icons inkl.
512x512, start_url, display:standalone) UND einem registrierten Service
Worker mit fetch()-Handler — reines Manifest reicht für den zuverlässigen
Install-Prompt nicht mehr aus.

- Neues manifest.json (Name, Theme-/Hintergrundfarbe passend zum dunklen
  Design, Icons 192x192 + 512x512 aus dem bestehenden Husky-Favicon erzeugt)
- Neuer sw.js: minimaler Service Worker, primär für die Installierbarkeit,
  cached nebenbei die wichtigsten Shell-Dateien (Network-first mit
  Cache-Fallback, kein Offline-Vollausbau)
- main.js: registriert den Service Worker nur bei http(s) (nie bei
  file://, damit die Seite laut Projektregel weiterhin per Doppelklick
  ohne Server funktioniert — stiller Fallback statt Konsolenfehler)
- Alle 28 HTML-Seiten: <link rel="manifest"> + <meta name="theme-color">
  im <head> ergänzt (identischer Ankerpunkt nach dem Favicon-Link geprüft
  und automatisiert eingefügt)

Installation für Dogi: Seite in Chrome/Edge öffnen → Symbol rechts in der
Adressleiste ("App installieren") oder Menü ⋮ → "DogFather Universe
installieren" → landet als eigenes Fenster + Icon auf Desktop/Startmenü.
2026-08-03 01:50:56 +02:00

76 lines
3.3 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!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" />
<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="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" data-i18n="md_eyebrow">Welt 1 — DogFather</span>
<h1 data-i18n="md_h1">Medien — DogFather</h1>
<p class="lead worlds" data-i18n="md_lead">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" data-i18n="md_fotos_h2">📸 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" data-i18n="md_videos_h2">🎥 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" data-i18n="md_events_h2">🎉 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/i18n-medien-dogfather.js"></script>
<script src="assets/js/main.js"></script>
</body>
</html>