DogFatherGit/dogfather-universe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
Files
a43bc565ec2ef4c3d37b21a165fc391c6b110fe7
dogfather-universe/stimmen.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

117 lines
6.7 KiB
HTML
Raw Blame History

<!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>Stimmen über DogFather — DOGFATHER UNIVERSE</title>
<meta name="description" content="Was die Community und das Team über DogFather sagen." />
<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="Stimmen über DogFather — DOGFATHER UNIVERSE" />
<meta property="og:description" content="Was die Community und das Team über DogFather sagen." />
<meta property="og:image" content="https://dogfather-universe.com/assets/img/og-cover.jpg" />
<meta property="og:url" content="https://dogfather-universe.com/stimmen.html" />
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="Stimmen über DogFather — DOGFATHER UNIVERSE" />
<meta name="twitter:description" content="Was die Community und das Team über DogFather sagen." />
<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-stimmen.jpg');--page-bg-mobile:url('/assets/img/bg-stimmen-mobile.jpg');">
<div id="site-header"></div>
<main>
<section class="hero page-bg">
<div class="hero-banner"><img src="/assets/img/bg-stimmen.jpg" alt="" loading="eager" /></div>
<div class="container">
<span class="eyebrow" data-i18n="st_eyebrow">Welt 2 — HasiDog</span>
<h1 data-i18n="st_h1">Stimmen über DogFather</h1>
<p class="lead worlds" data-i18n="st_lead">Was Community und Team sagen.</p>
</div>
</section>
<!-- ===== Eigene Stimme einreichen (20.08.2026, Nutzer-Wunsch: "eine
richtig geile kachel ... wo die leute mit namen und tiktok namen
mir eine nachricht schreiben können", "das wird mega persoenlich
zu den fans"). Landet in der Verwaltung, wird NIE automatisch
veroeffentlicht -- siehe server-internal/routes/testimonials.js. -->
<section class="section-tight">
<div class="container">
<div class="stimmen-einreichen-kachel" id="stimmen-formular-box">
<span class="stimmen-einreichen-glanz" aria-hidden="true"></span>
<div class="stimmen-einreichen-kopf">
<span class="stimmen-einreichen-herz" aria-hidden="true">💌</span>
<h2 data-i18n="st_form_titel">Deine Stimme zählt</h2>
<p class="small" data-i18n="st_form_text">
Was bedeutet dir Team Dogi? Schreib uns deine Geschichte — mit etwas Glück liest DogFather sie
persönlich und stellt sie hier auf die Seite.
</p>
</div>
<form id="stimmen-formular">
<div class="field">
<label for="st-name" data-i18n="st_form_name_label">Dein Name</label>
<input type="text" id="st-name" maxlength="60" required />
</div>
<div class="field">
<label for="st-tiktok" data-i18n="st_form_tiktok_label">TikTok-Name (optional)</label>
<input type="text" id="st-tiktok" maxlength="40" placeholder="@dein-name" />
</div>
<div class="field">
<label for="st-nachricht" data-i18n="st_form_nachricht_label">Deine Nachricht</label>
<textarea id="st-nachricht" maxlength="500" rows="4" required data-i18n-attr="placeholder:st_form_nachricht_placeholder" placeholder="Erzähl uns, was dir Team Dogi bedeutet …"></textarea>
</div>
<!-- Profilbild-Auswahl (21.08.2026, Nutzer-Wunsch: "ich soll auch
paar geile bilder zum aussuchen haben als profilbild falls die
leute kein bild mit schicken, das soll denen auch als
möglichkeit gegeben sein"). Die festen Kacheln kommen aus
data-stimmen-avatare.js, damit Seite und Verwaltung dieselbe
Auswahl zeigen.
Dazu eine "eigenes Bild"-Kachel mit echtem Datei-Upload (auch
21.08.2026 ergänzt; ein früherer Kommentar hier behauptete noch
"kein Upload" -- das stimmte nicht mehr und ist am 28.08.2026
richtiggestellt). Der Upload ist mehrfach abgesichert: nur
Bildtypen, max. 5 MB, Bremse pro IP gegen Massen-Uploads, vor
dem Absenden im Browser auf 512px verkleinert (bild-vorbereiten.js),
und NICHTS wird veröffentlicht, bevor Dogi die Stimme freigibt --
jede Einreichung landet zuerst in der Warteschlange. -->
<div class="field">
<span class="stimmen-avatar-titel" data-i18n="st_form_avatar_label">Dein Profilbild (optional)</span>
<p class="small muted stimmen-avatar-hinweis" data-i18n="st_form_avatar_hinweis">Ohne Auswahl erscheint einfach der erste Buchstabe deines Namens.</p>
<div class="stimmen-avatar-wahl" id="stimmen-avatar-wahl" role="radiogroup" aria-labelledby="stimmen-avatar-titel"></div>
</div>
<button type="submit" class="btn btn-primary" style="width:100%;" data-i18n="st_form_absenden">💙 Nachricht einreichen</button>
</form>
<p class="stimmen-erfolg" id="stimmen-erfolg" data-i18n="st_form_erfolg">Danke dir! Deine Nachricht wurde eingereicht und wird von Dogi persönlich geprüft. 🩵</p>
<p class="stimmen-fehler" id="stimmen-fehler"></p>
</div>
</div>
</section>
<!-- ===== Echte, freigegebene Stimmen -- bleibt komplett unsichtbar, bis
mindestens eine Nachricht in der Verwaltung freigegeben wurde (kein
Platzhaltertext mehr). ===== -->
<section class="section-tight" id="stimmen-echte-root" hidden>
<div class="container">
<h2 class="text-center" data-i18n="st_echte_titel">Das sagt die Community</h2>
<div class="grid grid-3" id="stimmen-echte-grid" style="margin-top:1.6rem;"></div>
</div>
</section>
</main>
<div id="site-footer"></div>
<script src="assets/js/data-stimmen-avatare.js?v=20260828e"></script>
<script src="assets/js/i18n-stimmen.js?v=20260828e"></script>
<script src="assets/js/main.js?v=20260828e"></script>
<script src="assets/js/bild-vorbereiten.js?v=20260828e"></script>
<script src="assets/js/stimmen.js?v=20260828e"></script>
</body>
</html>
Reference in New Issue View Git Blame Copy Permalink