Sass Sleuth Setup

http://www.mobify.com/dev/sass-sleuth-debugging-sass-in-webkit-browsers/

Great tool. Having not used Firesass previously a few things tripped me up during the setup, so I figured I'd share in case others were running into similar issues.

1.) While developing locally (localhost/XAMPP/Livereload) my config.rb looks like this:

httppath = "/"
cssdir = "stylesheets"
sassdir = "sass"
imagesdir = "images"
javascriptsdir = "javascripts"
fontsdir = "fonts/"
outputstyle = :expanded
sassoptions = {:debuginfo => true}

1. ) After adding sass_options, I exit "compass watch" in Terminal, then restart using:

compass watch --debug-info

3.) Close Chrome, open Sass Sleuth

4.) Inspect an element to verify it looks like this: http://cl.ly/image/1Z1T111d1v4... (notice the .scss extention rather than .css)

5.) Fist pump