A spacing scale

[yatesn]

It would be a good idea to introduce a spacing scale or improve the one that is not being fully utilised.

This would ensure consistency in design and development. It would also be easier to understand than a variation of rem and px values. In some cases, I see a utility measure system in place and other times various 'px' and 'rem' values.

GDS uses a static measure and a responsive measure system which works very well. https://design-system.service.gov.uk/styles/spacing/

NHS: Spacing: https://github.com/nhsuk/nhsuk-frontend/blob/6a0997f758ff4d449f71ecc4ed66cef4287bbe99/packages/core/settings/_spacing.scss Typography scale: https://github.com/nhsuk/nhsuk-frontend/blob/6a0997f758ff4d449f71ecc4ed66cef4287bbe99/packages/core/settings/_typography.scss

[yatesn]

Will require a lot of testing

Sprint 14 or 15?

[jrbarnes9]

Useful resources when considering a pixel perfect vertical spacing scale:

• https://css-tricks.com/how-to-tame-line-height-in-css/
• https://www.figma.com/blog/line-height-changes/
• https://uxplanet.org/everything-you-should-know-about-8-point-grid-system-in-ux-design-b69cb945b18d

[daniellecorke]

On the UCD Board: https://jira.ons.gov.uk/browse/CU-83.

[daniellecorke]

This issue is currently parked on the UCD Board.