Bootstrap material fullpalette

Question

I would like to add the fullpalette of bootstrap material design in my Angular application.

When I'm doing "grunt build" this file material-fullpalette.min.css isn't working in the dist (I added it manually in my index.html).

How can I do it correctly so that I'll be able to use all the colors of the css file?

Answer 1

For adding the material-fullpalette.min.css, you need to do make change in the following file

Location: bower_components\bootstrap-material-design\bower.json

For adding only material-fullpalette.min.css, just do following change

"main": [
    "dist/css/material.css",
    "dist/js/material.js",
    "dist/css/ripples.css",
    "dist/js/ripples.js",
    "dist/css/material-fullpalette.css"
  ],

For adding other files, you need to do following

"main": [
    "dist/css/material.css",
    "dist/js/material.js",
    "dist/css/ripples.css",
    "dist/js/ripples.js",
    "dist/css/material-fullpalette.css",
    "dist/css/roboto.css",
    "dist/fonts/Material-Design-Icons.eot",
    "dist/fonts/Material-Design-Icons.svg",
    "dist/fonts/Material-Design-Icons.ttf",
    "dist/fonts/Material-Design-Icons.woff",
    "dist/fonts/RobotoDraftBold.woff",
    "dist/fonts/RobotoDraftBold.woff2",
    "dist/fonts/RobotoDraftItalic.woff",
    "dist/fonts/RobotoDraftItalic.woff2",
    "dist/fonts/RobotoDraftRegular.woff",
    "dist/fonts/RobotoDraftRegular.woff2"
  ],

Then if you run grunt, it will be automatically included in the main package.