Convert pixels to relative units

[HaSistrunk]

Is your feature request related to a problem? Please describe.

Use relative units instead of pixels for fonts to enable more fluid responsiveness. In our pixel-based sites we set media queries on our typography elements to adjust size.

Based on the results of issue #4 , consider also using relative units for other existing pixel values.

Describe the solution you'd like

Research if we should use ems, rems, or some combination of those units. rem calculates size relative to the element, where em is calculated by the sizing of its own element.

For typography, set a base font size in the body that is ideally no smaller than 16px for the body (all major browsers have a default font size of 16px). Our fonts sizes are generally a little small, so to encourage accessibility let's force ourselves to consciously evaluate when we make fonts smaller than the standard base size.

Additional context

This article explains consideration of relative units v. pixels in terms of page zoom to resize things for accessibility.

[HaSistrunk]

This is potentially its own project, and to avoid over-complicating the style library work, something we can look at separately. I'm going to leave this issue open for now to evaluate at a later stage.