studio-variable/world-game
4
1
Fork 0
Code Issues 6 Pull requests Projects Releases Packages Wiki Activity Actions

cursor : hide on active game iframe, restore otherwise closes #64
All checks were successful
Deploy / Deploy to Production (push) Successful in 22s
Details

Browse source 
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
isUnknown 2026-04-21 14:40:45 +02:00
parent f9dacf0eb8
commit e73d8de1f3
1 changed files with 8 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

10
src/components/layout/Cursor.svelte
View file

@ -5,6 +5,7 @@
let cursorY = $state(0)
let onTarget = $state(false)
let onClick = $state(false)
let hidden = $state(false)
let rafId
onMount(() => {
@ -14,7 +15,8 @@
}
const handleMouseOver = (e) => {
onTarget = !!e.target.closest('a, button:not([disabled]), [role="button"]:not([disabled]), [tabindex]')
hidden = !!e.target.closest('.iframe-game-container.game-active')
onTarget = !hidden && !!e.target.closest('a, button:not([disabled]), [role="button"]:not([disabled]), [tabindex]')
}
const handleMouseOut = () => {
@ -45,7 +47,7 @@
</script>
<div
class={["cursor-wrapper", onTarget && "upon-target", onClick && "is-clicking"]}
class={["cursor-wrapper", onTarget && "upon-target", onClick && "is-clicking", hidden && "is-hidden"]}
style="transform: translate({cursorX}px, {cursorY}px)"
>
<div class="cursor-dot"></div>
@ -101,6 +103,10 @@
height: 21px;
}
.cursor-wrapper.is-hidden {
opacity: 0;
}
@media (max-width: 768px) {
.cursor-wrapper {
display: none;