fix(kiosk): flatten the onboarding/login background too + roomier renderer heap

The 454c4bb2 kiosk flattening only covered the Dashboard's background
stack, but the kiosk boots into the login/onboarding screen —
OnboardingWrapper.vue — whose scoped 3D stack (perspective +
preserve-3d bg layers + mix-blend-mode glitch overlays) has the exact
compositing pattern that fails to repaint under the kiosk's software
compositor, leaving the black body fill visible. Extend the same
html.kiosk-mode flattening to this screen via :global() rules: 2D
opacity crossfades stay, 3D transforms / blur filters / blend-mode
glitch layers go.

Also raise the kiosk chromium JS heap cap 128→256MB: the intro
cinematic (video + audio + app) inside a 128MB V8 old-space risks
renderer OOM, and a crashed kiosk tab auto-reloads — indistinguishable
from the reported "flickers and refreshes".

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
archipelago 2026-07-16 15:38:22 -04:00
parent 06186ab30c
commit e9cfc234cd
2 changed files with 26 additions and 1 deletions

View File

@ -135,7 +135,7 @@ while true; do
--disable-metrics \
--disable-metrics-reporting \
--disable-domain-reliability \
--js-flags="--max-old-space-size=128" \
--js-flags="--max-old-space-size=256" \
--user-data-dir=/var/lib/archipelago/chromium-kiosk
sleep 3
done

View File

@ -682,5 +682,30 @@ video.bg-layer {
transform: translateX(1px);
}
}
/* Kiosk (software compositor): flatten THIS screen's background stack.
Same failure mode the dashboard kiosk fix addressed perspective +
preserve-3d layers and mix-blend-mode overlays fail to repaint under
Chromium software compositing, so the black body fill shows through.
The dashboard-only overrides never reached this scoped stack, which is
why the kiosk login/onboarding background still went black. Keep 2D
opacity crossfades; drop 3D transforms, blur filters, and blend-mode
glitch overlays. */
:global(html.kiosk-mode) .bg-perspective-container,
:global(html.kiosk-mode) .perspective-container {
perspective: none !important;
}
:global(html.kiosk-mode) .bg-layer,
:global(html.kiosk-mode) .view-wrapper {
transform: none !important;
transform-style: flat !important;
backface-visibility: visible !important;
will-change: auto !important;
filter: none !important;
}
:global(html.kiosk-mode) .login-glitch-layer,
:global(html.kiosk-mode) .login-glitch-scan {
display: none !important;
}
</style>