1

I've written a stylesheet with Sass/Compass with these mixins:

$buttonbackground: #50bfec
$darkerbackground: darken($buttonbackground, 30%)
$lighterbackground: lighten($buttonbackground, 20%)    

+background-image(linear-gradient(#6b8e23, white))
+single-text-shadow    
+box-shadow($lighterbackground 0 0 25px, $darkerbackground 0 0 3px 1px inset)

// all copied from examples

Instead of producing code on the lines of this (from the manual)

-webkit-box-shadow: rgba(0, 0, 255, 0.4) 0 0 25px, rgba(0, 128, 0, 0.2) 0 0 3px 1px inset;
-moz-box-shadow: rgba(0, 0, 255, 0.4) 0 0 25px, rgba(0, 128, 0, 0.2) 0 0 3px 1px inset;
box-shadow: rgba(0, 0, 255, 0.4) 0 0 25px, rgba(0, 128, 0, 0.2) 0 0 3px 1px inset

it produces stuff like this

-webkit-box-shadow: compact(#ace1f6 0 0 25px, #106d93 0 0 3px 1px inset, false, false, false, false, false, false, false, false);
-moz-box-shadow: compact(#ace1f6 0 0 25px, #106d93 0 0 3px 1px inset, false, false, false, false, false, false, false, false);
box-shadow: compact(#ace1f6 0 0 25px, #106d93 0 0 3px 1px inset, false, false, false, false, false, false, false, false);

which doesn't work. Code with these strange compact functions (which don't appear to be in Sass or the CSS3 spec) and excessive falses appear for my +linear-gradient and +single-text-shadow mixins. (I don't use SCSS)

What is happening and how can I make it output correct and working code? FYI I use a workaround outlined here to make Compass work in WebStorm (my IDE), and I use a Mac.

Community
  • 1
  • 1
TheUberEpic
  • 59
  • 8
  • 1
    `compact()` is a Compass function written in Ruby and is invoked by many of the css3 functions (see [the box-shadow source](https://github.com/chriseppstein/compass/blob/stable/frameworks/compass/stylesheets/compass/css3/_box-shadow.scss)). An undefined function will be written as is in the compiled CSS, which is what's happening here. – cimmanon Aug 21 '13 at 13:33
  • @cimmanon OK. So how can I make it output working code? – TheUberEpic Aug 21 '13 at 13:36
  • I'm afraid I can't help you any farther than this, I use Compass via command line. You'll have to find a way to get WebStorm to find the missing function(s). – cimmanon Aug 21 '13 at 13:45

1 Answers1

2

It turns out that because of compact() being a Ruby method I needed to use the compass command (not sass).

TheUberEpic
  • 59
  • 8