Skip to content

Add selected-card indicator to SortableGrid styles - #526

Merged
ddon merged 1 commit into
BeamLabEU:devfrom
mdon:feat/sortable-grid-handle-flash-selection
May 9, 2026
Merged

Add selected-card indicator to SortableGrid styles#526
ddon merged 1 commit into
BeamLabEU:devfrom
mdon:feat/sortable-grid-handle-flash-selection

Conversation

@mdon

@mdonmdon commented May 9, 2026

Copy link
Copy Markdown
Contributor

Summary

  • Sortable cards (<.table_default> mobile card view, currently the catalogue items list) now paint a 15% primary tint + 4px primary left-edge accent when the card's internal checkbox is checked.
  • Implemented via a CSS :has() rule injected by the SortableGrid hook because the card view is opaque to consumers (no per-item selected attr).
  • Mirrors the table-row treatment in the catalogue's item_table (consumer-side companion change in phoenix_kit_catalogue).

Test plan

  • Open a list with bulk-selectable cards on mobile (e.g. catalogue detail items in card view).
  • Tick a card's checkbox → card gains the primary tint + left accent.
  • Untick → tint goes away cleanly.
  • Tick multiple → all selected cards highlight independently.

Sortable cards (`<.table_default>` mobile card view, currently the
catalogue items list) now paint a 15% primary tint + 4px primary
left-edge accent when the card's internal checkbox is checked.
Implemented via a CSS `:has()` rule because the card view is opaque
to consumers (no per-item selected attr). Mirrors the table-row
treatment in the catalogue's `item_table`.
@ddon
ddon merged commit 8d52c38 into BeamLabEU:devMay 9, 2026
ddon pushed a commit that referenced this pull request May 9, 2026
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
ddon pushed a commit that referenced this pull request May 9, 2026
The runtime-injected SortableGrid stylesheet lands after Tailwind
in source order and the rule's specificity (0,3,0) already beats
.bg-base-200 (0,1,0), so !important was defensive, not load-bearing.
Dropping it also makes the rule consistent with the un-!important
box-shadow on the same line. Comment now spells out why specificity
+ injection order is sufficient.
Follow-up to PR #526 review.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
@mdon
mdon deleted the feat/sortable-grid-handle-flash-selection branch May 9, 2026 17:41
mdon added a commit to mdon/phoenix_kit that referenced this pull request May 12, 2026
… review
`CLAUDE_REVIEW.md` for PR BeamLabEU#526 (add selected-card indicator to
SortableGrid styles) opens with `APPROVE`. Two NITPICKs and one
IMPROVEMENT-LOW, no BUG findings. Documenting their status:
* **NITPICK** — redundant `!important` on `background-color` —
already fixed post-merge in commit `3521fa2f` ("Remove redundant
!important from selected-card indicator"). Current rule at
`priv/static/assets/phoenix_kit.js:170` doesn't carry it.
* **NITPICK** — `:has()` selector matches any descendant checkbox,
not specifically the bulk-select one. Benign for every current
consumer (only `phoenix_kit_catalogue` uses sortable card view,
and its cards have exactly one checkbox). The review explicitly
calls it "ergonomic, not correctness" — skipped, with the
forward-looking guidance preserved for whenever a second
consumer trips it.
* **IMPROVEMENT-LOW** — no automated coverage. Already a tracked
TODO in `phoenix_kit/AGENTS.md` ("Component test coverage for
`phoenix_kit_web/components/core/`"). Defer to that future
sweep per the reviewer's own suggestion.
No code changes — just folding the existing fix-commit and the two
forward-looking notes into the canonical FOLLOW_UP.md format. Phase
1 triage discovered no actionable items beyond what was already
addressed.
Sign up for freeto 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

@mdon@ddon