itlxrd/psysonic
1
0
Fork 0
mirror of https://github.com/kilyabin/psysonic.git synced 2026-07-22 14:35:41 +00:00
Code Issues Packages Projects Releases Wiki Activity

edit(FullScreenPlayer): Possible halos in the background have been removed (#239)

Browse Source 
Co-authored-by: kilyabin <65072190+kilyabin@users.noreply.github.com>
This commit is contained in:
Frank Stellmacher
2026-04-21 12:09:38 +02:00
committed by GitHub
parent a1427202a9
commit f73cca669b
1 changed files with 9 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/styles/components.css
+9 -6
View File
@@ -3190,13 +3190,16 @@
height: 130%; height: 130%;
left: -35%; left: -35%;
bottom: -35%; bottom: -35%;
/* opacity on the element avoids color-mix(…, transparent) WebKit artifacts —
interpolating to the CSS keyword 'transparent' (rgba(0,0,0,0)) produces a
visible halo ring at the gradient boundary on WebKitGTK. */
background: radial-gradient(ellipse, background: radial-gradient(ellipse,
color-mix(in srgb, var(--dynamic-fs-accent, var(--accent)), transparent 86%) 0%, var(--dynamic-fs-accent, var(--accent)) 0%,
color-mix(in srgb, var(--dynamic-fs-accent, var(--accent)), transparent 96%) 45%,
transparent 70%); transparent 70%);
opacity: 0.14;
animation: mesh-aura-a 26s ease-in-out infinite; animation: mesh-aura-a 26s ease-in-out infinite;
animation-delay: 350ms; animation-delay: 350ms;
transition: background 400ms ease-in-out; transition: opacity 400ms ease-in-out;
} }
.fs-mesh-blob-b { .fs-mesh-blob-b {
@@ -3205,12 +3208,12 @@
right: -25%; right: -25%;
top: -25%; top: -25%;
background: radial-gradient(ellipse, background: radial-gradient(ellipse,
color-mix(in srgb, var(--dynamic-fs-accent, var(--accent)), transparent 92%) 0%, var(--dynamic-fs-accent, var(--accent)) 0%,
color-mix(in srgb, var(--dynamic-fs-accent, var(--accent)), transparent 98%) 45%,
transparent 70%); transparent 70%);
opacity: 0.08;
animation: mesh-aura-b 20s ease-in-out infinite; animation: mesh-aura-b 20s ease-in-out infinite;
animation-delay: 350ms; animation-delay: 350ms;
transition: background 400ms ease-in-out; transition: opacity 400ms ease-in-out;
} }
/* ── Artist portrait — right half, object-fit: contain ── */ /* ── Artist portrait — right half, object-fit: contain ── */