Skip to content

Conversation

pheggeseth
Copy link
Contributor

Summary

If a bundled CSS file were to be loaded after the Modal CSS file, and that bundled file also includes the base styles for Button, it will cause the .closeButton of the Modal to lose its margin-left style declaration, which is what pushes the modal close button to the right of the header.

Given that neither .headerMain or .closeButton are user-configurable, this nests those classes under .header to increase the specificity of the .closeButton's margin-left declaration to be higher than that of the base .Button styles.

Screenshots (if appropriate):

Testing approaches

@pheggeseth pheggeseth requested a review from a team as a code owner September 12, 2025 20:17
Copy link

changeset-bot bot commented Sep 12, 2025

🦋 Changeset detected

Latest commit: 4a72b4b

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

This PR includes changesets to release 2 packages
Name Type
@launchpad-ui/modal Patch
@launchpad-ui/core Patch

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

Size Change: +5 B (0%)

Total Size: 530 kB

Filename Size Change
packages/modal/dist/style.css 903 B +5 B (+0.56%)
ℹ️ View Unchanged
Filename Size
apps/vscode/dist/client.js 111 kB
apps/vscode/dist/server.js 261 kB
packages/box/dist/index.es.js 7.26 kB
packages/box/dist/index.js 7.82 kB
packages/box/dist/style.css 2.67 kB
packages/button/dist/index.es.js 1.89 kB
packages/button/dist/index.js 2.32 kB
packages/button/dist/style.css 3 kB
packages/components/dist/index.es.js 19 kB
packages/components/dist/index.js 19.9 kB
packages/components/dist/style.css 8.43 kB
packages/core/dist/index.es.js 512 B
packages/core/dist/index.js 1.27 kB
packages/drawer/dist/index.es.js 1.76 kB
packages/drawer/dist/index.js 2.22 kB
packages/drawer/dist/style.css 497 B
packages/dropdown/dist/index.es.js 1.15 kB
packages/dropdown/dist/index.js 1.59 kB
packages/filter/dist/index.es.js 2.23 kB
packages/filter/dist/index.js 2.68 kB
packages/filter/dist/style.css 881 B
packages/focus-trap/dist/index.es.js 418 B
packages/focus-trap/dist/index.js 852 B
packages/form/dist/index.es.js 4.25 kB
packages/form/dist/index.js 4.73 kB
packages/form/dist/style.css 2.21 kB
packages/icons/dist/index.es.js 1.3 kB
packages/icons/dist/index.js 1.73 kB
packages/icons/dist/style.css 532 B
packages/menu/dist/index.es.js 3.69 kB
packages/menu/dist/index.js 4.16 kB
packages/menu/dist/style.css 872 B
packages/modal/dist/index.es.js 3.08 kB
packages/modal/dist/index.js 3.55 kB
packages/navigation/dist/index.es.js 2.75 kB
packages/navigation/dist/index.js 3.21 kB
packages/navigation/dist/style.css 874 B
packages/overlay/dist/index.es.js 1.02 kB
packages/overlay/dist/index.js 1.42 kB
packages/popover/dist/index.es.js 3.01 kB
packages/popover/dist/index.js 3.43 kB
packages/popover/dist/style.css 529 B
packages/portal/dist/index.es.js 420 B
packages/portal/dist/index.js 835 B
packages/table/dist/index.es.js 1.01 kB
packages/table/dist/index.js 1.44 kB
packages/table/dist/style.css 700 B
packages/tokens/dist/fonts.css 183 B
packages/tokens/dist/index.css 1.47 kB
packages/tokens/dist/index.es.js 3.07 kB
packages/tokens/dist/index.js 3.11 kB
packages/tokens/dist/media-queries.css 113 B
packages/tokens/dist/themes.css 2.27 kB
packages/tooltip/dist/index.es.js 598 B
packages/tooltip/dist/index.js 1.02 kB
packages/tooltip/dist/style.css 337 B
packages/vars/dist/index.es.js 2.66 kB
packages/vars/dist/index.js 2.66 kB

compressed-size-action

@pheggeseth pheggeseth merged commit 501f0d7 into main Sep 12, 2025
13 checks passed
@pheggeseth pheggeseth deleted the pheggeseth/fix/legacy-modal-close-button-style-specificity branch September 12, 2025 20:22
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.

2 participants