-
Notifications
You must be signed in to change notification settings - Fork 115
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
Incorrect media query concats #512
Comments
Sorry, my CSS knowledge isn't good enough here, why does order matter here? |
https://w3c.github.io/csswg-drafts/mediaqueries/#mq-syntax The syntax description is fairly complex but as a rule things like simplified : valid : @media screen {};
@media only screen {}
@media screen and (min-width: 300px) {}
@media not screen {}
@media not screen and (min-width : 300px) {}
@media screen and (min-width: 300px) and (min-height: 300px) {} Not valid : @media (min-width: 300px) and screen {}
@media (min-width: 300px) and not screen {}
... |
How complicated would this be? |
Very, and given that no one has ever opened an issue about this I don't know if it is worth it. |
In that case, I think I'll merge your regex hack and see if anyone complains 😉 |
Thank you for the reviews and the release 🙇 |
Thanks for all your contributions. BTW, you're now collaborator here; I'll still have to do releases, and we should probably still do PRs mostly, but you do have the merge bit. |
Thank you for trusting me with this package 🎉 Yes I also prefer to do PR's, it so valuable to have another opinion on changes :) |
Becomes :
Should be :
It might be interesting to adopt our media query parser : https://github.com/csstools/postcss-plugins/tree/postcss-preset-env--v8/packages/media-query-list-parser#readme
It has a typed object model which makes it easier to avoid these issues.
Alternatively it is possible to "special case" these keywords :
screen
print
all
not
And then sorting the media query lists :
and
The text was updated successfully, but these errors were encountered: