Neuer Hintergrund für "Die Person", Creator-Satz korrigiert, Pyramiden-Karten gleich hoch

- dogfather.html: neues, extra dafür erstelltes Hero-Bild als eigene Datei
  (bg-dogfather-person.jpg) - bewusst NICHT die geteilte bg-dogfather.jpg
  überschrieben, die noch auf 3 weiteren Seiten (bewerben-modi, profil,
  team-modis) mitverwendet wird
- creator.html: "Content Creator, die bei Spicy Media / Team Dogi
  mitmachen" -> "...die bei Dogfather / Spicy Media mitmachen" (Meta-Tags
  entsprechend mitkorrigiert)
- Pyramiden-Karten (team-modis.html) sind jetzt pro Ebene gleich hoch,
  unabhängig von Textlänge (z.B. Diene/Funny): .pyramid-tier auf
  align-items:stretch, .profile-card darin als Flex-Spalte mit dem
  "Profil ansehen"-Button per margin-top:auto immer ganz unten
This commit is contained in:
2026-08-01 14:32:00 +02:00
parent 0d31fb8bb0
commit 58d1e6fa52
6 changed files with 18 additions and 8 deletions
+11 -1
View File
@@ -1102,7 +1102,10 @@ body.mit-hintergrund::after {
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: flex-start;
/* stretch statt flex-start: alle Karten einer Ebene werden gleich hoch,
egal ob der Name/die Rolle bei der einen Person länger ist als bei
der anderen (z.B. Diene/Funny) — Wunsch von Dogi. */
align-items: stretch;
gap: clamp(1rem, 3vw, 2rem);
}
/* Leuchtender Knoten pro Ebene, sitzt genau auf der Linie */
@@ -1122,8 +1125,15 @@ body.mit-hintergrund::after {
}
.pyramid-tier .profile-card {
width: 100%;
/* Flex-Spalte, damit der "Profil ansehen"-Button per margin-top:auto immer
ganz unten sitzt — dadurch wirken alle Karten einer Ebene gleich hoch
und gleich aufgebaut, auch wenn Name/Rolle unterschiedlich lang sind. */
display: flex;
flex-direction: column;
align-items: center;
transition: transform .3s cubic-bezier(.2,.7,.3,1), box-shadow .3s ease, border-color .3s ease;
}
.pyramid-tier .profile-card .btn { margin-top: auto; }
.pyramid-tier .profile-card:hover { transform: translateY(-6px) scale(1.02); }
/* Fünf Größenstufen — je tiefer, desto kompakter */
Binary file not shown.

After

Width:  |  Height:  |  Size: 104 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 306 KiB

+4 -4
View File
@@ -4,17 +4,17 @@
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Creator im Team — DOGFATHER UNIVERSE</title>
<meta name="description" content="Content Creator, die Teil von Spicy Media / Team Dogi sind." />
<meta name="description" content="Content Creator, die Teil von Dogfather / Spicy Media sind." />
<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="Creator im Team — DOGFATHER UNIVERSE" />
<meta property="og:description" content="Content Creator, die Teil von Spicy Media / Team Dogi sind." />
<meta property="og:description" content="Content Creator, die Teil von Dogfather / Spicy Media sind." />
<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/creator.html" />
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="Creator im Team — DOGFATHER UNIVERSE" />
<meta name="twitter:description" content="Content Creator, die Teil von Spicy Media / Team Dogi sind." />
<meta name="twitter:description" content="Content Creator, die Teil von Dogfather / Spicy Media sind." />
<meta name="twitter:image" content="https://REPLACE-WITH-YOUR-DOMAIN.tld/assets/img/og-cover.jpg" />
<link rel="stylesheet" href="assets/css/main.css" />
@@ -31,7 +31,7 @@
<div class="container">
<span class="eyebrow">Manager Dogfather — Team</span>
<h1>Creator im Team</h1>
<p class="lead worlds">Content Creator, die bei Spicy Media / Team Dogi mitmachen.</p>
<p class="lead worlds">Content Creator, die bei Dogfather / Spicy Media mitmachen.</p>
</div>
</section>
+2 -2
View File
@@ -22,12 +22,12 @@
<link rel="stylesheet" href="assets/css/theme-hasidog.css" />
<link rel="stylesheet" href="assets/css/theme-spicymedia.css" />
</head>
<body class="mit-hintergrund" style="--page-bg:url('/assets/img/bg-dogfather.jpg');--page-bg-mobile:url('/assets/img/bg-dogfather-mobile.jpg');">
<body class="mit-hintergrund" style="--page-bg:url('/assets/img/bg-dogfather-person.jpg');--page-bg-mobile:url('/assets/img/bg-dogfather-person-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="hero-banner"><img src="/assets/img/bg-dogfather-person.jpg" alt="" loading="eager" /></div>
<div class="container">
<span class="eyebrow">Welt 1 — Dogfather</span>
<h1>Die Person hinter Dogfather</h1>
+1 -1
View File
@@ -89,7 +89,7 @@ document.addEventListener("DOMContentLoaded", () => {
<span class="badge" style="margin-bottom:.5rem;">Stufe ${m.rankLabel || m.rank}</span>
<h3>${m.name}</h3>
<div class="role">${m.role}</div>
<span class="btn btn-outline" style="margin-top:.7rem;pointer-events:none;">Profil ansehen</span>
<span class="btn btn-outline" style="pointer-events:none;">Profil ansehen</span>
</a>`
)
.join("");