Links-Seite (Insta/Snapchat/Discord), Bewerben-Musikbutton, Streamplan-Nav, Personen-Text

- Links: Instagram & Snapchat als Platzhalter ergänzt, Discord auf "Nur auf Anfrage" -> Kontaktseite
- Musik-Button auf allen Bewerben-Seiten bekommt jetzt das gleiche Polarlicht-Design wie der Bewerben-Nav-Button
- Streamplan im Nav-Menu zurück in die HasiDog-Kategorie verschoben
- Neuer Textabschnitt "Der Mensch hinter DogFather" auf dogfather.html und streamer.html ergänzt
This commit is contained in:
2026-08-01 10:44:44 +02:00
parent f51d618d8b
commit 6e05cc74af
10 changed files with 93 additions and 11 deletions
+48
View File
@@ -1284,6 +1284,54 @@ body.seite-laedt main { opacity: .55; transition: opacity .15s ease; }
0 0 34px color-mix(in srgb, var(--accent) 55%, transparent);
}
.music-widget.open .music-toggle { transform: rotate(12deg); }
.music-toggle span { position: relative; z-index: 2; }
/* Auf den Bewerben-Seiten bekommt der Musik-Knopf dieselbe Polarlicht-
Farbe wie der "Bewerben"-Knopf oben in der Leiste — beide markieren
hier bewusst denselben "Treffpunkt beider Welten"-Charakter der Seite. */
body.bewerben-seite .music-toggle {
position: relative;
isolation: isolate;
overflow: hidden;
background: #0b0e14;
border-color: rgba(255, 255, 255, .18);
color: #fff;
}
body.bewerben-seite .music-toggle::before {
content: "";
position: absolute;
inset: -40%;
z-index: 0;
background:
radial-gradient(circle at 20% 25%, rgba(143, 217, 234, .95), transparent 55%),
radial-gradient(circle at 45% 75%, rgba(139, 92, 246, .9), transparent 58%),
radial-gradient(circle at 80% 30%, rgba(217, 74, 92, .95), transparent 55%),
radial-gradient(circle at 60% 85%, rgba(232, 147, 58, .55), transparent 55%);
filter: blur(6px) saturate(1.35);
animation: nav-cta-aurora 9s ease-in-out infinite alternate;
}
body.bewerben-seite .music-toggle::after {
content: "";
position: absolute;
inset: 0;
z-index: 1;
border-radius: 999px;
background: linear-gradient(115deg, transparent 35%, rgba(255, 255, 255, .4) 49%, transparent 63%);
background-size: 240% 100%;
mix-blend-mode: overlay;
animation: nav-cta-shimmer 4.5s linear infinite;
pointer-events: none;
}
body.bewerben-seite .music-toggle:hover,
body.bewerben-seite .music-toggle:focus-visible {
box-shadow: 0 16px 38px rgba(0, 0, 0, .5),
0 0 22px rgba(143, 217, 234, .3),
0 0 22px rgba(217, 74, 92, .28);
}
@media (prefers-reduced-motion: reduce) {
body.bewerben-seite .music-toggle::before,
body.bewerben-seite .music-toggle::after { animation: none; }
}
.music-panel {
width: min(330px, calc(100vw - 44px));
+4 -4
View File
@@ -19,8 +19,6 @@
{ label: "Casper", href: "casper.html" },
{ label: "VanVan", href: "vanvan.html" },
{ label: "Zeitreise", href: "zeitreise.html" },
// Streamplan zurück unter Dogfather — Wunsch Dogi.
{ label: "Streamplan", href: "streamplan.html" },
],
},
{
@@ -30,6 +28,8 @@
{ label: "Modi-Team", href: "team-modis.html" },
{ label: "Community", href: "community.html" },
{ label: "Stimmen", href: "stimmen.html" },
// Streamplan zurück unter HasiDog — Wunsch Dogi.
{ label: "Streamplan", href: "streamplan.html" },
],
},
{
@@ -154,7 +154,6 @@
<li><a href="casper.html">Casper</a></li>
<li><a href="vanvan.html">VanVan</a></li>
<li><a href="zeitreise.html">Zeitreise</a></li>
<li><a href="streamplan.html">Streamplan</a></li>
</ul>
</div>
<div>
@@ -164,6 +163,7 @@
<li><a href="team-modis.html">Modi-Team</a></li>
<li><a href="community.html">Community</a></li>
<li><a href="stimmen.html">Stimmen</a></li>
<li><a href="streamplan.html">Streamplan</a></li>
<li><a href="manager.html">Manager Dogfather</a></li>
<li><a href="team-scouts.html">Scouts</a></li>
</ul>
@@ -249,7 +249,7 @@
</div>
<button class="music-toggle" id="music-toggle" type="button"
aria-expanded="false" aria-controls="music-panel"
title="Musik von Hasidog &amp; Van-Van">🎵</button>`;
title="Musik von Hasidog &amp; Van-Van"><span>🎵</span></button>`;
document.body.appendChild(widget);
const panel = document.getElementById("music-panel");