Skip to content
This repository has been archived by the owner on Jul 14, 2023. It is now read-only.

Add support for complex nth-child selectors in omega() #340

merged 1 commit into from
Jul 15, 2016


Copy link

Fixes #334.

This improves support for complex nth-child selectors to omega(). Selectors like 3n + 1 are interpreted by Sass to 4n, which gave the omega() mixin the wrong selector unless they are given as a string. If they were given as a string, it wouldn't add the clear to the next element. There wasn't a test for the element with clear, so it didn't appear anything was wrong.

This detects if the query is a string and looks for an operator (+ or -), and does the appropriate math for the right selectors. This means doing some typecasting and trimming for queries like 2n + 1 (with spaces), so functions have been added for those as well.

This makes the mixin a little messier, so if anyone has ideas on how to simplify, please share.

@function to-number($string) {
$string: str-replace($string, " ", "");
$strings: '0' '1' '2' '3' '4' '5' '6' '7' '8' '9';

Choose a reason for hiding this comment

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

Prefer double-quoted strings

context "with argument ('3n-1')" do
it "removes right margin of nth-child(3n-1)" do
selector = ".omega-complex-nth-negative:nth-child(3n-1)";

Choose a reason for hiding this comment

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

Do not use semicolons to terminate expressions.

Copy link

@joshuaogle the PR looks good. Half of me wants to remove the Omega mixin entirely. This is a lot of complexity to output two CSS rules that can just be done by hand.

Copy link
Contributor Author

@wardpenney The only way we can remove the omega mixin (that I can think of) would be to add a negative left margin to the rows like the Bootstrap grid works, or don't even worry about going edge to edge like Foundation. I don't really like either of those options, but there's still a lot we can do to make the omega mixin smarter

Copy link

whmii commented Jul 6, 2016

@joshuaogle good to merge at your discretion.

@joshuaogle joshuaogle merged commit 0bd8027 into master Jul 15, 2016
@joshuaogle joshuaogle deleted the jo-complex-omega branch July 15, 2016 15:44
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
None yet
None yet

Successfully merging this pull request may close these issues.

omega(3n+1) evaluates to :nth-child(4n) in css
4 participants