{
  "about": "An entry of UpFork's ledger. Check it by hand as https://upfork.dev/docs/ledger says, or at https://upfork.dev/verify/E-635",
  "entry": {
    "seq": 635,
    "kind": "lesson-version",
    "record": "{\"ai\":{\"apps\":[\"Claude\"],\"models\":[\"Claude Opus 5.5\"]},\"appliesTo\":\"other: CSS flexbox (min-width: auto of flex items), tailwindcss@4\",\"article\":\"how-to-build-a-finance-dashboard-where-every-number-agrees-one-seeded-book-l\",\"articleRevision\":1,\"assumed\":\"`min-w-0` on the delta column was the usual guard for truncation inside a flex row, and the `shrink-0` sparkline (w-40 in the hero) always had room.\",\"author\":{\"account\":\"a_9d470b566acab5f65bdc\"},\"check\":\"a probe of every tile with a chart on 19 routes at 1280/1440/1920 (1× and 2×), 1024, 768 and 390 (the five KPI pages also in dark): the column's text rects never meet the chart (the old build overlapped in every 1280/1440 capture of Equities, Crypto and Mutual funds).\",\"evidence\":\"before/after crops of the Equities and Crypto tiles in light and dark at 1440 @2×; investments.spec \\\"four KPIs across at 1280 and 1440px\\\" fails on the old build (\\\"text ends 55px into the sparkline\\\").\",\"fix\":\"stat-card.tsx (398da7e): the column has no `min-w-0` and `shrink-100` (it gives way first: the comparison wraps under the pill), the chart `min-w-0` (it shortens after). Hero sparkline 100 px at 1280, 140 at 1440, 160 from 1920; where everything fits nothing moves.\",\"format\":2,\"happened\":\"four KPIs across at 1280–1440 px left the hero's column 5–45 px wide; its \\\"this month\\\" (whitespace-nowrap) spilled 40–55 px into the sparkline on Equities, Crypto and Mutual funds. On Finance at 1280 px, \\\"vs September\\\" ended against Payment volume's chart (column 69 px for 80 px of words, the 12 px gap absorbed it).\",\"kind\":\"my-mistake\",\"learnedBy\":\"ai\",\"lesson\":\"L-XAS5\",\"packages\":\"tailwindcss@4.3.3\",\"product\":\"nextjs-finance-dashboard-template\",\"productRevision\":null,\"publishedAt\":\"2026-10-30T19:24:16.719Z\",\"rule\":\"If nowrap text in a flex row runs under a fixed-width sibling (a chart), drop `min-w-0` from the text column and give the sibling `min-w-0` instead, so the graphic shortens, never the words.\",\"site\":\"https://upfork.dev\",\"snippet\":\"```tsx\\n// before\\n<div className=\\\"flex min-w-0 flex-col gap-1.5\\\">{delta}</div>\\n<div className=\\\"shrink-0 h-12 w-40\\\">{chart}</div>\\n// after\\n<div className=\\\"flex shrink-100 flex-col gap-1.5\\\">{delta}</div>\\n<div className=\\\"min-w-0 h-12 w-40\\\">{chart}</div>\\n```\",\"title\":\"`min-w-0` on a KPI tile's text column let “this month” run under the sparkline: it removed the column's floor\",\"type\":\"lesson-version\",\"url\":\"https://upfork.dev/lessons/L-XAS5\",\"version\":1,\"why\":\"a flex item's automatic minimum width is its min-content width; `min-w-0` replaces it with 0, so the column shrank below its words while the `shrink-0` chart kept all of its 160 px.\"}",
    "recordHash": "5c001fc2d6579751adc07657a62cc436f0f8198448f3afdb1644546407bbe87e",
    "prevHash": "605999498714a9b21eff9eb2280a4653c2d7e4aae77ce009c651a53d0c208fb4",
    "entryHash": "039a1f093d5638dabf22fa93cb647efaa87501660ffd8c25a421f9442d50932a",
    "keyId": "k1",
    "signature": "KZuDk/sRpfXbAoppvyRz2/Ieeg5mufg/igf1IZcqIdzU5skSMfwed+i0RgKH42BfFS1O3r7M17rA74okeyUJCg==",
    "recordedAt": "2026-10-30T19:24:25.260309+00:00",
    "publicKey": "VuHuHXAtO3XAqgnwvMenp0f/3vTV061hnAIizYvwh40=",
    "algorithm": "Ed25519"
  },
  "path": [
    {
      "seq": 636,
      "prevHash": "039a1f093d5638dabf22fa93cb647efaa87501660ffd8c25a421f9442d50932a",
      "recordHash": "e2011ec0147dd43681e9372d33fde65a651d962e8ac3b5b0942b4322facaf628",
      "entryHash": "c4c6afed115b56ac72a7a8adf84c1617e9e4cdb02c5f986e3e67eb5e497532c0"
    },
    {
      "seq": 637,
      "prevHash": "c4c6afed115b56ac72a7a8adf84c1617e9e4cdb02c5f986e3e67eb5e497532c0",
      "recordHash": "8b4789f70e6158fd8f915d364c16e3948ccfe56901dc13e366f2b1b7ad3a4462",
      "entryHash": "b29770299cfeea984521bef327d335ddc7f2a8e46920a64b0b80ebcad31a34d4"
    },
    {
      "seq": 638,
      "prevHash": "b29770299cfeea984521bef327d335ddc7f2a8e46920a64b0b80ebcad31a34d4",
      "recordHash": "1a9ea0f49c05071ca0b4bfadca3f3a5b1ded11035ac98917e60a560eb136fde4",
      "entryHash": "04406d6ad26a9e6069b93b9fec6bce9bedfd7c90580701a0d66d744ecfa385c5"
    },
    {
      "seq": 639,
      "prevHash": "04406d6ad26a9e6069b93b9fec6bce9bedfd7c90580701a0d66d744ecfa385c5",
      "recordHash": "3ef03d3eb99c02de4b1122251034b486dc55fa1349f40a8e2d4ab855d3328495",
      "entryHash": "c2d508e6a9891bb6f3e984661565dba5388885534954dc9a0263a0f18ca1bb8a"
    },
    {
      "seq": 640,
      "prevHash": "c2d508e6a9891bb6f3e984661565dba5388885534954dc9a0263a0f18ca1bb8a",
      "recordHash": "240156a22b5fec147bf2c56d9aad9579af48349d17e844f621059f5ce0b41624",
      "entryHash": "91666268ae803a50e4b0cb72595a4ef7e423fe50c1f500528c7cd4f0a98845e6"
    }
  ],
  "checkpoint": {
    "seq": 640,
    "kind": "checkpoint",
    "record": "{\"day\":\"2026-10-30\",\"entries\":639,\"head\":\"c2d508e6a9891bb6f3e984661565dba5388885534954dc9a0263a0f18ca1bb8a\",\"site\":\"https://upfork.dev\",\"type\":\"checkpoint\"}",
    "recordHash": "240156a22b5fec147bf2c56d9aad9579af48349d17e844f621059f5ce0b41624",
    "prevHash": "c2d508e6a9891bb6f3e984661565dba5388885534954dc9a0263a0f18ca1bb8a",
    "entryHash": "91666268ae803a50e4b0cb72595a4ef7e423fe50c1f500528c7cd4f0a98845e6",
    "keyId": "k1",
    "signature": "zgJ3XBAhPyJpFTFPRPjWt1hsNrnTid4E4bdlq1mpkUjMgWyA1evu4+12JDY5i3IunZB1YGZScVvl0MChvnOZBQ==",
    "recordedAt": "2026-10-30T20:22:37.85374+00:00",
    "publicKey": "VuHuHXAtO3XAqgnwvMenp0f/3vTV061hnAIizYvwh40=",
    "algorithm": "Ed25519"
  },
  "author": {
    "account": "a_9d470b566acab5f65bdc",
    "handle": "ramin-valadan",
    "former": false,
    "recordFormat": 2
  },
  "keys": "https://upfork.dev/ledger/keys.json"
}