doxa-life/doxa-maps
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Pin hint: a drag that starts on the pill no longer scrolls the page

Browse source 
The pill takes touch-action:none. With the legend open it sits just above
the sheet's top edge, so a drag meant to resize the sheet often began on the
pill's lower edge and scrolled the pane instead. Taps still fire, so its
dismiss button keeps working.
This commit is contained in:
Doxa Maps 2026-09-30 12:03:20 +00:00
parent d45b765bd6
commit 1ec43f2ece
1 changed files with 4 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
library/components/hints/PinHint.vue
View file

@ -486,8 +486,10 @@ useShadowStyles(`
z-index: 12; pointer-events: none; box-sizing: border-box;
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
animation: pinhint-in .5s ease both; }
/* 40px, the corner ☰'s size, with its two lines one above the other. */
.pin-hint-pill { pointer-events: auto; display: inline-flex; align-items: center; gap: 8px; text-align: center;
/* 40px, the corner ☰'s size, with its two lines one above the other. touch-action:none: a drag that starts on
the pill does nothing. With the legend open the pill sits just above the sheet's top edge, and a drag meant
to resize the sheet that began on it scrolled the pane instead. Taps still fire, so the × still works. */
.pin-hint-pill { pointer-events: auto; touch-action: none; display: inline-flex; align-items: center; gap: 8px; text-align: center;
min-height: 40px; max-width: 100%; box-sizing: border-box; padding: 3px 12px 3px 10px; border-radius: 20px;
background: rgba(23, 29, 38, .92); color: #fff; font-size: 12px; line-height: 1.25; font-weight: 600;
letter-spacing: .01em; box-shadow: 0 4px 18px rgba(0,0,0,.30);