Open paulchrisluke opened 1 year ago
Our current tailwind.config.js uses non-standard font sizing which is leading to some weird styles on our site.
Currently it looks like this:
fontSize: { mi: '.65rem', md: '.9375rem', '2.5xl': '1.75rem', '3.5xl': '2rem', '4.5xl': '2.5rem', '5.5xl': '3.5rem', '6.5xl': ['4rem', '1.10'], '7.5xl': '5rem', },
It should look more like this using xs, sm, md, lg, xl and only 2xl type stuff in extreme cases:
fontSize: { xs: '.65rem', sm: '.9375rem', md: '1.75rem', lg: '2rem', xl: '2.5rem', '2xl': '3.5rem', '3xl': '4rem', '4xl': '5rem', },
Our design in figma does split the fonts into styles:
In our case, the naming of our fonts is a bit different in figma than in standard tailwind, but this is how it should look:
fontSize: { xs: '.625rem', sm: '.75rem', md: '.8125rem', lg: '.875rem', xl: '.9375rem', base: '1rem', '2xl': '1.125rem', '3xl': '1.25rem', '4xl': '1.625rem', '5xl': '2rem', },
@paulchrisluke Yes, I will check and update the tailwind.config.js file as per your suggestions
Our current tailwind.config.js uses non-standard font sizing which is leading to some weird styles on our site.
Currently it looks like this:
It should look more like this using xs, sm, md, lg, xl and only 2xl type stuff in extreme cases:
Our design in figma does split the fonts into styles:
In our case, the naming of our fonts is a bit different in figma than in standard tailwind, but this is how it should look: