[#182] Refactor after TW 4 update

[nathan-schmidt-viget]

Summary

• Breaks the tailwind.css file into smaller parts.
• Moves the ! to the end per the TW 4 docs
• Adds button vars so it is easier to just update the colors
• Updates fluid spacing to pull from the default spacing
• Updates the JS to extract the colors from the color.css file

Issues

• Refactor CSS #182

Testing Instructions

1. Make sure the theme.json has the newest css when you build the files.
2. Updating the colors in button.css to make sure is updates the button's hover/focus states.

Screenshots

NA

[bd-viget]

While I'm kind of a huge fan of changing the ! to now be at the end of the class name (as it should be), this is going to take me a while to get used to 😆.

Also using the variables in the class names is going to take some getting used to for me.

Just made one adjustment to the outline variable name since the bg should be transparent and the border is the color we want to customize.