Search code examples
angularjstwitter-bootstrapbootstrap-material-design

Bootstrap material fullpalette

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?

bower css

Solution

  • 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.