enh

.commandcode/taste/taste/taste.md

@@ -74,6 +74,15 @@ er-ui/app/(drawer)/(tabs)/home/index.tsx, I want similar here") and expects the
 - When adopting the tabs model to replace a store filter, the tabs must be driven by the same dimension as the replaced filter — one tab per store, labeled by the store name, with each tab showing only that store's items (per-tab scoped content), not category/product tags. Explicitly corrected after a misinterpretation ("the tab labels should be store names. In every tab we need to show the items of that store"). Confidence: 0.8
 - When replicating a horizontal scrollable tab strip (store/category tabs) from user-ui to web-ui, expects identical interactive behavior, not just styling — the active tab must auto-scroll into view on selection so clicking a right-most tab brings it fully into view (matching user-ui's scroll-to-tab-position behavior, e.g., scroll to `offsetLeft - 16`), and the same auto-scroll must be applied consistently to every page using that tab strip pattern ("the tabs aren't behaving same as user-ui. They aren't auto scrolling when I try to click a right most tab"). Confidence: 0.8
 - For compact product cards (price, strike-through market price, quantity), dictates a specific vertical stacking layout rather than a side-by-side row: show the price first, then the struck market price on the same line, and the quantity on a new line below ("first show the price, then the striked price, in new line show the quantity") — this supersedes earlier attempts to pin the quantity to the right of the same row. Confidence: 0.7
+- For text that wraps next to a leading icon in a chip/label (e.g., the delivery-date chip with a truck icon), constrains multiline text to a maximum of 2 lines (`line-clamp-2`) and pins the icon to the top of the first line (`items-start` + `shrink-0` + top margin on the icon) so it never drops to a second line when the text wraps ("which takes at most 2 lines, with the truck on the first line"). Confidence: 0.6
+- When a fixed N-line block (e.g., the delivery-date chip capped at 2 lines) must carry an icon on line 1 only, he rejects relying on natural text wrapping: if the text naturally fits on one line, the second line renders empty ("still the same. I see truck and space below it in next line empty"). Prefers a DETERMINISTIC structure that explicitly fills every line — split the content into two deliberate lines (e.g., date on line 1 next to the icon, time on its own line 2) so line 2 always has content, rather than wrap/clamp heuristics that can leave a gap. Confidence: 0.75
+- Prefers minimal, chrome-free presentation for informational text like the delivery-date line: drop the background, border, and padding entirely and show just the text (and any leading icon) in the brand color at 70% opacity (`text-brand-700/70`), rather than a colored/bordered chip, after the layout was finalized ("remove the blue background and the padding. Just show the text in brand color but 70% opacity"). Confidence: 0.7
+- When a pinned leading icon reserves its own column in a chip, a subsequent wrapped text line must NOT carry over that reserved gap — the second line should span the full inner width with proper spacing, not leave an "open gap" where the icon column sits on the first line ("in the second line I don't see truck but the gap is open. It should have space"). Confidence: 0.45
+- When he wants a UI element/feature hidden for now (e.g., a delivery-date block), prefers the agent to comment the code out (wrapping in `{/* ... */}`) rather than delete it, so it can be easily restored later ("just hide the delivery date. just comment it out"). Confidence: 0.6
+- Prefers the product-card quantity line to carry an explicit "Qty:" label prefix before the formatted value — e.g., "Qty: 12Kg" — rather than showing the bare formatted quantity (e.g., just `12Kg`). Confidence: 0.7
+- Prefers a lighter, more compact look for product-card text: the product name rendered at `font-medium` (not `font-bold`) and the card's content padding tightened (e.g., `px-3 pt-2.5 pb-2.5` instead of `px-4 pt-3 pb-3`) — explicit instruction: "for the text of product name, reduce the weight and it's padding." He then continued tightening the horizontal padding by directly dictating the value ("make the padding px-1.5"), so expects the agent to apply exact spacing values he specifies. Confidence: 0.7
+- Prefers secondary/informational product-card text (e.g., the quantity line) in the brand color at 70% opacity (`text-brand-700/70`) rather than muted gray — "show the quantity in the branch [brand] color 70% opacity" — the same `text-brand-700/70` treatment he chose for the delivery-date line, suggesting a recurring card-text color treatment for secondary info. When the line carries a label prefix (e.g., "Qty:"), only the VALUE part gets the brand color; the label stays muted gray and the value gets a touch more weight (`font-semibold`) to stand out — "only the value part. not the 'Qty'". Confidence: 0.7
+- During product-card decluttering passes, wants promo/discount badges (e.g., the "n% OFF" label) hidden too — prefers a clean, uncluttered product card with no discount badge overlays ("hide the n% off label too"), the same treatment previously applied to hiding the delivery-date block. Confidence: 0.6
 e changes. Confidence: 0.95
 er-ui/app/(drawer)/(tabs)/home/index.tsx, I want similar here") and expects the agent to mirror that pattern exactly, including details like item counts and container styling. Confidence: 0.9
 als) rather than introducing new brand palettes; approval of a redesign's layout/composition does not imply approval of color or theme changes. Confidence: 0.95

apps/web-ui/src/components/ProductCard.tsx

@@ -130,6 +130,7 @@ export function ProductCard({
           </div>
         )}
 
+        {/* Discount label hidden for now
         {discountPercent > 0 && (
           <div className="absolute left-3 top-3 rounded bg-brand-600 px-2 py-0.5">
             <p className="text-[10px] font-black uppercase tracking-wide text-white">
@@ -137,6 +138,7 @@ export function ProductCard({
             </p>
           </div>
         )}
+        */}
 
         {displayIsOutOfStock && (
           <div className="absolute inset-0 flex items-center justify-center bg-gray-900/50">
@@ -170,8 +172,8 @@ export function ProductCard({
       </div>
 
       {/* Content */}
-      <div className="flex flex-1 flex-col px-4 pb-3 pt-3">
-        <p className="mb-1.5 text-[13px] font-bold leading-snug text-gray-900 line-clamp-2 sm:text-sm">
+      <div className="flex flex-1 flex-col px-1.5 pb-2.5 pt-2.5">
+        <p className="mb-1 text-[13px] font-medium leading-snug text-gray-900 line-clamp-2 sm:text-sm">
           {item.name}
         </p>
 
@@ -183,17 +185,24 @@ export function ProductCard({
         </div>
 
         <p className="mb-1 text-[11px] font-medium text-gray-500 sm:text-xs">
-          {formatQuantity(item.productQuantity || 1, item.unitNotation).display}
+          Qty: <span className="font-semibold text-brand-700/70">{formatQuantity(item.productQuantity || 1, item.unitNotation).display}</span>
         </p>
 
+        {/* Delivery date hidden for now
         {showDeliveryInfo && displayDeliveryDate && (
-          <div className="mb-3 flex items-center self-start rounded-md border border-brand-100 bg-brand-25 px-2 py-1">
-            <Truck className="h-3 w-3 text-brand-600" />
-            <p className="ml-1.5 text-[10px] font-bold text-brand-700">
-              {dayjs(displayDeliveryDate).format('ddd, DD MMM • h:mm A')}
+          <div className="mb-1.5 self-start">
+            <div className="flex items-center">
+              <Truck className="h-3 w-3 shrink-0 text-brand-700/70" />
+              <p className="ml-1.5 text-[10px] font-bold leading-tight text-brand-700/70">
+                {dayjs(displayDeliveryDate).format('ddd, DD MMM')}
+              </p>
+            </div>
+            <p className="pl-[18px] pt-0.5 text-[10px] font-bold leading-tight text-brand-700/70">
+              {dayjs(displayDeliveryDate).format('h:mm A')}
             </p>
           </div>
         )}
+        */}
 
         {!miniView && (
           <div className="mt-auto">