Fix click-dead zone on the Assistant launcher tab

The document root kept a forced scrollbar (html { overflow-y: scroll })
from before the app-scroll-shell owned scrolling. The root never
scrolls, so the rule only reserved a dead 11px gutter at the right
viewport edge and pulled every fixed right-anchored element off the
true screen edge - parking the desktop Assistant launcher tab under
the scroll shell's own scrollbar, which hit-tests above descendants.
Net effect: the tab's right quarter plus the whole screen-edge strip
silently swallowed clicks, exactly where an edge-docked control gets
aimed at.

Drop the legacy root-scrollbar rule and portal the launcher out of the
scroll shell so its full face receives clicks, flush to the real edge.

Verified live: elementFromPoint returns the button across its entire
width including the last pixel column, and an extreme-edge click opens
the drawer.
This commit is contained in:
rcourtman
2026-07-11 01:02:01 +01:00
parent 2b028d31bd
commit b57fb95e20
2 changed files with 20 additions and 14 deletions
+15 -9
View File
@@ -1,4 +1,5 @@
import { For, Show, Suspense, createEffect, createMemo, createSignal, onCleanup } from 'solid-js';
import { Portal } from 'solid-js/web';
import type { JSX } from 'solid-js';
import { useLocation, useNavigate } from '@solidjs/router';
import BellIcon from 'lucide-solid/icons/bell';
@@ -976,15 +977,20 @@ export function AppLayout(props: AppLayoutProps) {
!dialogStackHasBlockingDialog()
}
>
<button
type="button"
onClick={() => aiChatStore.open(assistantPageContext().context)}
class={AI_CHAT_LAUNCHER_BUTTON_CLASS}
title={assistantPageContext().title}
aria-label={assistantPageContext().ariaLabel}
>
<SparklesIcon class="h-5 w-5 flex-shrink-0" />
</button>
{/* Portaled out of .app-scroll-shell: as a descendant the scroll
container's own scrollbar hit-tests above the tab's right edge,
leaving the screen-edge click zone dead. */}
<Portal>
<button
type="button"
onClick={() => aiChatStore.open(assistantPageContext().context)}
class={AI_CHAT_LAUNCHER_BUTTON_CLASS}
title={assistantPageContext().title}
aria-label={assistantPageContext().ariaLabel}
>
<SparklesIcon class="h-5 w-5 flex-shrink-0" />
</button>
</Portal>
</Show>
</div>
);
+5 -5
View File
@@ -132,11 +132,11 @@
color: var(--color-text-base);
}
/* Hide scrollbars during transitions to prevent flicker */
html {
overflow-y: scroll;
scroll-behavior: smooth;
}
/* The document root never scrolls: the app shell is h-screen with
overflow hidden and .app-scroll-shell owns vertical scrolling.
Forcing a root scrollbar here would reserve a dead gutter at the
right viewport edge and shift every fixed right-anchored element
(e.g. the Assistant launcher tab) off the true screen edge. */
}
@layer components {