impress/app/views/wardrobe/items/_item_card_content.html.haml

.item-thumbnail
  = image_tag item.thumbnail_url, alt: "", loading: "lazy"
.item-info
  .item-name
    = item.name
    = link_to item_path(item), class: "item-info-link", target: "_blank", rel: "noopener" do
      %span{aria: {label: "Item info"}} ℹ️
  .item-badges
    = render "items/badges/kind", item: item
    - if local_assigns[:appearance]
      = render "wardrobe/items/badges/zones", appearance: appearance
    = render "wardrobe/items/badges/closet", item: item
    = render "items/badges/first_seen", item: item
-												[WV2] Add progressive enhancement for outfit item list toggles

Rather than just buttons, upgrade to radio buttons when we have JS.

											
										
										
											2026-02-06 16:42:42 -08:00
+								.item-thumbnail
 								  = image_tag item.thumbnail_url, alt: "", loading: "lazy"
 								.item-info
-												[WV2] Add item info links

Add an info link (ℹ️) to each item card that opens the item's detail
page in a new tab. The link is:
- Subtle and hidden by default (opacity: 0)
- Visible on hover or focus-within for mouse/keyboard users
- Always visible (60% opacity) on touch devices
- Accessible with proper aria-label
- Opens in new tab with target="_blank" and rel="noopener"

This is the first commit of Phase 2 (Detail-Oriented Experience),
adding contextual navigation to item details.

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

											
										
										
											2026-02-15 20:32:11 -08:00
+								  .item-name
 								    = item.name
 								    = link_to item_path(item), class: "item-info-link", target: "_blank", rel: "noopener" do
 								      %span{aria: {label: "Item info"}} ℹ️
-												[WV2] Add progressive enhancement for outfit item list toggles

Rather than just buttons, upgrade to radio buttons when we have JS.

											
										
										
											2026-02-06 16:42:42 -08:00
+								  .item-badges
 								    = render "items/badges/kind", item: item
-												[WV2] Add zone badges to search results

Show which zones each item occupies in search result cards. Zone badges appear as small, muted labels (e.g., "Background", "Hat", "Static") after the NC/NP and date badges. Items that occupy multiple zones show multiple badges.

Zone badges only appear in search results, not in outfit items, since outfit items are already grouped by zone which provides sufficient context.

Implementation:
- Created zones badge partial to render zone labels from item appearances
- Updated controller to load item appearances with zone data for search results
- Pass appearance data through the rendering chain (search_results → item_card → item_card_content)
- Added subtle CSS styling for zone badges (light gray background, gray text)

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

											
										
										
											2026-02-15 20:49:42 -08:00
+								    - if local_assigns[:appearance]
 								      = render "wardrobe/items/badges/zones", appearance: appearance
-												[WV2] Add ownership and wishlist badges

Show "Own" (green) and "Want" (blue) badges on item cards when a logged-in user has items in their closet lists. Badges appear on both search results and outfit items.

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

											
										
										
											2026-02-15 20:56:05 -08:00
+								    = render "wardrobe/items/badges/closet", item: item
-												[WV2] Add progressive enhancement for outfit item list toggles

Rather than just buttons, upgrade to radio buttons when we have JS.

											
										
										
											2026-02-06 16:42:42 -08:00
+								    = render "items/badges/first_seen", item: item