discourse/discourse — pull request #2125 by vikhyat (2014-03-14 20:20:51+00:00)
Title: Allow importing Discourse styles in custom stylesheets to modify vars

This isn't ready to merge but I figured I'd make a pull request to get some feedback on this.

Basically to allow importing the default Discourse stylesheets and override variables in them inside of custom stylesheets the following changes are necessary:

* Make the core Discourse styles plain SCSS -- this means moving plugin styles into a separate stylesheet (since those needed ERB) and switching the sprockets `//= require` directives to SCSS `@import`s.
* Changing the custom stylesheet compilation process to go through the asset pipeline instead of just calling `Sass.compile`. Right now this is only needed because the chosen plugin CSS uses `asset-path` but in general I think it is a good idea to follow the same process for compiling Discourse and custom stylesheets if we are going to allow importing Discourse styles into custom stylesheets.

With this in it would be possible to create a custom stylesheet that looks like this:

```scss
$base-font-family: serif;
@import "desktop";
```

One downside of this approach is that as I understand it SCSS `@import`s are slower than `//= require` so this would make stylesheet compilation slower (I haven't measured this, should probably do that). OTOH it would also make switching stylesheet compilation to use libsass in the future easier. Once this is in we can add a simpler UI for modifying variables that will create a custom stylesheet behind the scenes, but this would be the first step.

If this approach is okay the following will need to be done before this is ready to merge in:

* Add tests for this functionality.
* Make sure custom stylesheets are recompiled if they include Discourse styles and the underlying Discourse styles are modified.

Also @awesomerobot -- I noticed that a lot of variables like `$nav-pills-color-active` aren't even mentioned anywhere outside of the `variables.scss` file, I'm guessing the process of switching over to the variables is still in progress?