_radial-gradient.scss 1.4 KB

123456789101112131415161718192021222324252627282930313233343536373839
  1. // Requires Sass 3.1+
  2. @mixin radial-gradient($g1, $g2,
  3. $g3: null, $g4: null,
  4. $g5: null, $g6: null,
  5. $g7: null, $g8: null,
  6. $g9: null, $g10: null,
  7. $pos: null,
  8. $shape-size: null,
  9. $fallback: null) {
  10. $data: _radial-arg-parser($g1, $g2, $pos, $shape-size);
  11. $g1: nth($data, 1);
  12. $g2: nth($data, 2);
  13. $pos: nth($data, 3);
  14. $shape-size: nth($data, 4);
  15. $full: $g1, $g2, $g3, $g4, $g5, $g6, $g7, $g8, $g9, $g10;
  16. // Strip deprecated cover/contain for spec
  17. $shape-size-spec: _shape-size-stripper($shape-size);
  18. // Set $g1 as the default fallback color
  19. $first-color: nth($full, 1);
  20. $fallback-color: nth($first-color, 1);
  21. @if (type-of($fallback) == color) or ($fallback == "transparent") {
  22. $fallback-color: $fallback;
  23. }
  24. // Add Commas and spaces
  25. $shape-size: if($shape-size, "#{$shape-size}, ", null);
  26. $pos: if($pos, "#{$pos}, ", null);
  27. $pos-spec: if($pos, "at #{$pos}", null);
  28. $shape-size-spec: if(($shape-size-spec != " ") and ($pos == null), "#{$shape-size-spec}, ", "#{$shape-size-spec} ");
  29. background-color: $fallback-color;
  30. background-image: -webkit-radial-gradient(unquote(#{$pos}#{$shape-size}#{$full}));
  31. background-image: unquote("radial-gradient(#{$shape-size-spec}#{$pos-spec}#{$full})");
  32. }