File tree Expand file tree Collapse file tree
apps/webapp/app/components/dashboard-agent Expand file tree Collapse file tree Original file line number Diff line number Diff line change @@ -19,9 +19,11 @@ export function DashboardAgentHero({
1919 dismissedIds ?: string [ ] ;
2020 composer ?: React . ReactNode ;
2121} ) {
22+ // Centred by the child's `m-auto`, not by `justify-center`: auto margins give up their space
23+ // once the content outgrows the panel, so the heading stays scrollable to.
2224 return (
23- < div className = "flex min-h-0 flex-1 flex-col items-center justify-center overflow-y-auto px-4 py-6 scrollbar-thin scrollbar-track-transparent scrollbar-thumb-surface-control" >
24- < div className = "flex w-full max-w-2xl flex-col items-center gap-5" >
25+ < div className = "flex min-h-0 flex-1 flex-col overflow-y-auto px-4 py-6 scrollbar-thin scrollbar-track-transparent scrollbar-thumb-surface-control" >
26+ < div className = "m-auto flex w-full max-w-2xl flex-col items-center gap-5" >
2527 < div className = "flex flex-col items-center gap-1.5 text-center" >
2628 < Header1 className = "flex items-center gap-2" >
2729 < AgentMonoLogo size = { 22 } decorative />
Original file line number Diff line number Diff line change @@ -101,4 +101,27 @@ describe("chat-layout enforcement", () => {
101101 expect ( source ) . not . toMatch ( / b g - i n d i g o - \d / ) ;
102102 } ) ;
103103 } ) ;
104+
105+ /**
106+ * Structural guard, not behavioural proof: the webapp has no DOM test environment, so nothing
107+ * here lays the panel out or scrolls it. It asserts the class combination that loses the top
108+ * of an overflowing column is absent — `justify-center` on a scroll container centres by
109+ * distributing free space, and negative free space overflows past the scroll origin, where a
110+ * child's `m-auto` collapses to zero instead.
111+ */
112+ describe ( "scrolling panes" , ( ) => {
113+ const SCROLLERS = [ "DashboardAgentHero.tsx" ] ;
114+
115+ it . each ( SCROLLERS ) ( "%s centres an overflowing column with auto margins" , ( file ) => {
116+ const source = read ( file ) ;
117+ const scrollLines = source
118+ . split ( "\n" )
119+ . filter ( ( line ) => line . includes ( "overflow-y-auto" ) || line . includes ( "overflow-auto" ) ) ;
120+ expect ( scrollLines . length ) . toBeGreaterThan ( 0 ) ;
121+ for ( const line of scrollLines ) {
122+ expect ( line , line . trim ( ) ) . not . toMatch ( / \b j u s t i f y - c e n t e r \b / ) ;
123+ }
124+ expect ( source ) . toMatch ( / \b m - a u t o \b / ) ;
125+ } ) ;
126+ } ) ;
104127} ) ;
You can’t perform that action at this time.
0 commit comments