Skip to content

Drop the inner container boundary on listing spec items - #700

Merged
richardhjtan merged 11 commits into
mainfrom
cs-12117-better-ui-treatment-on-spec-item
Aug 12, 2026
Merged

Drop the inner container boundary on listing spec items#700
richardhjtan merged 11 commits into
mainfrom
cs-12117-better-ui-treatment-on-spec-item

Conversation

@richardhjtan

@richardhjtan richardhjtan commented Aug 11, 2026

Copy link
Copy Markdown
Collaborator

What this does

On the listing detail's Includes tab, each spec renders inside a bordered CardContainer, and the spec's fitted field component draws a second boundary ring of its own just inside it, so every spec row shows a double border. This passes @displayContainer={{false}} to the spec component so only the listing's own container draws the boundary, and gives the rows a 3.5rem minimum height so the strips don't sit at the fitted 40px minimum.

The symmetric inline padding visible in the screenshots comes from a companion change to the base Spec card's fitted view in the boxel repo.

Also widens the catalog's BoxelSelect @onChange handlers to accept a nullable selection (T | null) and types the popover playground's option arrays as their literal unions, which is what ember-tsc requires against the select's signature.

Before

before

After

Screenshot 2026-08-13 at 12 55 22 AM

Testing

  • ember-template-lint, Prettier, and ember-tsc --noEmit pass over the catalog contents
  • Verified live against a local realm server: rows render 56px tall with a single boundary, and the data-test-spec-card selector used by the browse tests is unchanged

🤖 Generated with Claude Code

richardhjtan and others added 2 commits August 11, 2026 23:00
The listing detail's Includes tab wraps each spec in its own bordered
CardContainer, and the spec's fitted field component was drawing a second
boundary ring inside it. Pass displayContainer=false so only the outer
container draws the border.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Copilot AI lite review requested due to automatic review settings August 11, 2026 15:06
@github-actions

github-actions Bot commented Aug 11, 2026

Copy link
Copy Markdown

Staging Submissions Preview

This PR's content is pushed to the staging submissions realm: https://realms-staging.stack.cards/submissions/

Changed folders:

  • 19dee3-virtual-try-on-application/
  • 46f065-popover/
  • aef6db-stepper/
  • catalog-app/
  • fields/

Updated at 2026-08-12 07:53:55 UTC for commit f2f1f85. Shared realm: only this PR's changed files are pushed; files touched by multiple PRs reflect whichever pushed last, and deleted files are not removed.

Copilot AI 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.

Pull request overview

This PR removes the “double border” effect in the Listing detail → Includes tab by disabling the inner fitted Spec card’s own container rendering, letting the outer CardContainer be the single visible boundary.

Changes:

  • Passes @displayContainer={{false}} to the dynamically-resolved SpecComponent when rendered in the Includes list.
  • Keeps existing CardContainer wrapper and test selectors (data-test-spec-card) intact while adjusting only presentation.

💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.

richardhjtan and others added 4 commits August 11, 2026 23:17
At the fitted minimum of 40px the spec strips read as cramped; 3.5rem give
the icon, title, and type tag room to breathe.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
BoxelSelect's onChange passes the selection as T | null, so handlers typed
to take a bare T fail ember-tsc. Widen the handlers to accept null and
guard, and type the popover playground's option arrays as their literal
unions so they match the select's inferred item type.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
@richardhjtan
richardhjtan merged commit 6d466e8 into main Aug 12, 2026
3 checks passed
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.

3 participants