We are wanting to clean up and refresh the site-wide typography. We'd like your help with:
Identifying any problems with our typography configuration across the site. All text across the site must be using Tailwind values so we can quickly and easily update fonts in the future. Are there any pages or components using one-off or custom text styles that we need to account for?
Implementing a new set of Tailwind specs
Requirements:
I'm not exactly sure how our typography was originally implemented, but please make sure there aren't any conflicting or unnecessary definitions anywhere. Ex:Heading.tsx appears to be setting font values that are different from what we currently use globally. Does this file serve a purpose? Does it cause issues?
Please take a look at the new Tailwind specs found here: Figma file . Is there anything missing or confusing? Please provide feedback before implementing.
Update Tailwind font families. We will no longer be using Source Sans or defaulting to system fonts, we will now use the following collection of web fonts across the marketing site. The styles that will inherit these are listed in the spec as well.
'sans': Inter,...
'mono': Roboto mono,...
'display': Space Grotesk,...
Ensure all Tailwind styles fit the definitions listed in our Figma typescale
Update certain blog template type styles (H1, H2, H3, add Callout) according to the specs
We are wanting to clean up and refresh the site-wide typography. We'd like your help with:
Requirements:
Heading.tsx
appears to be setting font values that are different from what we currently use globally. Does this file serve a purpose? Does it cause issues?'sans': Inter,... 'mono': Roboto mono,... 'display': Space Grotesk,...