Update font-size to 16px

[elliottSlee]

User Story

As a designer
I want the default font size to 16px not 18px (100%, not 112.5%)
so that developed interfaces match my designs and are aesthetically pleasing and don't cause discord down the line regarding spacing and layouts.

Acceptance Criteria

Given that any user is on any page
when the root font-size of the browser is set to 16px (or default)
then any text that is not a heading will display at 16px

Description

This has implications for how the layouts are implemented. A great example is that the width of the analyst navigation sidebar (#760) is largely determined by the font-size. This affects the layout of it beside the page contents inside the container.

If the font-size stays at 112.5% (i.e., 18px) then the width of the widest button is 152px. That means the application view would would have to be 1010 with 8px in between sidebar and application. However, if a browser's root font size is set to something larger such as 18px, when they navigate to our site which resizes to 112.5% it'll turn into 20.25, which would make the button to 167, which would push into the page contents and possibly cause some users to have to scroll horizontally.

[elliottSlee]

@MarsRomer just bringing this card to your attention as it has implications for designs & layout

[matthieu-foucault]

This can be solved by contributing to button-inc/service-development-toolkit#576

[marcellmueller]

Closing as this was completed.