Files
dogfather-universe/team-scouts.html
T
DogFatherGitandClaude Opus 5 5ef3a13615 Jede App der Domain bekommt eine eigene Fensterfarbe
Beim Installieren als App sahen alle Dienste gleich aus. Nicht wegen der
Symbole - die sind seit heute Mittag gut unterscheidbar - sondern wegen
der Farbe: zwoelf von vierzehn trugen dasselbe Fast-Schwarz (#05070b,
#05070d, #0a0910, #0b0d10, #0d0817, #0e0a16). Das ist die theme_color,
also am PC die Titelleiste des App-Fensters und am Handy die Statusleiste.

Neu, je App eine Farbe, abgeleitet vom eigenen Symbol:

  Hauptseite            #065f76  Petrol      (Symbol stahlblau)
  DogiCrew-Verwaltung   #8d4125  Kupfer      (Symbol orange)
  Webdesign             #564e95  Violett     (Symbol lila)
  Kundenportal          #924985  Magenta     (Symbol pink)
  WD-Verwaltung         #b44f5e  Rose        (Symbol rot)
  Creator Workspace     #0674b9  Blau        (Symbol nachtblau)

Nextcloud (#17a5a6) bleibt unveraendert - als einzige hob sie sich schon ab.

WICHTIG war, beide Stellen zu aendern: Die meta-Angabe im HTML
ueberschreibt die theme_color aus dem Manifest. Nur das Manifest zu
aendern haette gar nichts bewirkt.

Der background_color (Startbildschirm beim Oeffnen) bleibt bewusst sehr
dunkel, nur leicht in Richtung der App-Farbe getoent - kraeftig ist nur
die schmale Leiste, damit nichts grossflaechig aufblitzt (Vorgabe
augenschonend).

Wie die Farben entstanden sind: Zwei Entwuerfe fielen bei der eigenen
Pruefung durch. In HSL gerechnet lagen Workspace und Webdesign bei einem
Farbabstand von 12.6 statt der noetigen 25 - auf dem Papier 30 Grad
auseinander, fuers Auge dasselbe Blauviolett. Auch der zweite Versuch
scheiterte (Hauptseite zu nah an Nextclouds Tuerkis, 19.1). Neun Farben
bei gleicher Helligkeit passen schlicht nicht mit genug Abstand auf den
Farbkreis. Erst mit der Helligkeit als dritter Dimension und einem
Optimierer, der den KLEINSTEN Abstand im Satz maximiert, kam ein Satz
heraus, der haelt: kleinster Abstand 25.5.

Geprueft: 68 Farbpruefungen (weisse Schrift ueberall lesbar 5.0-7.2:1,
keine blendet, jede hebt sich vom bisherigen Schwarz ab, alle Paare
>= 25 Delta E) und 101 Browserpruefungen ueber 16 Seiten (Manifest und
meta stimmen ueberein, genau eine theme-color je Seite, Symbole
vorhanden) - alle gruen, Gegenprobe schlaegt an.

Co-Authored-By: Claude Opus 5 <[email protected]>
2026-09-05 23:35:25 +02:00

98 lines
4.8 KiB
HTML

<!DOCTYPE html>
<html lang="de" data-theme="spicymedia">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Scout-Team — DOGFATHER UNIVERSE</title>
<meta name="description" content="Die Scouts von Team Dogi bei Spicy Media." />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/universe-32.png" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/universe-180.png" />
<link rel="manifest" href="/manifest.json" />
<meta name="theme-color" content="#065f76" />
<meta property="og:type" content="website" />
<meta property="og:site_name" content="DOGFATHER UNIVERSE" />
<meta property="og:title" content="Scout-Team — DOGFATHER UNIVERSE" />
<meta property="og:description" content="Die Scouts von Team Dogi bei Spicy Media." />
<meta property="og:image" content="https://dogfather-universe.com/assets/img/og-cover.jpg" />
<meta property="og:url" content="https://dogfather-universe.com/team-scouts.html" />
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="Scout-Team — DOGFATHER UNIVERSE" />
<meta name="twitter:description" content="Die Scouts von Team Dogi bei Spicy Media." />
<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-scouts.jpg');--page-bg-mobile:url('/assets/img/bg-scouts-mobile.jpg');">
<div id="site-header"></div>
<main>
<section class="hero page-bg">
<div class="hero-banner"><img src="/assets/img/bg-scouts.jpg" alt="" loading="eager" /></div>
<div class="container">
<span class="eyebrow" data-i18n="ts_eyebrow">Manager DogFather — Spicy Media</span>
<h1 data-i18n="ts_h1" data-site-text-key="seitentitel_scout">Mein Scout-Team</h1>
<p class="lead worlds" data-i18n="ts_lead">Sie finden und begleiten neue Talente für Dogi.</p>
</div>
</section>
<section class="section-tight">
<div class="container">
<div id="scouts-grid" class="grid grid-4"></div>
<!-- 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. -->
<div class="btn-row" style="justify-content:center;">
<a class="btn btn-primary" href="bewerben-scout.html" data-i18n="ts_bewerben_btn">Als Scout bewerben</a>
</div>
</div>
</section>
</main>
<div id="site-footer"></div>
<script src="assets/js/data-scouts.js?v=20260828e"></script>
<script src="assets/js/i18n-team-scouts.js?v=20260828e"></script>
<script src="assets/js/main.js?v=20260828e"></script>
<script>
document.addEventListener("DOMContentLoaded", () => {
const grid = document.getElementById("scouts-grid");
if (!grid || !window.SCOUTS) return;
const t = (schluessel) => (window.dogiUebersetzen ? window.dogiUebersetzen(schluessel) : schluessel);
const feld = (x) => (window.dogiFeld ? window.dogiFeld(x) : x || "");
const renderScouts = () => {
grid.innerHTML = window.SCOUTS.map((s) => {
const quoteText = feld(s.quote);
return `
<a class="profile-card" href="profil.html?p=${s.slug}">
<div class="avatar">${(s.avatar || s.photo) ? `<img src="${s.avatar || s.photo}" alt="${s.name}" loading="lazy">` : `<span class="avatar-initial">${s.name.charAt(0).toUpperCase()}</span>`}</div>
<h3>${s.name}</h3>
<div class="role">${feld(s.role)}</div>
${quoteText ? `<p class="quote">„${quoteText}"</p>` : `<p class="small muted">${t("ts_zitat_folgt")}</p>`}
<span class="btn btn-outline" style="margin-top:.7rem;pointer-events:none;">${t("ts_profil_ansehen")}</span>
</a>`;
}).join("");
};
renderScouts();
document.addEventListener("dogi-sprache-geaendert", renderScouts);
// 21.08.2026: über die Verwaltung angelegte/importierte Scouts einmischen
// (Nutzer-Wunsch "überall wo ... Scouts ... sind, will ich dass ich die
// easy über meine Verwaltungsseite hinzufüge" + Runde 2: "wenn ich eine
// änderung mache ist es auch für jeden"). dogiTeamZusammenfuehren()
// überschreibt dabei bereits importierte Scouts (gleicher slug) mit ihrem
// aktuellen DB-Stand statt sie zu duplizieren.
if (window.dogiTeamLaden) {
window.dogiTeamLaden("scout").then((neue) => {
if (!neue.length) return;
window.SCOUTS = window.dogiTeamZusammenfuehren(window.SCOUTS, neue);
renderScouts();
});
}
});
</script>
</body>
</html>