Skip to content

raiseandfall/grunt-cssmyicons

Repository files navigation

CSS my icons

Build Status Downloads

Grunt plugin to generate a CSS file for SVG icons used as background-image:

.icon-home{background-image:url('icons/home.svg');background:no-repeat;}

There are also versions for Broccoli and Gulp

INSTALL

$ npm install grunt-cssmyicons

USAGE

grunt.initConfig({
  cssmyicons: {
    main: {
      src: ['assets/svg'],
      destCss: 'styles/icons.css'
    }
  }
});

OPTIONS

src

Type: Array
Required

This option is the glob of the svg folders.

destCss

Type: String
Required

Path to the CSS file to export to.

destIcons

Type: String
Optional

Folder to copy icons files.

cwd

Type: String
Default: Current working directory
Optional

Used as a working directory for CSS & icons exports.

prefixPath

Type: String
Default: null
Optional

Prefix to add at the beginning of the icons path

EXAMPLE

cssmyicons: {
    copyIcons: {
        src: ['test/fixtures/*'],
        cwd: 'tmp/copyIcons',
        destIcons: 'icons',
        destCss: 'icons.css'
    }
}

In this case the icons will be copied to tmp/copyIcons/icons, the CSS file will be generated here: tmp/copyIcons/icons.css and the base path for the background-image will be background-image:url("icons/icon.svg").

CONTRIBUTE

$ grunt
Run tests
$ grunt test

LICENSE

MIT