diegonetto / generator-ionic

Build hybrid mobile apps using the Ionic Framework
MIT License
1.74k stars 336 forks source link

Customize SCSS #98

Open izifortune opened 10 years ago

izifortune commented 10 years ago

Hello, i was reading this article http://ionicframework.com/tutorials/customizing-ionic-with-sass/ about customizing ionic with sass but the generator include the css version of ionic styles.

How about including the ionic.scss into the styles of the app so we can customize the application? I can make a PR since i got this working for me using wiredep.

Interested?

jansent commented 10 years ago

I'm definitely interested in that. I'd like to be able to remove or customize parts of the ionic base that way.

izifortune commented 10 years ago

Ok i'll try to submit a PR asap

diegonetto commented 10 years ago

@izifortune I was planning on adding this next to the generator. I am curious how you utilized wiredep for this task. I was testing a modification to the Gruntfile that used the copy task to accomplish this goal.

As always, PR's are most welcome :)

izifortune commented 10 years ago

At the moment i'm stuck trying to run grunt wiredep on the end event. Seems it doesn't wan't to run. If you know how to run a grunt command the pr is ready. Otherwise i shall use wiredep inside yeoman for that job https://github.com/taptapship/wiredep/blob/master/readme.md

Floriangomis commented 10 years ago

Any news on this ?

izifortune commented 9 years ago

Sorry for late reply. I got this thing working. There's a PR #118

kuriakin-zeng commented 9 years ago

@izifortune Hi Fabrizio, I'm new with SCSS and Grunt, so I'm not quite sure what I'm doing. I have a few lines of code in main.scss to change the default colors, such as $light, $positive as demonstrated in http://learn.ionicframework.com/formulas/working-with-sass/ but the generator-ionic doesn't compile the main.scss into main.css. What is the correct way to change the default ionic styles? Thanks!

izifortune commented 9 years ago

Hi @kuriakin-zeng, actually the PR isn't merged yet so that's why your changes on the scss doesn't reflects. If you are interested in this the ionic-cli got this feature out of the box now. ( you have to drop the generator though )

kuriakin-zeng commented 9 years ago

@izifortune Thanks for your prompt response. Interesting, because main.scss is included by default, so I thought the feature would have been included. Do you mean that I should generate the css first and then manually copy it to the www?

izifortune commented 9 years ago

The problem is that the the generator doesn't import the ionic.scss but the css so you can't change the colors vars. Either you import the ionic.scss inside yours or start a new project with the ionic-cli ( instead of the generator ) and you get that part already done.

kuriakin-zeng commented 9 years ago

Do you mean doing something like this: @import "bower_components//ionic/scss/ionic";

Robinyo commented 9 years ago

Followed @asgeo1 and @jimthedev's advice:

antony-k1208 commented 9 years ago

I followed this great article but its still not working as expected..

Somewhere it is still injectig "bower_components/ionic/release/css/ionic.css" into my index.html. And other the other hand im getting generated css files in .temp/styles, but none of these gets copied to my www/styles folder, there is only a vendor.css file..

Any help is appreciated.