@kolkrabbi/kol-theme 0.98.0 → 0.100.0

package/kol-components-molecules.css

@@ -995,15 +995,21 @@
   color: var(--kol-fg-emphasis);
   text-align: right;
 }
-/* THE THUMB IS A FIXED SQUARE BOX (ContentRowsAndPrintCard, kol-website
- * 2026-08-27 — user: "the image should not control height, image should fit
- * the row image placeholder"). Verbatim from the /stack + /prints tune: the
- * box is `--kol-row-thumb` wide and square, sits at the top of the row, and
- * whatever is inside fills it (ContentMedia object-covers). Row height =
- * max(thumb, text) — an image's intrinsic height never sizes a row again. */
+/* THE THUMB IS A FIXED BOX (ContentRowsAndPrintCard, kol-website 2026-08-27 —
+ * user: "the image should not control height, image should fit the row image
+ * placeholder"). The box is `--kol-row-thumb` wide, sits at the top of the row,
+ * and whatever is inside fills it (ContentMedia object-covers). Row height =
+ * max(thumb, text) — an image's intrinsic height never sizes a row again.
+ *
+ * SQUARE IS THE DEFAULT, NOT THE LAW (RowThumbRatioDead, kol-website
+ * 2026-08-30). `aspect-ratio: 1 / 1` was hard-coded here, and ContentRow passed
+ * `ratio={null}` to ContentMedia, so the component's own documented `ratio`
+ * prop reached nothing — /prints set `1 / 1.41421` for its A-series posters and
+ * the render did not move. Now a variable with `1 / 1` as the fallback: every
+ * existing consumer is pixel-identical, and the prop works. */
 .kol-row > .kol-row-thumb {
   width: var(--kol-row-thumb);
-  aspect-ratio: 1 / 1;
+  aspect-ratio: var(--kol-row-thumb-ratio, 1 / 1);
   align-self: flex-start;
 }
 .kol-row > .kol-row-thumb > * {
@@ -1011,8 +1017,31 @@
   width: 100%;
 }
 /* `thumb="fill"` (WorkListingRowsAndFilters, 2026-08-27): the row publishes
- * `--kol-row-thumb` as the rung minus its vertical padding, so the square above
- * IS the content height — `/work`: 136 in a 168 row at 16 padding. */
+ * `--kol-row-thumb` as the rung minus its vertical padding — `/work`: 136 in a
+ * 168 row at 16 padding.
+ *
+ * RULED 2026-08-30 (the ask's third box): under `fill`, that number is the
+ * HEIGHT, not the width. "Fill" means fill the row's content height — that is
+ * the whole promise of the value — so a non-square ratio has to widen the
+ * thumb, never grow the row past its rung. Keeping it as the width would make
+ * an A-series fill thumb 1.41× taller than the row it is filling, which is the
+ * one thing the 08-27 ruling exists to prevent. Square is unaffected: at
+ * `1 / 1` width and height are the same number either way. */
+.kol-row > .kol-row-thumb.is-fill {
+  width: auto;
+  height: var(--kol-row-thumb);
+}
+/* WHICH AXIS PAYS for a non-square ratio (RowRungAndFillThumb, kol-website
+ * 2026-08-30). The 08-30 ruling above made the rung the HEIGHT unconditionally,
+ * so an A-series thumb on a 168 row went 136×136 → 96×136: the ratio came out
+ * of the width, and the width is what sets a listing's rhythm against the rest
+ * of the page. That was a ruling where a choice belonged — `ratioAxis="height"`
+ * holds the width at the rung and lets the thumb grow taller instead
+ * (136×192). Default is unchanged, so nothing that exists moves. */
+.kol-row > .kol-row-thumb.is-fill.pays-height {
+  width: var(--kol-row-thumb);
+  height: auto;
+}
 
 /* CONTAINER query, not a viewport one (2026-08-15). The row steps on the width
  * of the WALL it sits in, for exactly the reason the card-wall law gives: the

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kolkrabbi/kol-theme",
-  "version": "0.98.0",
+  "version": "0.100.0",
   "description": "KOL (Kolkrabbi) design-system tokens + base CSS — brand-neutral. The canonical token/cascade layer every other KOL package and consumer builds on.",
   "license": "MIT",
   "type": "module",