Skip to content

Instantly share code, notes, and snippets.

@lunelson
Last active October 1, 2015 08:30
Show Gist options
  • Save lunelson/6b16be65f85152b43a86 to your computer and use it in GitHub Desktop.
Save lunelson/6b16be65f85152b43a86 to your computer and use it in GitHub Desktop.
Generated by SassMeister.com.
// ----
// Sass (v3.4.14)
// Compass (v1.0.3)
// ----
@function slice($list, $start: 1, $end: length($list), $sep: list-separator($list)) {
$output: ();
@if $start >= 1 and $end >= $start {
@for $i from $start through $end {
$output: append($output, nth($list, $i), $sep);
}
}
@return $output;
}
@function last-sels() {
$sel: &; $out: ();
@each $list in $sel {
$curr: nth($list, length($list));
@if not index($out, $curr) {
$out: append($out, $curr, 'comma');
}
}
@return $out;
}
@function initial-sels() {
$sel: &; $out: ();
@each $list in $sel {
$curr: slice($list, 1, length($list) - 1);
@if not index($out, $curr) {
$out: append($out, $curr, 'comma');
}
}
@return $out;
}
// a more fault-tolerant nth() function. libsass throws more errors for nth
@function _nth($list, $n) {
@if length($list) == 0 or $n < 1 or $n > length($list) { @return null; }
@return nth($list, $n);
}
@function sibling-to($siblings, $op: '~'){
$initials: initial-sels();
$lasts: last-sels();
$out: '';
@for $i from 1 through length($initials) {
@for $s from 1 through length($siblings) {
@for $l from 1 through length($lasts) {
$out: if(
($i $s $l) == (1 1 1),
unquote('#{_nth($initials, $i)} #{_nth($siblings, $s)} #{$op} #{_nth($lasts, $l)}'),
$out + unquote(', #{_nth($initials, $i)} #{_nth($siblings, $s)} #{$op} #{_nth($lasts, $l)}')
);
}
}
}
@return $out;
}
@mixin sibling-to($args...) {
@at-root #{sibling-to($args...)} {
@content;
}
}
.test .nest, .other .nest {
p {
// debug selectors
initial-selectors: inspect(initial-sels());
last-selectors: inspect(last-sels());
// build sibling selector
@include sibling-to(h1 h2, '+') {
color: blue;
}
}
}
.test .nest p, .other .nest p {
initial-selectors: .test .nest, .other .nest;
last-selectors: (p,);
}
.test .nest h1 + p, .test .nest h2 + p, .other .nest h1 + p, .other .nest h2 + p {
color: blue;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment