`.au-text-input--number`: monospaced font, or font-variant property?
sukhrajghuman opened this issue · 1 comments
Right now, if we add the au-text-input--number it uses our monospace font like so:
It feels kind a bit inconsistent, having different font for number inputs.
I think we could make use of the font-variant: tabular-nums property, and keep the letter spacing, so it looks a bit like this instead:
Are we expecting the au-text-input--number class to always be combined with <input type="number">?
As an example, mobile number inputs could have non-numeric symbols like plus signs, parentheses, etc. and may be better suited to using simple <input type="text"> whilst inheriting default text input styling.
This puts the onus of input data cleanup back on the developer, but allows for much more forgiving (and predictable) text inputs from users.
Related:
https://bradfrost.com/blog/post/you-probably-dont-need-input-typenumber/
https://html.spec.whatwg.org/multipage/input.html#number-state-(type%3Dnumber)
https://developer.mozilla.org/en-US/docs/Web/CSS/font-variant-numeric