spo/music-jeopardy
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Better handling of color
All checks were successful
On Push Deploy / deploy (push) Successful in 20s
Details

Browse Source
This commit is contained in:
Johnny322
2026-02-10 16:44:01 +01:00
parent 2f44cfe430
commit f05066a5a7
1 changed files with 14 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
src/styles.css
View File

@@ -396,8 +396,9 @@ audio.hidden-audio {
} }
.pulse-orb.playing { .pulse-orb.playing {
background: #7df9ff; color: #7df9ff;
animation: hueShift 10s linear infinite; background: radial-gradient(circle at 30% 30%, rgba(255, 255, 255, 0.35), currentColor 65%);
animation: planetShift 4s linear infinite;
} }
.pulse-orb.answer { .pulse-orb.answer {
@@ -445,11 +446,7 @@ audio.hidden-audio {
transition: height 0.08s ease-out, opacity 0.08s ease-out, transform 0.08s ease-out, filter 0.08s ease-out; transition: height 0.08s ease-out, opacity 0.08s ease-out, transform 0.08s ease-out, filter 0.08s ease-out;
mix-blend-mode: screen; mix-blend-mode: screen;
color: #7df9ff; color: #7df9ff;
} animation: planetShift 4s linear infinite;
.pulse-orb.playing,
.pulse-tentacles .tentacle {
animation: hueShift 10s linear infinite;
} }
@@ -463,18 +460,21 @@ audio.hidden-audio {
} }
} }
@keyframes hueShift { @keyframes planetShift {
0% { 0% {
filter: hue-rotate(0deg); color: #2ea8ff;
} }
33% { 25% {
filter: hue-rotate(120deg); color: #fbd72b;
} }
66% { 50% {
filter: hue-rotate(240deg); color: #ff4b4b;
}
75% {
color: #8a5bff;
} }
100% { 100% {
filter: hue-rotate(360deg); color: #2ea8ff;
} }
} }