Sandbox a CSS library by prefixing its selectors
CoffeeScript
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
tasks
test
.gitignore
.nvmrc
Gruntfile.coffee
README.md
package.json

README.md

grunt-sandbox-css Built with Grunt

Codeship Status for radekstepan/grunt-sandbox-css

Say you are loading a Foundation/Bootstrap library for a widet and don't want them affecting the rest of the page. This Grunt plugin will prefix all selectors in input CSS file with your custom one.

Quick start

Example Gruntfile.coffee:

module.exports = (grunt) ->
    grunt.initConfig
        pkg: grunt.file.readJSON "package.json"

        sandbox_css:
            foundation:
                files:
                  'build/foundation.sandboxed.css': 'src/foundation.css'
                options:
                    # E.g.: .row -> .foundation .row
                    prefix: '.foundation'
                    # Selectors where we do not prefix.
                    blacklist: [ 'html', 'body' ]

    grunt.loadNpmTasks('grunt-sandbox-css')

    grunt.registerTask('default', [ 'sandbox_css' ])