You can create a variable outside the loop to “collect” the shadow values, and then use that variable in your text-shadow property. Example: =stacktextshadow($shadows…) $all: () @for $i from 1 through length($shadows) $all: append($all, append($i*1px $i*1px 0, nth($shadows, $i)), comma) text-shadow: $all h1 +stacktextshadow(blue, red, green) Output: h1 { text-shadow: 1px 1px 0 blue, 2px … Read more
The dependencies are incompatible: susy 2.0.0 depends on sass ~> 3.3.0 whereas compass 0.12.3 depends on sass = 3.2.14. The error message says the same: Unable to activate susy-2.0.0, because sass-3.2.14 conflicts with sass (~> 3.3.0) You can a) downgrade susy to a version that’s working with sass 3.2.14 or b) upgrade compass to a … Read more
Starting from SASS 3.1 you can pass named arguments to do that: @include linear-gradient($from: #7a7a7a, $to: #1a1a1a, $ie-filters: true); The rest will be default.
You want to use multiplication to apply a unit, rather than concatenation: @mixin latLong ($lat, $long) { left: (($long + 180) * (930/360)) * 1%; top: (($lat + 90) * (530/180)) * 1%; }
The problem is that darken function requires a color as first argument and, instead, you’re trying to pass a string. type-of(#6B46C1); // returns color type-of(“#6B46C1”); // returns string So you should remove all quotes in $innerPagesBgColors: $innerPagesBgColors: #6B46C1, #2980B9, #FD5456, #000;
You need to use interpolation (eg. #{$var}) on your variable in order for Sass to treat it as a CSS property. Without it, you’re just performing variable assignment. @mixin w_fluid($property_name, $w_element, $w_parent:16) { #{$property_name}: percentage(($w_element / $w_parent)); }
Sass cannot perform arithmetic on values that cannot be converted from one unit to the next. Sass has no way of knowing exactly how wide “100%” is in terms of pixels or any other unit. That’s something only the browser knows. You need to use calc() instead. Check browser compatibility on Can I use… .foo … Read more
No. What you’re asking for would require Sass to have knowledge of the DOM. Sass only compiles directly to CSS, it is never sent to the browser. With your sample code, all you’re doing is overwriting $basicFont every time. In version 3.4 or later, your variable will only exist within the scope of the block … Read more
As Kumar points out, this has been possible since Sass 3.3.0.rc.1 (Maptastic Maple). The @at-root directive causes one or more rules to be emitted at the root of the document, rather than being nested beneath their parent selectors. We can combine the @at-root directive along with interpolation #{} to arrive at the intended outcome. SASS … Read more
Sass cannot perform arithemetic operations on strings, only concatenation. When you use interpolation, what you’ve created is a string that looks like a number: @debug type-of(#{10px}); // string @debug type-of(’10px’); // string @debug type-of(unquote(’10px’)); // string @debug type-of(10px); // number If you want a number, do not use interpolation and do not use quotes. For … Read more