chadtmiller.com/knotless

Switch repository

Loading…

What changes

Tokens. ios/Knotless/Support/Theme.swift, which held only colours, now has Space, Radius, Icon and Size, and the app's padding, stack spacing, corner radii, icon and avatar sizes take them by name. Space follows the scale of --space-* in web/src/tokens.css, so Space.s2 is --space-2, with s3_5, s7 and s9 added for what the app uses and the web's scale lacks. Dividers' insets are worked out from what they line up with, not written as 58 and 52. ios/README.md says to take a token by name.

A few sizes moved. Values off the scale went to their nearest: spaces of 1 to 2, 3 to 4, 5 to 6, 7 to 8 and 13 to 12, a diff line's 1.5 to 2, radii of 7 to 8 and 14 to 12, a 13pt icon to 12, avatars of 18 to 20 and 22 to 24, and the inbox's 22pt state icon to 24. Most of what moves is by a point or two, as rows and stacks take up the change.

Why

Six radii and over a hundred written spaces drifted apart screen by screen, with no way to change one everywhere. Taking the odd values to the scale is what makes it a scale. Keeping them all as tokens would only have named the drift.

How it was checked

ios/look.mjs drew all 31 screens in dark before and after, and each was compared. 7 are identical pixel for pixel. Of the 24 that moved, I looked at 12 side by side (home, inbox, repository, search-repositories, pull-open, commit, profile, person, my-pulls, search-code, search-people, files): nothing shifted beyond the small moves above. Diff tints are the same colours in both.

Shortcomings

Only each screen's top, in dark. Light mode, what is further down each screen and the other 12 that moved were not looked at. Sizes that belong to one thing rather than a scale stay written where they are, such as a diff's line number column and a picture's width.

Review

Theme.swift for the scale. The rest is mechanical.

🤖 Generated with Claude Code

This pull adds Space, Radius, Icon and Size tokens to Theme.swift and switches the iOS app's padding, spacing, radii, icon sizes and avatar sizes to them. I read Theme.swift and the README note, and checked the Space values against web/src/tokens.css. s0_5, s1, s1_5, s2, s2_5, s3, s4, s5 and s6 match --space-0-5 through --space-6. s3_5, s7 and s9 are the three extras, and the body says so.

I did not read the call-site changes, which are the rest of the diff. The author calls them mechanical, and the shifts they describe (a point or two on 24 screens) are a visual risk that review can't catch.

Two small things, neither blocking:

• Space.s7 and s9 sit where the web scale has --space-8 (32). The numbering doesn't follow the web's, so s9 isn't 9 × 4 like the web's other names. A short comment on that would help.
• Light mode and the 12 moved screens that weren't looked at are the untested part, as the body admits.