fix(web): scale avatar initials with zoom, wire up the px-text guard - #2946
Open
TheSeydiCharyyev wants to merge 1 commit into
Open
fix(web): scale avatar initials with zoom, wire up the px-text guard#2946TheSeydiCharyyev wants to merge 1 commit into
TheSeydiCharyyev wants to merge 1 commit into
Conversation
9 tasks
`PubkeyAvatar` pinned its small-size initials to `text-[10px]`. The disc
around them (`h-6 w-6`) is rem-based, so browser zoom scales the disc while
the initials stay at 10 physical px - the glyphs shrink relative to their
box as the user zooms in. That is exactly the freeze-against-zoom problem
the shared px-text guard exists to catch.
Nothing caught it because web never wired that guard up. Web runs two of
the three shared guards in `scripts/` (file sizes, pubkey truncation) but
not `check-px-text-core`, even though the core is written for multiple apps
and takes a per-app overrides allowlist.
Add a `2xs` font-size token (0.6875rem / 11px) mirroring desktop's, use it
in `PubkeyAvatar`, and add `check:px-text` to web's check chain so
arbitrary `text-[...px]` and `text-[...rem]` literals cannot drift back in.
There are no allowlist entries: web has no fixed-size display glyphs of the
kind desktop exempts.
Verified on the built output that the token resolves - `dist` CSS contains
`.text-2xs{font-size:.6875rem}` - so the initials now scale with zoom
instead of silently falling back to an inherited size.
Signed-off-by: Seydi Charyyev <seydi.charyev@gmail.com>
TheSeydiCharyyev
force-pushed
the
fix/web-px-text-guard
branch
from
July 29, 2026 03:43
031e4c1 to
ad460c0
Compare
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
PubkeyAvatarpins its small-size initials totext-[10px]. The disc around them (h-6 w-6) is rem-based, so browser zoom scales the disc while the initials stay at 10 physical px — the glyphs shrink relative to their box as the user zooms in. That is the freeze-against-zoom problem the shared px-text guard exists to catch.Nothing caught it because web never wired that guard up. Web runs two of the three shared guards in
scripts/—check-file-sizes-coreandcheck-pubkey-truncation-core— but notcheck-px-text-core, even though that core is written for multiple apps and takes a per-appoverridesallowlist just like the other two.This change:
2xsfont-size token (0.6875rem/ 11px) toweb/tailwind.config.js, mirroring the desktop token of the same name;text-2xsinPubkeyAvatarinstead of thetext-[10px]literal;web/scripts/check-px-text.mjsand wirescheck:px-textinto web'scheckchain, so arbitrarytext-[…px]/text-[…rem]literals cannot drift back in.The allowlist is empty on purpose — web has no fixed-size display glyphs of the kind desktop exempts (avatar emoji, onboarding titles).
Related issue
None found. I searched open issues and the changed-file list of every open PR: none touch
web/package.json,web/tailwind.config.js,web/scripts/orweb/src/features/repos/ui/PubkeyAvatar.tsx.Testing
webpackage on Windows 11, node 22.17.1, pnpm 11.4.0.text-[10px]literal restored, the new guard fails on it:Web px-text check failed: src/features/repos/ui/PubkeyAvatar.tsx:20: text-[10px].pnpm checkpasses all four steps (biome, file sizes, px-text, pubkey truncation),pnpm typecheckis clean, andpnpm buildsucceeds..text-2xs{font-size:.6875rem}. Without that check a missing token would leave the initials at an inherited size, which would look like a fix while being a regression.