{
  "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-741",
  "entry": {
    "seq": 741,
    "kind": "lesson-version",
    "record": "{\"ai\":{\"apps\":[\"Claude\"],\"models\":[\"Claude Opus 5.5\"]},\"appliesTo\":\"other: SVG shapes stretched with preserveAspectRatio none\",\"article\":\"a-camera-that-walks-up-to-a-shoe-springs-buying-inside-a-3d-room-and-a-wall\",\"articleRevision\":2,\"assumed\":\"`vector-effect: non-scaling-stroke` would keep the outline true at any width.\",\"author\":{\"account\":\"a_9d470b566acab5f65bdc\"},\"check\":\"screenshot the pill at its narrowest and its widest (411 px and 1020 px here): both ends are half-circles of the same radius.\",\"evidence\":\"commit badceaf.\",\"fix\":\"no viewBox, percentage sizes, and the svg inset by half the stroke.\",\"format\":2,\"happened\":\"it keeps the stroke's width, not the shape: the radius was in viewBox units, so it stretched with the box. Fine at 411 px, pointed at 1020 px on a 3440 px window.\",\"kind\":\"my-mistake\",\"learnedBy\":\"ai\",\"lesson\":\"L-CSYK\",\"packages\":\"\",\"product\":\"3d-shoe-showroom-webgl-react\",\"productRevision\":2,\"publishedAt\":\"2026-11-06T06:30:27.595Z\",\"rule\":\"If an SVG pill outline uses `preserveAspectRatio=\\\"none\\\"` with rx and ry in viewBox units, its ends distort once it is wider than the viewBox: drop the viewBox and size the rect in percentages.\",\"site\":\"https://upfork.dev\",\"snippet\":\"```tsx\\n// before (P3)\\n<svg className=\\\"fl-pill-line\\\" aria-hidden=\\\"true\\\" preserveAspectRatio=\\\"none\\\" viewBox=\\\"0 0 300 56\\\">\\n  <rect x=\\\"0.75\\\" y=\\\"0.75\\\" width=\\\"298.5\\\" height=\\\"54.5\\\" rx=\\\"27.25\\\" ry=\\\"27.25\\\" vectorEffect=\\\"non-scaling-stroke\\\" />\\n</svg>\\n// after: no viewBox, so rx and ry are real pixels at any width\\n<svg className=\\\"fl-pill-line\\\" aria-hidden=\\\"true\\\">\\n  <rect width=\\\"100%\\\" height=\\\"100%\\\" rx=\\\"27.25\\\" ry=\\\"27.25\\\" />\\n</svg>\\n```\\n```css\\n/* pulled in by half the stroke, so the whole line stays inside the 56 px pill */\\n.fl-pill-line {\\n  position: absolute;\\n  inset: 0.75px;\\n  width: calc(100% - 1.5px);\\n  height: calc(100% - 1.5px);\\n  overflow: visible;\\n  fill: none;\\n  stroke: var(--fl-line);\\n  stroke-width: 1.5;\\n}\\n```\",\"title\":\"A pill outline in a stretched viewBox went pointed at 1020 px wide: drop the viewBox\",\"type\":\"lesson-version\",\"url\":\"https://upfork.dev/lessons/L-CSYK\",\"version\":2,\"why\":\"\"}",
    "recordHash": "bd775f3933a9331608006cb9dab099fbbf9c058903b7a70e806eff5c3c964400",
    "prevHash": "96a59be1ceb624a1769f0a57e49dc12d43158c8cb6a1ec704572d364ea76a938",
    "entryHash": "b638f2476a4785cc2ea388b92382c8573851ce26a73cedaf7a88fca467b22fa9",
    "keyId": "k1",
    "signature": "8yOfYXZoqx63D8BP5lo/ZV3Fy/CcSIhgcfAzuEZOd3GFre742uy+1vyPUYgVC/TnqDyrUMFe+P3A6ZMkOKCSBQ==",
    "recordedAt": "2026-11-06T06:30:31.691006+00:00",
    "publicKey": "VuHuHXAtO3XAqgnwvMenp0f/3vTV061hnAIizYvwh40=",
    "algorithm": "Ed25519"
  },
  "path": [
    {
      "seq": 742,
      "prevHash": "b638f2476a4785cc2ea388b92382c8573851ce26a73cedaf7a88fca467b22fa9",
      "recordHash": "0b1c8bc45e5feb3530ce6f892397c05f91524e638ce63db5f18ada29eb0daa3d",
      "entryHash": "2b3fa56e55a35718d947013d7debb10bc7cc5fc2f08d7023943cd837ac0f3b9c"
    },
    {
      "seq": 743,
      "prevHash": "2b3fa56e55a35718d947013d7debb10bc7cc5fc2f08d7023943cd837ac0f3b9c",
      "recordHash": "69924b6b081f4cdf1d0076a15873d2d20fcb9f560551b9ffb712551cfc1d82c6",
      "entryHash": "e4efb4a5b3bb3a3cae88271d9eaa99cfbb4a744223c5d971cd75e6cb481fd6c4"
    },
    {
      "seq": 744,
      "prevHash": "e4efb4a5b3bb3a3cae88271d9eaa99cfbb4a744223c5d971cd75e6cb481fd6c4",
      "recordHash": "9746147eda36ce0b6c2b5c4a0c9e9f0e2577cbd4822d6e8629608eb2c0b71520",
      "entryHash": "4a6d01c16b002c8cfcf81ce42b832c7057fa1e498e2e60f0207c4f6a2914c3a1"
    },
    {
      "seq": 745,
      "prevHash": "4a6d01c16b002c8cfcf81ce42b832c7057fa1e498e2e60f0207c4f6a2914c3a1",
      "recordHash": "18461d034445174dadb8d60e0ae520e43238eb5de4ecf258b307efb9eda0f75e",
      "entryHash": "7874c3499db7f02ec0a618d6c8b792939f12274f98f567390d793756baf49987"
    },
    {
      "seq": 746,
      "prevHash": "7874c3499db7f02ec0a618d6c8b792939f12274f98f567390d793756baf49987",
      "recordHash": "43472bd553053b51c457b301b018e0c2b7ee2823bbeec4d4cb3d998c330670b3",
      "entryHash": "d599c9a8cd18c5663c255d6d52fd089bdcf529953fbbd2171e13fe508a5b6906"
    },
    {
      "seq": 747,
      "prevHash": "d599c9a8cd18c5663c255d6d52fd089bdcf529953fbbd2171e13fe508a5b6906",
      "recordHash": "e821146f0fac445d549456185308408cc2569e3576b20adea84d056e82ad7db6",
      "entryHash": "dba0a233532f0989fb1e079c0b98a371c444565653a6957f796d45a1dd29447c"
    },
    {
      "seq": 748,
      "prevHash": "dba0a233532f0989fb1e079c0b98a371c444565653a6957f796d45a1dd29447c",
      "recordHash": "cbc3c2edb0848147c18234971f734239ed429796bf4741f7b92ad626814b6283",
      "entryHash": "a07129e35fa7f3ce672735adec5803bb5c7a038519b0fe60b402b612e689f828"
    },
    {
      "seq": 749,
      "prevHash": "a07129e35fa7f3ce672735adec5803bb5c7a038519b0fe60b402b612e689f828",
      "recordHash": "1af6f0da17fbc3074a19264ecbac727228583d254829b357d261361cfd657ff0",
      "entryHash": "1d4d419263c7b848e5c0696d33fabc5299d1d5d6f57bc25c168dff7fba75b3b3"
    },
    {
      "seq": 750,
      "prevHash": "1d4d419263c7b848e5c0696d33fabc5299d1d5d6f57bc25c168dff7fba75b3b3",
      "recordHash": "c0e6111b35c850b6b025249cb3052f6590ef08a94419a6bbdf7eafab427d5442",
      "entryHash": "b1f2a5d8fc7ada8482388933eab267a5cce8372cc692b18b350def15be6ff9cc"
    },
    {
      "seq": 751,
      "prevHash": "b1f2a5d8fc7ada8482388933eab267a5cce8372cc692b18b350def15be6ff9cc",
      "recordHash": "c5d1b877fd3bbe19f5ee9e88b92d828a30060c5fd747af9abdeb4ea7b39ecf63",
      "entryHash": "9cf6c3dfab6e928f20ee0f521595b75cbfd7c816873c60324b1c9741e42a5856"
    },
    {
      "seq": 752,
      "prevHash": "9cf6c3dfab6e928f20ee0f521595b75cbfd7c816873c60324b1c9741e42a5856",
      "recordHash": "62bf3e8e6d8f2a6ea1b6751244d845848ef5dc0fe67372562c9466f04e0b9cc4",
      "entryHash": "a20c18979ebf13e38775b741a20401dc895ab41d60aced895210fdc0030e3450"
    },
    {
      "seq": 753,
      "prevHash": "a20c18979ebf13e38775b741a20401dc895ab41d60aced895210fdc0030e3450",
      "recordHash": "52efcd82331fc1a489e3bce7c6289a4baececa06372f336a6970d44c65f4cea6",
      "entryHash": "3a0be41af440c5f9691ffe52d52c24b7153ac55ad6cad2b6af7b4c75673f280d"
    },
    {
      "seq": 754,
      "prevHash": "3a0be41af440c5f9691ffe52d52c24b7153ac55ad6cad2b6af7b4c75673f280d",
      "recordHash": "73a0be246a1c8fe0567e95b87424f05b03155fc1ab243997e9e5881db82508d2",
      "entryHash": "e40533483acb4267fb8e584c8ee4e661fb079d09503f5331c673b016aeb9e861"
    },
    {
      "seq": 755,
      "prevHash": "e40533483acb4267fb8e584c8ee4e661fb079d09503f5331c673b016aeb9e861",
      "recordHash": "30bcfaac3c7e047ada300b0e6bc8e761a57c32f66aee435dc215edb194135120",
      "entryHash": "cd7172a6bae036563eab51ffc3027cbe250c51c9e54ce63c542512a5a41fd2e1"
    },
    {
      "seq": 756,
      "prevHash": "cd7172a6bae036563eab51ffc3027cbe250c51c9e54ce63c542512a5a41fd2e1",
      "recordHash": "9bba31715e4b3024949903cba3bae801b36c1f05006b14a70fa04e82762407c2",
      "entryHash": "8dda3d7f44858e5b3d34ae01f25daf3ac74296a93bc49c7cf88c139abfb56d0e"
    },
    {
      "seq": 757,
      "prevHash": "8dda3d7f44858e5b3d34ae01f25daf3ac74296a93bc49c7cf88c139abfb56d0e",
      "recordHash": "bcc6b16f5c531eb82f1ac794a76176f2af3c2badd43284a6bb6da04ad53c5091",
      "entryHash": "d59ced9b023d85459a97329e48e4651b6a7d97d83f71acc20e21fc830302527d"
    },
    {
      "seq": 758,
      "prevHash": "d59ced9b023d85459a97329e48e4651b6a7d97d83f71acc20e21fc830302527d",
      "recordHash": "594cba1276f9f885d9ab47c43d2e71d53198a1a57c27d76dc9b56216cb457b7c",
      "entryHash": "cab63f99197c5c31f48bc9191f8a568dd69f4de84b69760388fa45a9d0f5ebc7"
    },
    {
      "seq": 759,
      "prevHash": "cab63f99197c5c31f48bc9191f8a568dd69f4de84b69760388fa45a9d0f5ebc7",
      "recordHash": "50e0cfd3811480470005091a496f6e40f06444b292796f2bab7da4b7cf2ccf8d",
      "entryHash": "32a4d0742ea943ad23b40241146fc1b4e04a172d701f241d6d71f755049014c0"
    },
    {
      "seq": 760,
      "prevHash": "32a4d0742ea943ad23b40241146fc1b4e04a172d701f241d6d71f755049014c0",
      "recordHash": "30df2884e99a192ce35e29e71be31a87622ac5614555a5b9b87bf17adfea2fc9",
      "entryHash": "b4d0d0c970c318b2344c10cc2ab84e2ec095fbeac07b6fc92eab04837ae03dc6"
    },
    {
      "seq": 761,
      "prevHash": "b4d0d0c970c318b2344c10cc2ab84e2ec095fbeac07b6fc92eab04837ae03dc6",
      "recordHash": "77ef4676264cb63923f0ecff250ca1facf8e9c2d0a5183e8ba62f634673cf42c",
      "entryHash": "a7b074341426f1ccc126e1c9b545ab135962529fdc674106d240429d8004925c"
    },
    {
      "seq": 762,
      "prevHash": "a7b074341426f1ccc126e1c9b545ab135962529fdc674106d240429d8004925c",
      "recordHash": "eb49c68428598c6a1edd9dff33863361279fe9927fb0d570d1925f7bd1413c9b",
      "entryHash": "7bbb1fba0754a33ffea8b7f95fb0d032c61ab827435e0dd4aa13585e41f002e0"
    }
  ],
  "checkpoint": {
    "seq": 762,
    "kind": "checkpoint",
    "record": "{\"day\":\"2026-11-07\",\"entries\":761,\"head\":\"a7b074341426f1ccc126e1c9b545ab135962529fdc674106d240429d8004925c\",\"site\":\"https://upfork.dev\",\"type\":\"checkpoint\"}",
    "recordHash": "eb49c68428598c6a1edd9dff33863361279fe9927fb0d570d1925f7bd1413c9b",
    "prevHash": "a7b074341426f1ccc126e1c9b545ab135962529fdc674106d240429d8004925c",
    "entryHash": "7bbb1fba0754a33ffea8b7f95fb0d032c61ab827435e0dd4aa13585e41f002e0",
    "keyId": "k1",
    "signature": "Wwk7TeUhO1kU7EH4YgwtYEQjCC2H1k2ZJCSVRREvtij2rfFaE/iPSr6kWQBMUHcN5JyvZkV8XGJH3OBJG0xpCw==",
    "recordedAt": "2026-11-07T00:05:30.164123+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"
}