uncss: Bootstrap dropdown error after uncss

Someone report a bug on grunt-uncss repository. https://github.com/addyosmani/grunt-uncss/issues/86

I’ve got the same issue on gulp-uncss. I think it’s a uncss bug :

There is an issue when using uncss with bootstraps collapse element on the navigation. I try to add the following ignore list without any success :

ignore: [
            // needed for Bootstrap's transitions
            ".fade",
            ".fade.in",
            ".collapse",
            ".collapse.in",
            ".collapsing",
            ".alert-danger"
        ],

does anyone has a fix to make my dropdown menu in my navbar working ?

here a jsbin with bootstrap uncss stylesheet: http://jsbin.com/bunoy/1/ http://jsbin.com/bunoy/1/edit/

About this issue

  • Original URL
  • State: closed
  • Created 10 years ago
  • Comments: 15 (3 by maintainers)

Most upvoted comments

having had this issue today I have found that this is the best mix:

          ignore: [/\w\.in/,
                    ".fade",
                    ".collapse",
                    ".collapsing",
                    /(#|\.)navbar(\-[a-zA-Z]+)?/,
                    /(#|\.)dropdown(\-[a-zA-Z]+)?/,
                    /(#|\.)(open)/,
                    ".modal",
                    ".modal.fade.in",
                    ".modal-dialog",
                    ".modal-document",
                    ".modal-scrollbar-measure",
                    ".modal-backdrop.fade",
                    ".modal-backdrop.in",
                    ".modal.fade.modal-dialog",
                    ".modal.in.modal-dialog",
                    ".modal-open",
                    ".in",
                    ".modal-backdrop"]

You shouldn’t delimit RegExps with quotes. If you pass:

{
            html: ['uncss/uncss.html'],
            ignore: [
                ".fade",
                ".fade.in",
                ".collapse",
                ".collapse.in",
                ".collapsing",
                ".alert-danger",
                /\.open/
           ]
}

That will match the .open class, and any selector that happens to use it.