-
-
Notifications
You must be signed in to change notification settings - Fork 2.6k
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
Fix CSS ordering between imported and Astro styles #4907
Conversation
🦋 Changeset detectedLatest commit: d4b6ecc 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 |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This PR is blocked because it contains a minor
changeset. A reviewer will merge this at the next release if approved.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Tests look good! Added one comment just to confirm how this works with /public
as well
</style> | ||
``` | ||
|
||
The `<style>` defined in this component will be placed *below* the imported CSS. When compiled for production this will result in something like this: |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Just to double check here, these will both be added after any user provided <link rel="stylesheet">
in the head, right? Meaning any stylesheets pulled from /public
or an external CDN would be first on page?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Yes, all of the CSS and scripts we add are added to the bottom of the head, so after all user-defined head content. We don't parse the HTML so we don't even know about your link tags.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
🎉 So happy for this fix!
Tomorrow is release day
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
LGTM
Changes
The Astro styles should be placed after the imported styles, so that they are preferred if their specificity is the same.
Testing
Docs
N/A, bug fix