Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

How to change colors for chart js? #247

Open
ghost opened this issue Jan 16, 2018 · 1 comment
Open

How to change colors for chart js? #247

ghost opened this issue Jan 16, 2018 · 1 comment

Comments

@ghost
Copy link

ghost commented Jan 16, 2018

I tried following the instructions on the chartist site the sass way with no luck. How can I customize the colors for chartist using sass?

Thanks,
-Will

@willpnw
Copy link

willpnw commented Jan 16, 2018

Sorry, not chart js, that's in the docs. Chartist is what I'm trying to configure.

How do I do this?
https://gionkunz.github.io/chartist-js/getting-started.html#the-sass-way

Specifically this part:

THE SASS WAY
If you like to customize your charts you can either remove the CSS fully and write your own selectors using the Chartist.js Sass mixins or you just use the Chartist.js Sass settings file to customize the look and feel of your charts.

Styling inline SVG with CSS is a breeze and you should also consider writing your own selectors for your charts and using the Sass mixins. You can read more about using the Sass mixins in the advanced section.

To customize the style of your charts using the Sass settings file you should copy the settings file to your own Sass folder.

cp bower_components/chartist/dist/scss/settings/_chartist-settings.scss styles
Then just import your copy of the settings file before you import the chartist.scss file and change the settings in your copy as desired.

@import "_my-chartist-settings.scss";
@import "chartist/dist/scss/chartist.scss";

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant