diff options
| author | dax <me@dax.ist> | 2026-08-04 10:16:37 +0000 |
|---|---|---|
| committer | dax <me@dax.ist> | 2026-08-04 10:16:37 +0000 |
| commit | 8f9b940b875ee854a293c862405dc38ea8b643ff (patch) | |
| tree | 67c5b8f98eb1223728c652284ce735be3d490fe2 /public | |
| parent | 6261bf6fcd96a9c4380f2361a79afdae840d0aaa (diff) | |
pathways: glowing edge segments only appear on hover; drop the preview fade
the edge marker is drawn on the tile and the ghost renders in the gap, so
they never overlap - there is no reason to fade the edge while previewing,
and the .preview class was making the edge vanish exactly when hovered. edges
are now invisible at rest and glow at full strength on hover.
Diffstat (limited to 'public')
| -rw-r--r-- | public/app.css | 9 | ||||
| -rw-r--r-- | public/app.js | 2 | ||||
| -rw-r--r-- | public/index.html | 4 |
3 files changed, 5 insertions, 10 deletions
diff --git a/public/app.css b/public/app.css index d5f12dc..a2df38d 100644 --- a/public/app.css +++ b/public/app.css @@ -78,7 +78,7 @@ html, body { .nav-edge { position: absolute; background: linear-gradient(rgba(255, 255, 255, .9), rgba(125, 211, 252, .55)); - opacity: .35; + opacity: 0; pointer-events: none; transition: opacity .15s, filter .15s; } @@ -87,11 +87,8 @@ html, body { .nav-zone-E .nav-edge { right: 4px; top: 6px; bottom: 6px; width: 3px; border-radius: 2px; } .nav-zone-W .nav-edge { left: 4px; top: 6px; bottom: 6px; width: 3px; border-radius: 2px; } .nav-zone:hover .nav-edge { - opacity: .95; - filter: drop-shadow(0 0 7px rgba(125, 211, 252, .8)); -} -.nav-zone.preview .nav-edge { - opacity: 0; + opacity: 1; + filter: drop-shadow(0 0 8px rgba(125, 211, 252, .9)); } #splash { diff --git a/public/app.js b/public/app.js index 5034348..800a822 100644 --- a/public/app.js +++ b/public/app.js @@ -205,12 +205,10 @@ function renderNav(id) { zone.className = `nav-zone nav-zone-${ex.dir}` zone.addEventListener("pointermove", () => { if (adjacentTile(id, ex.dir)) return - zone.classList.add("preview") cancelHideGhost() showGhost(choosePlacement(id, ex.dir)) }) zone.addEventListener("pointerleave", () => { - zone.classList.remove("preview") scheduleHideGhost() }) zone.addEventListener("pointerdown", (e) => e.stopPropagation()) diff --git a/public/index.html b/public/index.html index fb9bbb6..ee844d7 100644 --- a/public/index.html +++ b/public/index.html @@ -5,7 +5,7 @@ <meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="color-scheme" content="dark"> <title>pathways</title> - <link rel="stylesheet" href="/app.css?v=18"> + <link rel="stylesheet" href="/app.css?v=19"> </head> <body> <main id="stage"> @@ -16,6 +16,6 @@ <p>four paths, one per direction. walk them.</p> <button id="start">start</button> </div> - <script src="/app.js?v=18"></script> + <script src="/app.js?v=19"></script> </body> </html> |