Add postCSS to Gazebo #23
Merged
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
|
Deploy preview for gazebo ready! Built with commit dfe5152 |
Codecov Report
@@ Coverage Diff @@
## main #23 +/- ##
=======================================
Coverage 59.67% 59.67%
=======================================
Files 11 11
Lines 62 62
Branches 9 9
=======================================
Hits 37 37
Misses 23 23
Partials 2 2
Continue to review full report at Codecov.
|
dorianamouroux
approved these changes
Nov 16, 2020
tailwind.config.js
Outdated
Comment on lines
106
to
121
| variants: { | ||
| text: ['default', 'hover', 'focus', 'disabled'], | ||
| backgroundColor: ['default', 'responsive', 'hover', 'focus', 'disabled'], | ||
| opacity: ['default', 'responsive', 'hover', 'focus', 'disabled'], | ||
| textColor: [ | ||
| 'default', | ||
| 'responsive', | ||
| 'hover', | ||
| 'focus', | ||
| 'disabled', | ||
| 'visited', | ||
| ], | ||
| borderColor: ['default', 'responsive', 'hover', 'focus', 'disabled'], | ||
| cursor: ['default', 'responsive', 'disabled'], | ||
| textOpacity: ['default', 'responsive', 'hover', 'focus', 'disabled'], | ||
| }, |
There was a problem hiding this comment.
Could we take the default configuration on it, and we update it as we need?
There was a problem hiding this comment.
Yeah I was debating that, the only reason I left this was I wasn't sure what level of copy and pasting we'd be doing from UI. I'll clean this up.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Setups rescripts with postcss, tailwind, autoprefixed, and font magician.
Tailwind
Font Magician
CRA was very troublesome to set up with tailwind/PostCSS. I settled on extending the CRA config using rescripts. This allows us to use tailwind both in the
globals.cssfile and in css modules with fast refreshing vs using the tailwindcss cli method the internet commonly opts for.Currently CRA doesn't allow the use of PostCSS 8 and some dependencies latest versions use PostCSS 8. Auto prefixed and font magician are both on slightly older versions to maintain compatibility
There's currently a PR to make PostCSS version a peer dependency, we'll need either that or for CRA to update their postCSS version in order to keep up with our PostCSS plugins in the future. Atm both dependencies are locked in to not prompt dependabot to upgrade.
facebook/create-react-app#9716
I tested
npm startandnpm build, auto prefixed, font magicial, and tailwindcss were all generating the correct final css file.I moved App and the main css around a bit to better represent our folder structure plans. I can update this, not sure how far Dorian and I have diverged here.