ltadeu6/skeledance
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix: smooth balada nebula color transition via ::after opacity

Browse source
This commit is contained in:
vini 2026-06-14 13:27:27 -03:00
parent d422cea905
commit 36220dc34f
1 changed files with 12 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

16
plugin/contents/ui/dancer.html
View file

@ -31,8 +31,16 @@ html, body {
filter: blur(80px); filter: blur(80px);
pointer-events: none; pointer-events: none;
animation: nebulaFloat ease-in-out infinite; animation: nebulaFloat ease-in-out infinite;
transition: background 3.5s ease;
} }
.nebula::after {
content: '';
position: absolute;
inset: 0;
border-radius: 50%;
opacity: 0;
transition: opacity 9s ease;
}
body.balada .nebula::after { opacity: 1; }
.nebula-a { .nebula-a {
width: 500px; height: 350px; width: 500px; height: 350px;
background: radial-gradient(ellipse, rgba(120,0,220,0.18), transparent 70%); background: radial-gradient(ellipse, rgba(120,0,220,0.18), transparent 70%);
@ -991,9 +999,9 @@ body.balada .spotlight-wrap { opacity: 1; }
/* ============================================================ /* ============================================================
BALADA — SOBRESCRITAS DO AMBIENTE BALADA — SOBRESCRITAS DO AMBIENTE
============================================================ */ ============================================================ */
body.balada .nebula-a { background: radial-gradient(ellipse, rgba(255,0,100,0.22), transparent 70%); } .nebula-a::after { background: radial-gradient(ellipse, rgba(255,0,100,0.22), transparent 70%); }
body.balada .nebula-b { background: radial-gradient(ellipse, rgba(180,0,255,0.18), transparent 70%); } .nebula-b::after { background: radial-gradient(ellipse, rgba(180,0,255,0.18), transparent 70%); }
body.balada .nebula-c { background: radial-gradient(ellipse, rgba(255,140,0,0.14), transparent 70%); } .nebula-c::after { background: radial-gradient(ellipse, rgba(255,140,0,0.14), transparent 70%); }
</style> </style>
</head> </head>