Archived mockup — Mobile drawer variants. Produced while designing issue #23. The option marked as chosen is recorded in the design spec.

Option C on a phone — and one sub-choice

The closed state is the same either way. What differs is how the filter panel arrives: a full-height side drawer or a bottom sheet. Both are one antd Drawer with a different placement, so this is purely a feel decision. Click the drawer style you prefer.

Closed — browsing
Full-width button, applied filters as removable chips, two cards per row.
⚙ Filters 3
Coffee Tables × vintage × $120–$800 × Clear all
Oak coffee table$340
vintageoak
Elm slab$520
vintage
Walnut low$690
vintagerare
Teak round$275
vintage
C1 — Side drawer
Slides in from the right, near full-screen. Reads as "a page of filters".
Oak coffee table$340
Elm slab$520
Filters
Category
All items
▾ Furniture
  ▾ Tables
    Coffee Tables
    Side Tables
▸ Decor
Tags — must have all
vintage ✓ handmade oak restored
Price
$120$800
Clear all
Show 12 items
C2 — Bottom sheet
Rises from the bottom, ~78% height. Controls sit within thumb reach; grid stays partly visible.
⚙ Filters 3
Oak coffee table$340
Elm slab$520
Filters
Category
All items
▾ Furniture  ▸ Tables
  Coffee Tables
▸ Decor
Tags — must have all
vintage ✓ handmade oak
Price
$120$800
Clear all
Show 12 items

What carries over from desktop

Identical component tree at both sizes — the drawer just changes placement and width/height at the antd md breakpoint, so there is no second implementation to keep in sync. The chip row is the only piece that behaves differently: on desktop it sits inline next to the Filters button, on mobile it wraps onto its own line beneath it.

Tags now confirmed as AND — an item must carry every selected tag to show up. The panel labels this explicitly ("must have all") so a user who selects two tags and sees the grid shrink to nothing understands why.