Skip to content

fix(ui): Stack the home hero when its column is narrow - #904

Merged
mattdjenkinson merged 1 commit into
mainfrom
fix/home-hero-narrow-layout
Nov 11, 2026
Merged

mattdjenkinson merged 1 commit into
mainfrom
fix/home-hero-narrow-layout

Conversation

@mattdjenkinson

Copy link
Copy Markdown
Contributor

Summary

  • The create-network card on the portal's project home page split into two columns by window width. With a dock panel open (Patch, for example) the content column is narrow, so the card stayed side by side and squashed.
  • It now follows the portal's main container instead. Below about 768px of column width, "What attaches to it" drops under the form with its tiles two across.
  • The "Prefer the CLI" note gets a visible background in dark mode, where the muted colour is the same as the card's.

Depends on

The plugin ships no stylesheet, so the container classes come from the portal: datum-cloud/cloud-portal#1799 adds them. This can merge and ship in either order. On a portal that doesn't emit the classes yet, the card stays stacked at every width.

Test plan

  • With the portal branch above, open an empty project's home page: the card is two columns at full width
  • Open the Patch dock: the card stacks, with the attachment tiles two across
  • In dark mode, the "Prefer the CLI" note has a darker background than the card

The create-network card on the project home page split into two columns
by window width, so it stayed side by side and squashed when a dock
panel narrowed the content column. It now follows the portal's main
container instead, and the attachment tiles sit two across while
stacked. On a portal that doesn't emit the container classes yet, the
card stays stacked at every width.

Also give the "Prefer the CLI" note a visible background in dark mode,
where the muted colour is the same as the card's.

@ecv ecv left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Approve.

The hero card now splits on the portal's main container instead of the window, so an open dock panel stacks it instead of squashing it. It also gets a visible note background in dark mode.

  • Every breakpoint moved together (flex-row, the aside's width and border), so there's no half-switched layout.
  • On a portal without the container classes, the @3xl/main: variants never match and the card stays stacked, as the body says. Merging in either order is safe.

@mattdjenkinson
mattdjenkinson merged commit 536260a into main Nov 11, 2026
10 of 11 checks passed
@mattdjenkinson
mattdjenkinson deleted the fix/home-hero-narrow-layout branch November 11, 2026 17:57
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants