How to get started with Compass/Sass on Mac – Invalid CSS error?

Question

I am trying to get started with Compass/Sass on my Mac. After running sudo gem install compass, I have set up a project with a single main.scss file and I use compass watch to have the file automatically compiled to CSS.

main.scss looks like this:

@import "compass/css3/border-radius"

div .blah .baz {
  @include border-radius(4px, 4px);
  font-weight: bold; 
}

Seems like nothing complicated, right? Well, every time I save the file, I get an error like this:

>>> Change detected to: /Users/mikl/Sites/ddk7/profiles/blaahval/themes/kaskelot/./scss/main.scss
    error ./scss/main.scss (Line 3: Invalid CSS after ".../border-radius"": expected selector or at-rule, was "$blue: #3bbfce;")
overwrite ./css/main.css

Is there something wrong with my SCSS syntax, or just compass just have very poor error messages?

Answer 1

As @jnpcl said, a semi-colon would be good. However, if that was the issue it should throw an error directly related to that.

This seems like a stretch, but did you copy and paste that line? Perhaps there is character weirdness happening?