Skip to content

feat(home): alternative layout for the "what you can do" sections - #730

Closed
jbouder wants to merge 4 commits into
mainfrom
feat/homepage-what-you-can-do-alt
Closed

jbouder wants to merge 4 commits into
mainfrom
feat/homepage-what-you-can-do-alt

Conversation

@jbouder

@jbouder jbouder commented Sep 23, 2026

Copy link
Copy Markdown
Contributor

Why

An alternative presentation of the two sections added in #729. The copy and links are identical; only the layout differs. Branched from #729, so this PR contains its commits too. Merge one or the other, not both.

Reference Issues or PRs

Part of #724. Alternative to #729.

What does this implement/fix?

  • "What can you do with Nebari?" is a three-column bento grid. The lead claim spans two columns with larger type and a faint wash of the brand color; the other four fill the remaining slots.
  • "What you don't have to do" is the same grid mirrored: three cards on top and the wide card closing the section. Each icon tile carries a diagonal strike so the list reads as chores the platform removes.
  • Icon tiles sit on the title line and follow Starlight's own <Card> recipe: a 1.333em square with a low-tint fill and border that cycles orange, purple, green, red, blue by position. This matches the ecosystem grid below.
  • FeatureRow.astro becomes Feature.astro. The heading is a title prop, the body slot holds the sentence and link, and wide spans two columns. The parent container (.nebari-bento, with the --skip modifier) decides the layout.

Testing

  • Did you test the pull request locally?
  • Did you add new tests?

Checked on a local dev server at desktop width in light and dark themes. Both grids collapse to one column below 50rem via the same media query; the narrow layout was not re-checked after the final tile change.

🤖 Generated with Claude Code

khuyentran1401 and others added 4 commits September 23, 2026 16:15
…tions

The hero is followed straight by the ecosystem grid, which lists components
before a first-time visitor knows what the platform does for them. Add two
benefit sections between the two, so the page answers "why should I care?"
before "what is available?".

Both sections are hairline row lists rather than card grids: the ecosystem
grid is a catalog of products, while these are claims about the platform, and
each claim links to the page that backs it.

Part of #724.
…h panel

Alternative presentation of the "what you can do" and "what you don't
have to do" sections. The first is now a three-column bento grid with
the lead claim spanning two columns; the second is a single tinted panel
holding a two-column list whose icon tiles carry a diagonal strike.

FeatureRow.astro becomes Feature.astro: the same icon set, but the
parent container (.nebari-bento or .nebari-skip) decides the layout.

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
…he cards below

Both benefit sections are now bento grids; the second is mirrored so its
wide card closes the section, with a diagonal strike through each icon
tile. The tile sits on the heading line and cycles through the same
low-tint colors as Starlight's own Card, so the two sections match the
ecosystem grid below them. The heading moves from the slot to a `title`
prop so the component can lay the tile and text out together.

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
@github-actions

Copy link
Copy Markdown

Docs preview for feat/homepage-what-you-can-do-alt (via the nebari-docs Worker):
https://feat-homepage-what-you-can-do-alt-nebari-docs.openteams-account.workers.dev

@jbouder jbouder closed this Sep 23, 2026
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