dvorakmortonxd/freezmo
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Touch devices blur the live backdrop instead of the baked layer

Browse source 
Mobile engines repaint background-attachment: fixed late (iOS treats it
as scroll), so the baked glass showed a stale crop of the wallpaper
until a tap forced a repaint - "some of the UI looks bugged until I
click it". On touch devices (max-width 639px or pointer: coarse) the
bake is dropped for a real backdrop-filter over the live scene, so the
bubbles blur through the glass as they pass and the position is correct
by construction. Hand-rolled frost fills keep their own tints there;
desktop keeps the baked layer (measured cheaper and verified correct).

Pinned with a touch-context check in the mobile suite (124 checks).
Contrast 0 findings, axe clean, chat 101/101, regression 44/44, i18n
13/13, native 33/33. Version 0.3.8, SW -> freezmo-v67.
This commit is contained in:
Martin Dvořák 2026-10-13 14:07:24 +00:00
commit b315e2a1aa
6 changed files with 84 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

4
tests/lib.mjs
View file

@ -121,8 +121,8 @@ export async function seed(
);
}
export async function makePage(browser, { width = 390, height = 844, deviceScaleFactor = 2, reducedMotion, colorScheme } = {}) {
const context = await browser.newContext({ viewport: { width, height }, deviceScaleFactor, reducedMotion, colorScheme });
export async function makePage(browser, { width = 390, height = 844, deviceScaleFactor = 2, reducedMotion, colorScheme, isMobile, hasTouch } = {}) {
const context = await browser.newContext({ viewport: { width, height }, deviceScaleFactor, reducedMotion, colorScheme, isMobile, hasTouch });
const page = await context.newPage();
return { context, page };
}