Skip to content

Instantly share code, notes, and snippets.

@kerotaa
Last active December 23, 2015 10:39
Show Gist options
  • Save kerotaa/6623270 to your computer and use it in GitHub Desktop.
Save kerotaa/6623270 to your computer and use it in GitHub Desktop.
@mixin linear-gradient($start, $color-stops...) {
$start: unquote($start);
$vendors-direction: null;
$directions: top left bottom right;
@if str-index($start, "top") > 0 or str-index($start, "left") > 0 or str-index($start, "bottom") > 0 or str-index($start, "right") > 0 {
$proc: ();
@for $i from 1 to 4 {
@if str-index($start, nth($directions, $i)) > 0 {
$proc: append($proc, nth($directions, if($i < 3, $i + 2, $i - 2)));
}
}
@if str-index($start, "to ") > 0 {
$vendors-direction: join((), $proc, space);
} @else {
$vendors-direction: $start;
$start: join((), $proc, space);
}
} @else if str-index($start, "deg") > 0 {
$vendors-direction: $start * (-1) + 90deg;
} @else {
@warn "A direction is invalid.";
}
background-image: -webkit-linear-gradient(unquote($vendors-direction), unquote($color-stops));
background-image: linear-gradient(unquote($start), unquote($color-stops));
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment