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

Adding support for media query specificity bumps #385

Merged
merged 3 commits into from
Feb 17, 2021
Merged

Conversation

src-code
Copy link
Contributor

@src-code src-code commented Feb 16, 2021

Implements #384.

Introduces a new option to Atomizer, --bump-mq:

  --bump-mq                           Increases specificity of media queries a small amount

For --bump-mq I'm relying on an attribute selector, [class], which we know will always match (since the Atomic classname itself is applied via this attribute.) This raises the specificity by 0,0,1,0.

cc @snyamathi

@thierryk
Copy link
Contributor

👍 for:

--bump-mq                           Increases specificity of media queries a small amount

👎 for:

--bump-mq-important                 Override specificity of media queries by applying !important

I think we should offer the minimum bump we can without introducing a new "specificity context". Our use of !important is justified with descendant selectors but I don't see what justifies its use here.
What problem does --bump-mq-important solve that --bump-mq does not?

@src-code
Copy link
Contributor Author

Sure, I can remove the support for !important for now, and if we determine that there's a valid use case, we can bring it back later.

@src-code src-code merged commit 87fbfc5 into master Feb 17, 2021
@src-code src-code deleted the issue-384 branch February 17, 2021 20:40
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.

None yet

3 participants