Skip to content

Add tab and tag-chip filters to the gallery - #35

Merged
Kyome22 merged 1 commit into
mainfrom
add-gallery-filter-ui
Jul 19, 2026
Merged

Kyome22 merged 1 commit into
mainfrom
add-gallery-filter-ui

Conversation

@Kyome22

@Kyome22 Kyome22 commented Jul 19, 2026 •

Copy link
Copy Markdown
Contributor

Summary

  • Add a Monochrome/Color tab (mutually exclusive) and a tag-chip row (multi-select, OR semantics) to the gallery. Tags come from the closed enum introduced in Add type and tags fields to runner metadata #34.
  • Mirror filter state to the URL hash (e.g. #tab=color&tags=animal,fitness) so filtered views are shareable and survive reload.
  • Hide tag chips whose current-tab match count is zero, unless the tag is already selected. Show No runners match the current filters. when the grid is empty.
  • Rewrite script.js to a single-state render loop and reuse existing palette colors (#606060, cadetblue) for the tab and chip styles.

Test plan

  • Open https://runcat-dev.github.io/RunnerGallery/. Monochrome tab is active by default and shows 29 runners.
  • Switch to Color: 4 runners (uhooi, spinning-bonfire, dojo-panda, wall-breaker).
  • On Monochrome, click dog: 9 dog runners.
  • On Color, click animal: 2 runners (uhooi, dojo-panda). wall-breaker (no tags) disappears.
  • Load .../#tab=color&tags=animal,fitness directly: filters are restored.
  • Clear button removes tag selection; tab stays.
  • Reload: last URL state is preserved.

🤖 Generated with Claude Code

Replaces the flat runner grid with a Monochrome/Color tab plus a
multi-select tag chip row that filters by OR. Filter state is mirrored
to the URL hash (e.g. `#tab=color&tags=animal,fitness`) so a filtered
view is shareable and survives reload. The chip row hides tags that
have zero matches in the current tab, unless already selected. Uses
the same palette as the rest of the site.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
@Kyome22
Kyome22 merged commit 03ad63f into main Jul 19, 2026
1 check passed
@Kyome22
Kyome22 deleted the add-gallery-filter-ui branch July 19, 2026 17:47
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.

1 participant