itlxrd/Psychotoxical-psysonic
1
0
Fork 0
mirror of https://github.com/Psychotoxical/psysonic.git synced 2026-07-21 23:05:46 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(css): scope data-app-blurred animation pause away from * (#434)

Browse Source 
* fix(css): scope data-app-blurred animation pause away from `*`

The `data-app-blurred="true"` rule used a `*` selector to pause every
animation while the window was unfocused. On WebKitGTK + no-compositing
(Linux dev mode) this triggered a stale rendering bug after Vite HMR
reloads — the sidebar and main content stayed invisible until any user
interaction nudged a re-render.

Splitting the rule:

* `data-app-hidden` and `data-psy-native-hidden` keep `*` because the
  window is fully invisible to the user in those states.
* `data-app-blurred` now lists only the concrete heaviest infinite
  animations (eq bars, marquees, np dot pulse, fullscreen mesh blob /
  portrait, generic spin). The other small animations keep running
  while blurred — minor GPU cost compared to the broken HMR experience.

The JS-side `__psyBlurred` flag in WaveformSeek is unchanged.

* docs(changelog): add #434 entry to [1.45.0] / Fixed
This commit is contained in:
Frank Stellmacher
2026-05-02 23:20:01 +02:00
committed by GitHub
parent e6a20f03cd
commit 402e288a24
2 changed files with 20 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/styles/components.css
+18 -4
View File
@@ -11097,15 +11097,29 @@ html.no-compositing .fs-seekbar-played {
background: var(--accent);
}
/* Window completely invisible (tab hidden via Visibility API, or Tauri
`win.hide()`): pausing every animation is safe because the user is not
looking. */
html[data-app-hidden="true"] *,
html[data-app-hidden="true"] *::before,
html[data-app-hidden="true"] *::after,
html[data-psy-native-hidden="true"] *,
html[data-psy-native-hidden="true"] *::before,
html[data-psy-native-hidden="true"] *::after,
html[data-app-blurred="true"] *,
html[data-app-blurred="true"] *::before,
html[data-app-blurred="true"] *::after {
html[data-psy-native-hidden="true"] *::after {
animation-play-state: paused !important;
}
/* Window visible but unfocused (alt-tab, click into another app): only
pause the heaviest known infinite animations to save GPU. The previous
`*`-selector variant fired a repaint over every node and triggered a
stale-blur HMR rendering bug on WebKitGTK + no-compositing. */
html[data-app-blurred="true"] .eq-bars .eq-bar,
html[data-app-blurred="true"] .player-marquee,
html[data-app-blurred="true"] .marquee-text,
html[data-app-blurred="true"] .np-dot-pulse,
html[data-app-blurred="true"] .fs-mesh-blob,
html[data-app-blurred="true"] .fs-portrait-wrap,
html[data-app-blurred="true"] .spin {
animation-play-state: paused !important;
}