Responsive font sizes

Created by: MartijnCuppens

Currently there is no font-resizing implemented in Bootstrap. Font resizing is needed to make large texts readable on all devices and to prevent longer words and compounds to fall off screen.

It's currently possible to alter the font size of the html element with media queries (see Responsive typography), but this method can cause the font-size of text to be too small on mobile devices and because the rem-value is overridden, users can't change their font-size in their browser anymore.

RFS can solve this by because this mixin automatically calculates the appropriate font-size based on the width of the device.

RFS is also available in Sass, Less, PostCSS and Stylus.

Example problem with bigger font-sizes: http://getbootstrap.com/docs/4.1/content/typography/#display-headings

RFS solution: https://project-rfs.github.io/docs/4.1/content/typography/#display-headings

Bootstrap implementation demo: https://project-rfs.github.io/

Github page: https://github.com/twbs/rfs

Pull request https://github.com/twbs/bootstrap/pull/23816