Skip to content

Export CSS bundle without Tailwind preflight #322

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 4 commits into from
Nov 2, 2022
Merged

Conversation

nmanu1
Copy link
Contributor

@nmanu1 nmanu1 commented Nov 1, 2022

Add an export for a CSS bundle without the Tailwind preflight CSS resets. While testing, I noticed that some of our components rely on Tailwind's default border color, which is set in the CSS resets. For users who use the new bundle and specify the Tailwind resets as custom resets, the default border color isn't found because they aren't using Tailwind. I updated the components with borders that were missing a border-color so the styling is consistent regardless of what CSS resets (if any) a user provides. I also updated the default border color in the Storybook and test-site Tailwind configs to match what a no-resets user would see if we forgot to include a border-color for a border in the future.

J=SLAP-2418
TEST=manual

Remove Tailwind from the test-site and instead import the new bundle without Tailwind preflight. Add the Tailwind preflight CSS resets to test-site/src/index.css and see that the components' styling matches how they look with Tailwind (or with the CSS bundle with preflight). Scope the Tailwind CSS resets with a class name and see that only parts of the app with that class name have the CSS resets applied, while the rest of the app is unaffected.

@nmanu1 nmanu1 requested a review from a team as a code owner November 1, 2022 22:01
@coveralls
Copy link

coveralls commented Nov 1, 2022

Coverage Status

Coverage remained the same at 85.401% when pulling e5f830b on dev/css-resets into 5057f43 on develop.

@github-actions
Copy link
Contributor

github-actions bot commented Nov 1, 2022

Current unit coverage is 88.49693251533742%
Current visual coverage is 77.40899357601712%
Current combined coverage is 89.03374233128834%

@nmanu1 nmanu1 requested a review from oshi97 November 2, 2022 15:10
@nmanu1 nmanu1 merged commit d531bd4 into develop Nov 2, 2022
@nmanu1 nmanu1 deleted the dev/css-resets branch November 2, 2022 18:23
@tmeyer2115 tmeyer2115 mentioned this pull request Dec 15, 2022
tmeyer2115 added a commit that referenced this pull request Dec 15, 2022
### Features
- Default behavior of `FilterSearch` was changed to better support Locators and Doctor Finders. Additionally, a new `onSelect` prop was added to the Component. The `searchOnSelect` prop is now deprecated.  (#323, #343, #333)
- A new CSS bundle without the Tailwind resets is exported. (#322)
- We've added a `MapboxMap` Component, powered by v2 of their JavaScript API. (#332)

### Changes
- Assorted updates to improve our GH Actions. 
- Styling of Facet Headers is now exposed in `FilterGroupCssClasses`. (#321)

### Bug Fixes
- Vulnerabilities were addressed for the repo and its test-site. 
- Fixed the Dropdown Component to invoke `preventDefault` only when it is active. (#307)
- Corrected a small error in the generation of SSR Hydration IDs. (#315)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants