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]>
151 lines
7.1 KiB
HTML
151 lines
7.1 KiB
HTML
<!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>Rabattcodes — DOGFATHER UNIVERSE</title>
|
||
<meta name="description" content="Rabattcodes von Dogis Partnern für Team Dogi — spar bares Geld bei ausgewählten Marken." />
|
||
<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="Rabattcodes — DOGFATHER UNIVERSE" />
|
||
<meta property="og:description" content="Rabattcodes von Dogis Partnern für Team Dogi — spar bares Geld bei ausgewählten Marken." />
|
||
<meta property="og:image" content="https://dogfather-universe.com/assets/img/og-cover.jpg" />
|
||
<meta property="og:url" content="https://dogfather-universe.com/rabattcodes.html" />
|
||
<meta name="twitter:card" content="summary_large_image" />
|
||
<meta name="twitter:title" content="Rabattcodes — DOGFATHER UNIVERSE" />
|
||
<meta name="twitter:description" content="Rabattcodes von Dogis Partnern für Team Dogi — spar bares Geld bei ausgewählten Marken." />
|
||
<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" />
|
||
<style>
|
||
/* Leere-Zustand-Kachel im "Gutschein"-Look: gestrichelter Rand wie ein
|
||
ausgeschnittener Coupon, damit auch OHNE echte Codes schon klar ist,
|
||
wie hier später einzelne Rabattcode-Karten reinkommen. */
|
||
.code-platzhalter {
|
||
max-width: 620px;
|
||
margin: 0 auto;
|
||
text-align: center;
|
||
}
|
||
.code-siegel {
|
||
width: 96px; height: 96px;
|
||
display: flex; align-items: center; justify-content: center;
|
||
margin: 0 auto 1.4rem;
|
||
font-size: 2.6rem;
|
||
border-radius: 50%;
|
||
background: radial-gradient(circle at 32% 28%, rgba(52,211,153,.35), rgba(11,13,16,.9) 70%);
|
||
border: 1.5px solid rgba(52,211,153,.45);
|
||
box-shadow: 0 0 0 6px rgba(52,211,153,.06), 0 10px 30px rgba(0,0,0,.5);
|
||
animation: code-pulse 3s ease-in-out infinite;
|
||
}
|
||
@keyframes code-pulse {
|
||
0%, 100% { box-shadow: 0 0 0 6px rgba(52,211,153,.06), 0 10px 30px rgba(0,0,0,.5); }
|
||
50% { box-shadow: 0 0 0 10px rgba(52,211,153,.12), 0 10px 34px rgba(0,0,0,.55); }
|
||
}
|
||
@media (prefers-reduced-motion: reduce) { .code-siegel { animation: none; } }
|
||
.code-karte-vorschau {
|
||
position: relative;
|
||
max-width: 420px;
|
||
margin: 1.8rem auto 0;
|
||
padding: 1.2rem 1.4rem;
|
||
border: 1.5px dashed rgba(52,211,153,.4);
|
||
border-radius: 14px;
|
||
background: rgba(52,211,153,.05);
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
gap: 1rem;
|
||
}
|
||
.code-karte-vorschau .marke { font-weight: 700; }
|
||
.code-karte-vorschau .prozent {
|
||
font-weight: 800;
|
||
color: #5eeaa7;
|
||
font-size: 1.1rem;
|
||
white-space: nowrap;
|
||
}
|
||
|
||
/* Gesperrt-Zustand: an das Supporter-Abo gekoppelt (Nutzer-Feedback
|
||
03.08.2026), gleiche Prüfung wie die Karte auf links.html. Direkter
|
||
Aufruf dieser Seite (Lesezeichen, geteilter Link) soll die Sperre
|
||
genauso zeigen wie der Knopf dort — nicht nur auf links.html blockiert
|
||
sein. */
|
||
.code-gesperrt-siegel {
|
||
width: 96px; height: 96px;
|
||
display: flex; align-items: center; justify-content: center;
|
||
margin: 0 auto 1.4rem;
|
||
font-size: 2.6rem;
|
||
border-radius: 50%;
|
||
background: radial-gradient(circle at 32% 28%, rgba(212,175,55,.35), rgba(11,13,16,.9) 70%);
|
||
border: 1.5px solid rgba(212,175,55,.45);
|
||
box-shadow: 0 0 0 6px rgba(212,175,55,.06), 0 10px 30px rgba(0,0,0,.5);
|
||
}
|
||
</style>
|
||
</head>
|
||
<body class="mit-hintergrund" style="--page-bg:url('/assets/img/bg-links.jpg');--page-bg-mobile:url('/assets/img/bg-links-mobile.jpg');">
|
||
<div id="site-header"></div>
|
||
|
||
<main>
|
||
<section class="hero page-bg">
|
||
<div class="hero-banner"><img src="/assets/img/bg-links.jpg" alt="" loading="eager" /></div>
|
||
<div class="container">
|
||
<span class="eyebrow" data-i18n="rc_eyebrow">🏷️ Für Team Dogi</span>
|
||
<h1 data-i18n="rc_h1">Rabattcodes</h1>
|
||
<p class="lead worlds" data-i18n="rc_lead">Codes von Dogis Partnern — damit deine Community bares Geld spart.</p>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="section-tight">
|
||
<div class="container">
|
||
<!-- Nur für Supporter sichtbar (siehe Skript unten) -->
|
||
<div class="card code-platzhalter" id="rc-inhalt" hidden>
|
||
<div class="code-siegel" aria-hidden="true">🏷️</div>
|
||
<h2 data-i18n="rc_titel">Codes folgen in Kürze</h2>
|
||
<p data-i18n="rc_text">Als Creator bekommt DogFather eigene Rabattcodes bei ausgewählten Partnern — die gibt er direkt an Team Dogi weiter. Sobald die ersten Kooperationen live sind, stehen die Codes genau hier.</p>
|
||
<div class="code-karte-vorschau" aria-hidden="true">
|
||
<span class="marke" data-i18n="rc_beispiel_marke">Partner-Marke</span>
|
||
<span class="prozent" data-i18n="rc_beispiel_code">CODE „DOGFATHER" · –10 %</span>
|
||
</div>
|
||
<div class="btn-row" style="justify-content:center;margin-top:1.8rem;">
|
||
<a class="btn btn-primary" href="kontakt.html" data-i18n="rc_btn_kontakt">Auf dem Laufenden bleiben</a>
|
||
<a class="btn btn-outline" href="links.html" data-i18n="rc_btn_zurueck">← Zurück zu allen Links</a>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Nur für Nicht-Supporter sichtbar (siehe Skript unten) -->
|
||
<div class="card code-platzhalter" id="rc-gesperrt" hidden>
|
||
<div class="code-gesperrt-siegel" aria-hidden="true">🔒</div>
|
||
<h2 data-i18n="rc_gesperrt_titel">Nur für Dogfather-Supporter</h2>
|
||
<p data-i18n="rc_gesperrt_text">Rabattcodes sind ein exklusiver Vorteil der DogiCrew 🩵. Werde jetzt Teil davon, um sie freizuschalten, sobald die ersten Kooperationen live sind.</p>
|
||
<div class="btn-row" style="justify-content:center;margin-top:1.8rem;">
|
||
<a class="btn btn-primary" href="abonnieren.html" data-i18n="rc_btn_abo">Jetzt Supporter werden 👑</a>
|
||
<a class="btn btn-outline" href="links.html" data-i18n="rc_btn_zurueck">← Zurück zu allen Links</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
</main>
|
||
|
||
<div id="site-footer"></div>
|
||
<script src="assets/js/i18n-rabattcodes.js?v=20260828e"></script>
|
||
<script src="assets/js/main.js?v=20260828e"></script>
|
||
<script>
|
||
(function () {
|
||
document.addEventListener("DOMContentLoaded", function () {
|
||
var status = localStorage.getItem("supporterSubStatus");
|
||
var hatAbo = ["active", "pending", "suspended", "cancelled"].indexOf(status) !== -1;
|
||
var inhalt = document.getElementById("rc-inhalt");
|
||
var gesperrt = document.getElementById("rc-gesperrt");
|
||
if (inhalt) inhalt.hidden = !hatAbo;
|
||
if (gesperrt) gesperrt.hidden = hatAbo;
|
||
});
|
||
})();
|
||
</script>
|
||
</body>
|
||
</html>
|