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:
@@ -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));
|
||||
|
||||
Reference in New Issue
Block a user