Skip to content
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

Fixed Tailwind 4 migration bugs, broken build #3532

Merged
merged 3 commits into from
Jan 31, 2025
Merged

Fixed Tailwind 4 migration bugs, broken build #3532

merged 3 commits into from
Jan 31, 2025

Conversation

KenAJoh
Copy link
Collaborator

@KenAJoh KenAJoh commented Jan 31, 2025

Description

Tailwind 4 sets margin: 0´ and padding: 0on every element. This causedinset: 0` to no longer work for Modal.

  • Fixed by setting margin: auto on Modal
  • Fixed dynamic padding on ExpansionCard button`
  • Removed build-breaking prop-stories for Tag

Tested by emulating the new Tailwind 4 base-sheet and running chromatic locally to check for discrepancies.

Component Checklist 📝

  • JSDoc
  • Examples
  • Documentation / Decision Records
  • Storybook
  • Style mappings (@navikt/core/css/config/_mappings.js)
  • Component tokens (@navikt/core/css/tokens.json)
  • CSS class deprecations (@navikt/aksel-stylelint/src/deprecations.ts)
  • Exports (@navikt/core/react/src/index.ts and @navikt/core/react/package.json)
  • New component? CSS import (@navikt/core/css/index.css)
  • Breaking change? Update migration guide. Consider codemod.
  • Changeset (Format: <Component>: <gitmoji?> <Text>. E.g. "Button: ✨ Add feature xyz.")

@KenAJoh KenAJoh self-assigned this Jan 31, 2025
Copy link

changeset-bot bot commented Jan 31, 2025

🦋 Changeset detected

Latest commit: 50b11ef

The changes in this PR will be included in the next version bump.

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

Copy link
Contributor

Storybook demo / Chromatic

📝 Changes to review: 73

0e5ad8f57 | 91 components | 135 stories

@KenAJoh KenAJoh merged commit c73db43 into main Jan 31, 2025
6 checks passed
@KenAJoh KenAJoh deleted the tw-4-reset branch January 31, 2025 11:58
Comment on lines 18 to +21
/* In case Modal is opened with `show()`, in eg. Vergic screensharing */
inset: 0;
z-index: 9999;
margin: auto;
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Bør legges over kommentaren, siden det ikke har noe med kommentaren å gjøre.

Comment on lines +12 to +21
*,
::after,
::before,
::backdrop,
::file-selector-button {
box-sizing: border-box;
margin: 0;
padding: 0;
border: 0 solid;
}
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Vil ikke dette kunne brekke en del for de som lener seg på user agent stylesheet?

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Stemmer, fjernet det på main 👍

This was referenced Jan 31, 2025
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.

3 participants