SASS support (for building ionic css)

[richardgsands]

Hi Urigo! Thanks for the awesome meteor-angular and meteor-ionic packages you've been working on!

One thing that would be great to do is support building a custom CSS file using the Sass version of Ionic CSS in meteor-ionic. This would be really powerful, as you could then override default Ionic SASS variables in one place to customise the theme of your app, without needing to target multiple ionic classes.

When just using Ionic, it is achieved like this:

myapp.scss

// override default ionic variables
$font-size-base:                  10px !default;
$font-size-large:                 14px !default;
$font-size-small:                 11px !default;
$base-color:                      white !default;

$positive:                        #990099 !default;

// import ionic sass (any variables defined above will override the default ionic settings)
@import "www/lib/ionic/scss/ionic";

// import app css partials
@import 'layout';
@import 'brand';

Then we compile to a css file (myapp.css) using gulp or similar. In index.html, we include myapp.css (rather than the prebuilt css file in www/lib/ionic/...).

I would definitely be happy to do this and contribute, but would appreciate a bit of guidance to get me started! Would you be able to help me out please?

Many thanks, Richard.

[rossmartin]

+1 thank you this will be very handy if implemented.

[rossmartin]

@Urigo Is this possible using the official driftyco:ionic package? If it isn't currently do you know what is required to make this work?

Thank you.

[Urigo]

You should use the official driftyco:ionic. that's to pull request I've done to Ionic and you should use that.. About support for SASS - Here is how the package is implemented today: https://github.com/driftyco/ionic/blob/master/package.js You can try to change that or create a new package for that specific use case

[rossmartin]

@Urigo Thanks I'll look into implementing this soon. I'll reply back if I have success.

[lance-anderson]

I'm curious to hear how it goes for you @rossmartin. I was looking for this as well and will be looping back to implement it soon.