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

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

Merged
merged 1 commit into from Jul 15, 2016

Conversation

Projects
None yet
4 participants
@joshuaogle
Contributor

joshuaogle commented Apr 27, 2015

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.

Show outdated Hide outdated app/assets/stylesheets/functions/_private.scss
@function to-number($string) {
$string: str-replace($string, " ", "");
$strings: '0' '1' '2' '3' '4' '5' '6' '7' '8' '9';

This comment has been minimized.

@houndci-bot

houndci-bot Apr 27, 2015

Prefer double-quoted strings

@houndci-bot

houndci-bot Apr 27, 2015

Prefer double-quoted strings

Show outdated Hide outdated app/assets/stylesheets/functions/_private.scss
@return $result;
}
@function str-replace($string, $search, $replace: '') {

This comment has been minimized.

@houndci-bot

houndci-bot Apr 27, 2015

Prefer double-quoted strings

@houndci-bot

houndci-bot Apr 27, 2015

Prefer double-quoted strings

Show outdated Hide outdated spec/neat/omega_spec.rb
context "with argument ('3n-1')" do
it "removes right margin of nth-child(3n-1)" do
expect(".omega-complex-nth-negative:nth-child(3n-1)").to have_rule("margin-right: 0")

This comment has been minimized.

@houndci-bot

houndci-bot Apr 27, 2015

Line is too long. [91/80]

@houndci-bot

houndci-bot Apr 27, 2015

Line is too long. [91/80]

Show outdated Hide outdated spec/neat/omega_spec.rb
end
it "adds clear to nth-child('3n-0')" do
expect(".omega-complex-nth-negative:nth-child(3n-0)").to have_rule("clear: left")

This comment has been minimized.

@houndci-bot

houndci-bot Apr 27, 2015

Line is too long. [87/80]

@houndci-bot

houndci-bot Apr 27, 2015

Line is too long. [87/80]

Show outdated Hide outdated spec/neat/omega_spec.rb
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)";

This comment has been minimized.

@houndci-bot

houndci-bot Apr 28, 2015

Do not use semicolons to terminate expressions.

@houndci-bot

houndci-bot Apr 28, 2015

Do not use semicolons to terminate expressions.

@wardpenney

This comment has been minimized.

Show comment
Hide comment
@wardpenney

wardpenney May 15, 2015

Contributor

@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.

Contributor

wardpenney commented May 15, 2015

@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.

@joshuaogle

This comment has been minimized.

Show comment
Hide comment
@joshuaogle

joshuaogle May 15, 2015

Contributor

@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

Contributor

joshuaogle commented May 15, 2015

@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

@whmii

This comment has been minimized.

Show comment
Hide comment
@whmii

whmii Jul 6, 2016

Member

@joshuaogle good to merge at your discretion.

Member

whmii commented Jul 6, 2016

@joshuaogle good to merge at your discretion.

@joshuaogle joshuaogle merged commit 0bd8027 into master Jul 15, 2016

2 checks passed

ci/circleci Your tests passed on CircleCI!
Details
hound 3 violations found.

@joshuaogle joshuaogle deleted the jo-complex-omega branch Jul 15, 2016

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment