tailwind: Switch font sizes to an array

[SiriusBits]

The fontSizes key takes an array of values (not an object). This fixes the heading size settings issue causing the text for headings to default to "6px" which can be seen on the Demo page when selecting "Tailwind" from the drop down.

[codesandbox-ci]

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit 6309f63:

Sandbox	Source
next-theme-ui-example	Configuration
gatsby-plugin-theme-ui-example	Configuration

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated
theme-ui	✅ Ready (Inspect)	Visit Preview	💬 Add your feedback	Feb 20, 2023 at 9:33PM (UTC)

[lachlanjc]

Good call, thank you!

[hasparus]

This is breaking for everybody who used fontSize: 'xs', right?

fontSizes and any scale can be both an array and an object.
I'd say the bug is just in the Demo page, and its assumption that the presets are uniform.

[LekoArts]

This was changed to an object in #2357 and Tailwind default theme is an object, too:

https://github.com/tailwindlabs/tailwindcss/blob/5b2c1800abc744984ec4e605903da9658118870e/stubs/config.full.js#L330-L344

So I think this PR should fix the demo page, not the theme.

[lachlanjc]

Great context, thanks. I agree the ’xl’ style font sizes are a lot easier to remember/use & are an easier onboarding coming from Tailwind.