Convert from LESS to Sass preprocessor

[pdehaan]

This commit adds a /css/_tabzilla.scss file and you can do require('mozilla-tabzilla').includePaths (or require('mozilla-tabzilla').with(['path1', 'path2'])) so you can do @import 'tabzilla'; from your .scss files.

Fixes #74

[pdehaan]

Another option may be to use something like gulp-base64 to inline the 2 images into the final CSS/Sass files to remove the need to manage the /media assets.

[jpetto]

Do we want to make bourbon a dependency for a single mixin used only once?

[pdehaan]

shrug It does seem like overkill. We could just make a custom mixin to do the media query (or hard code it).

[pdehaan]

@jpetto Replaced the node-bourbon dependency with an inline retina() mixin.

[alexgibson]

Another option may be to use something like gulp-base64 to inline the 2 images into the final CSS/Sass files to remove the need to manage the /media assets.

If we did this, it would be good to make it optional perhaps. I believe some really old browsers (cough IE) may throw insecure content warnings on base64 inline images. Might not be an issue for most web sites, but this tab gets used in a lot of places.

[alexgibson]

Also not to bikeshed, but curious why the switch to Sass? I was under the impression Less was more commonly used on Mozilla sites (or Stylus).

(Fwiw, personally I do like Sass - just not as common to see it used here as other pre-processors)

[pdehaan]

@alexgibson No real reason, just that our projects use Sass and this would make it easier to integrate.
If we really want to stick w/ LESS, that's cool too, we can probably just add ~3 lines to copy "tabzilla/css/tabzilla.css" to "tabzilla/css/_tabzilla.scss" in the gulp dist task.

[pdehaan]

@alexgibson See alternate #76 PR for adding basic Sass support while sticking w/ LESS.

[pdehaan]

Re: Sass vs LESS, I saw this the other day: http://ashleynolan.co.uk/blog/frontend-tooling-survey-2015-results

Sass: 66%
LESS: 13%

[alexgibson]

Re: Sass vs LESS, I saw this the other day: http://ashleynolan.co.uk/blog/frontend-tooling-survey-2015-results

This is indeed very true in the wider web dev world. I only mentioned it here because the majority of moz sites seem to be Django/Python based.

[schalkneethling]

I am going to close this one as I prefer the solution of adding Sass [https://github.com//pull/76] instead of replacing LESS. Thanks @pdehaan