Skip to content

FieldShield v1.1.1 — Cursor Drift in Proportional Fonts

Choose a tag to compare

View all tags
@anuragnedunuri anuragnedunuri released this 12 Apr 22:23
· 4 commits to main since this release
v1.1.1
037636a

What's changed

Fixed

  • Cursor drift in proportional font environments — .fieldshield-real-input
    now enforces a monospace font stack with !important: ui-monospace, "Cascadia Code", "Source Code Pro", Menlo, Consolas,
    "DejaVu Sans Mono", monospace

The real input is always color: transparent — consumers never see it, only the cursor. Without this fix, font-family: inherit caused the real
input to pick up the consumer's proportional font (Inter, Roboto, Arial), where character advance widths are not uniform. The cursor drifted
progressively further from the displayed text as more characters were typed.

  • Root cause — the demo app used IBM Plex Mono which masked the bug during development. Consumer apps with proportional fonts exposed the drift.

Notes

  • The mask layer (what users actually see) still inherits the consumer's font — visual output is unchanged.
  • .fieldshield-a11y-input is unaffected — the password input retains
    font-family: inherit so the browser's native dot masking renders correctly.
  • No consumer-side changes required.

Live demo

https://fieldshield-demo.vercel.app

Assets 2
Loading