Menu icon Foundation
UNCSS ignore?

Hiya

When using UNCSS in a production build of F6, things mostly go okay.
However, as expected, it doesn't work well with dynamically placed or inserted element classes (usually something added by JS).

I think the toggle for opening and closing off-canvas nav might be one example.

I'm wondering if anyone has a list of which elements I can tell UNCSS to ignore in the gulpfile? Or if it would be worth including /* uncss:ignore */ comments in the appropriate places within the SCSS files?

Many thanks
Stef

uncssfoundation-sitesfoundation 6production build

Hiya

When using UNCSS in a production build of F6, things mostly go okay.
However, as expected, it doesn't work well with dynamically placed or inserted element classes (usually something added by JS).

I think the toggle for opening and closing off-canvas nav might be one example.

I'm wondering if anyone has a list of which elements I can tell UNCSS to ignore in the gulpfile? Or if it would be worth including /* uncss:ignore */ comments in the appropriate places within the SCSS files?

Many thanks
Stef

Geoff Kimball almost 3 years ago

All of our JavaScript state classes are prefixed with the word is- (e.g., .is-active, .is-open, etc.). Our UnCSS config in the Gulpfile is set to ignore any classes that start with is-, like so:

var uncss = $.if(isProduction, $.uncss({
  html: ['src/**/*.html'],
  ignore: [
    new RegExp('^meta\..*'),
    new RegExp('^\.is-.*')
  ]
}));

If you're writing your own JavaScript state classes, we recommend following the same practice.

Aadil khan 3 months ago

Such a very useful article very interesting to read this article and i really like to play the slotomania free coins facebook game and you make a high score click this link slotomania free coins facebook  and play this game i would like to thank you for the efforts you had made for writing this awesome article.

  `  

Susan Kelly 3 months ago

that is why I hate java. its so confusing :P