fix(machine): keep the mouse pointer visible on the web demo #96
Loading…
Add table
Add a link
Reference in a new issue
No description provided.
Delete branch "fix/demo-cursor-visible"
Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?
On atm.demo.aiolabs.dev the pointer disappeared unless it was over a button.
index.html has its own inline
index.html's inline <style> hid the cursor on any viewport >= 1024px: @media (min-width: 1024px) { html, body { overflow: hidden; cursor: none; } } which is every desktop browser opening the public demo. Descendants inherit it, so the pointer vanished everywhere except over buttons — those carry Tailwind's .cursor-pointer, which overrode the inherited value and made the bug look stranger than it was. This is the rule the earlier .kiosk scoping missed: src/style.css got gated, this one did not, so the two disagreed. Delete it rather than gate it. src/style.css's `.kiosk, .kiosk *` rule already covers <html> and every descendant with !important, and main.ts applies that class unless VITE_DEMO_TAG is set — so real machines are unaffected and cursor hiding now has exactly one owner, the one that knows whether this is a kiosk. The block here cannot make that call: it is static HTML, and the page CSP (script-src 'self') forbids an inline script that could read the env. overflow: hidden stays as it was — untouched on both. Verified by building both ways: without the tag the built HTML has no cursor rule, the JS still adds .kiosk and the CSS still carries the !important hide; with the tag the .kiosk branch is dead-code-eliminated and no cursor: none survives anywhere. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_013A6683cCHnQxFUosx1krY4