Currency input

[simonwhatley]

Service: Claim for Crown court defence
Phase: Live
Department: Legal Aid Agency

Currency notation on form fields

Help users to enter an amount of money in a specified currency.

Why

Anything else

• The issue on the GOV Design System backlog

[helena-moj]

Some related discussions on prefixes here: alphagov/govuk-design-system-backlog#134

[adamsilver]

Done by @whatterz

[gregtyler]

We have a custom implementation of this component in my service in OPG, and I was looking at moving across to this version but found a bit of a blocker.

The component works great for prices:

But elsewhere in the service we're collecting email domains and the spacing doesn't quite line-up (the value is "julian-solicitors.co.uk"):

This is because the prefix has variable width (based on the text inside) but the padding on the text input is always 40px. I think either the prefix needs a max-width or it needs to sit in inline flow, rubbing shoulders with the input.

For what it's worth, I'm expecting to just drop to having a span sitting before the input. The width is flexible and removes the need for any CSS:

[adamsilver]

Thanks @gregtyler for raising this. Just to say that the last option you mention might prove a problem because it will increase the total width of that field. I think the overall width of the field shouldn't change—the bigger the prefix, the smaller the input (should it ‘rub shoulders’ and not be absolutely positioned)