engineering/make_post_sell
1
0
Fork 0
Code Issues 2 Pull requests Projects Releases 2 Packages Wiki Activity Actions

docs: MPS-24 Phase 2.6 — facet sidebar + 6-sentence excerpt entries

Browse source 
Surface the new tag-detail facet nav (sort + price + categories) and
6-sentence SERP excerpt in two places future readers will look:
- docs/architecture.md feature toggle matrix gets two rows
- styleguide.j2 gets a live demo of the facet sidebar so the pattern
  is documented in the single source of truth for components
This commit is contained in:
russell@unturf.com 2026-05-15 15:54:50 -04:00
parent 41d525aa1d
commit 91c0854a1f
No known key found for this signature in database
2 changed files with 59 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

2
docs/architecture.md
View file

@ -217,6 +217,8 @@ mps_page_session (raw rows)
| Featured products strip (MPS-24) | `shop.featured_product_ids_json` | `home-layout-settings` | empty |
| Product tags (MPS-24) | `Tag` + `ProductTag` association | product edit + `/s/{id}/tags` bulk editor | — |
| Tag auto-suggest (MPS-24 Phase 2) | `lib/tag_suggest.py` over `Product.title` + `Product.description` | `?show_suggestions=1` on `/s/{id}/tags` + `scripts/backfill_tags.py` | Never auto-applies |
| Tag-detail facet sidebar (MPS-24 Phase 2.6) | `shop_tag.j2` + `views/shop.py` `_price_range_from_request` / `_filter_by_price_range` | Sort + price range + categories list, GET form, sidebar ≥800px, top chip strip <800px | Always on for tag detail pages |
| 6-sentence SERP excerpt (MPS-24 Phase 2.6) | `Product.excerpt_sentences(n=6, max_chars=1500)` via shared `_strip_markdown()` helper | `shop_tag.j2` row description | Always on |
## Ticket Index

57
make_post_sell/templates/styleguide.j2
View file

@ -930,6 +930,63 @@ Cap products per lane via shop.home_layout_per_lane_limit.
Mobile: tiles narrow to 140-160px, swipe-friendly.</div>
</div>
<div class="sg-subsection" id="tag-facet-nav">
<div class="sg-label">Facet nav sidebar (MPS-24 — tag detail page)</div>
<div class="sg-demo">
<aside class="facet-nav" style="max-width: 240px;">
<form method="get" action="#" class="facet-form" onsubmit="return false;">
<section class="facet-section">
<h2 class="facet-title">Sort by</h2>
<select class="facet-select">
<option>Newest first</option>
<option>Oldest first</option>
<option>Price: low to high</option>
<option>Price: high to low</option>
<option>Alphabetical (A→Z)</option>
<option>Most popular (28d)</option>
</select>
</section>
<section class="facet-section">
<h2 class="facet-title">Price ($)</h2>
<div class="facet-price-range">
<label class="facet-price-label">
<span class="facet-price-cap">Min</span>
<input type="number" class="facet-price-input" />
</label>
<label class="facet-price-label">
<span class="facet-price-cap">Max</span>
<input type="number" class="facet-price-input" />
</label>
</div>
<button type="submit" class="mps-button mps-button-small">Apply</button>
</section>
<section class="facet-section">
<h2 class="facet-title">Categories</h2>
<ul class="facet-tag-list">
<li><a href="#" class="facet-tag">All</a></li>
<li><a href="#" class="facet-tag facet-tag-active">Math</a></li>
<li><a href="#" class="facet-tag">Seasonal</a></li>
<li><a href="#" class="facet-tag">Literacy</a></li>
<li><a href="#" class="facet-tag">Science</a></li>
</ul>
</section>
</form>
</aside>
</div>
<div class="sg-code">.tag-detail-layout — 1fr mobile, 220px + 1fr at ≥800px
.facet-nav — left column on tag detail, hidden &lt;800px
.facet-form — single GET form wrapping sort + price + tags
.facet-section — title + control group, vertical gap
.facet-tag-list — vertical list, max-height 60vh, scroll if long
.facet-tag-active — accent fill (shop theme color)
Capability-driven: works without JS — submit posts a normal GET.
On wide viewports the sidebar replaces the top .tag-chip-strip-mobile.</div>
</div>
<div class="sg-subsection">
<div class="sg-label">Profile card (profile.j2)</div>
<section class="profile-page" style="max-width: 480px;">