diff --git a/src/app/coach/page.tsx b/src/app/coach/page.tsx index d8c0d5402..9ffb5a694 100644 --- a/src/app/coach/page.tsx +++ b/src/app/coach/page.tsx @@ -63,15 +63,35 @@ export default function CoachPage() {
`'s shared `mx-auto max-w-screen-xl px-4 + // pt-6 pb-20 md:px-6` content frame, which boxed the chat into the + // same narrow column every dashboard card uses and left a tall dead + // band below the card (the `pb-20` FAB gutter, pointless here since + // the FAB hides on `/coach`). Break out of that frame: negative + // margins cancel the container's horizontal + top/bottom padding so + // the chat claims the full content width and the viewport height, + // then a light inner padding keeps it off the window edge. The card + // itself drops its rounded border on small screens (edge-to-edge, + // app-like) and keeps the contained card look from `sm+`. + // + // v1.18.1 (W-COACH-UI C1/C3) — the card formerly capped at + // `100dvh-13rem`, leaving wasted space below it; we now fill the + // reclaimed height. + className={ + // Cancel the AuthShell container's padding (`-mt-6` top, + // `-mb-20` bottom, `-mx-4 md:-mx-6` sides) so the surface is + // full-bleed, then re-pad lightly. The height is the full + // viewport minus the top bar (`4rem`) and the small gutters. + "-mx-4 -mt-6 -mb-20 flex h-[calc(100dvh-4rem)] min-h-[32rem] flex-col md:-mx-6 " + + "px-2 pt-2 pb-3 sm:px-4 sm:pt-4 sm:pb-4" + } > +
} - /> + /> +
); } diff --git a/src/components/insights/coach-panel/coach-drawer-body.tsx b/src/components/insights/coach-panel/coach-drawer-body.tsx index f59461b02..1c677b86f 100644 --- a/src/components/insights/coach-panel/coach-drawer-body.tsx +++ b/src/components/insights/coach-panel/coach-drawer-body.tsx @@ -78,7 +78,18 @@ export function CoachDrawerBody({

{t("insights.coach.historyTitle")}

-
{historyRail}
+ {/* v1.18.6 (CCH-01) — the wrapping `overflow-y-auto` div here + was the broken left scrollbar: `` is itself a + `flex h-full flex-col` with its OWN `overflow-y-auto` list, + so this nested it inside a second scroll container. The + outer container scrolled the whole rail (search field + included) against an `h-full` child whose height resolved to + its content, leaving the inner list's `flex-1 min-h-0` + without a bounded track — the scrollbar rendered against an + indeterminate height and read as half-broken. Drop the outer + scroll: the rail keeps a fixed search header and its single + internal list-scroll is the only scroll region. */} +
{historyRail}
)} diff --git a/src/components/insights/coach-panel/message-thread.tsx b/src/components/insights/coach-panel/message-thread.tsx index 75a632f59..6dae240d0 100644 --- a/src/components/insights/coach-panel/message-thread.tsx +++ b/src/components/insights/coach-panel/message-thread.tsx @@ -363,6 +363,13 @@ export function MessageThread({ data-slot="coach-message-thread" className={cn( "flex h-full flex-col gap-4 overflow-y-auto px-4 py-4 sm:px-6", + // v1.18.6 (CCH-01) — on the now full-width page surface a thread + // stretched edge-to-edge sprawled the prose to an unreadable + // measure. Centre the content on a comfortable max width (Claude- + // like) via an `mx-auto` inner gutter; the scrollbar still rides + // the surface edge. The drawer surface is already narrow, so the + // cap only bites on the wide page surface. + "[&>*]:mx-auto [&>*]:w-full [&>*]:max-w-3xl", "scroll-smooth", )} >