I'm having a hard time figuring out the most efficient way to resize text for mobile. I know per the documentation, making the text size responsive to the screen is fairly straightforward, simply add the is-size-*-mobile
class to an element to reset the text size to the value of *
(1-7) for mobile devices. What elements are the best place to do this? For example, I would like to be able to have all the text on screen change to size 7 on mobile, but so far I've had to add the is-size-7-mobile
class to almost every text container on the page. While it's not impossible to do, it seems to be defeating the purpose of having such a class available through CSS.
Any tips would be greatly appreciated.