Issues within my PostCSS/Stylus setup

[custa1200]

I cannot get the gridlover plugin to work.

gulp.task('css', ['specs'], function () {
    return gulp.src(paths.specsSource + "_main/main.styl")
        .pipe(plumber())
        .pipe(cache('specs'))
        .pipe(stylus({
          use: [
            rupture(),
            poststylus([
                customproperties,
                gridlover,
                cssnext,
                brandcolors,
                lost,
                mqpacker,
                csswring,
                mergerules,
                nested,
                duplicates,
                bemlinter,
                reporter,
                browserreporter
            ])
          ],
          'include css': true
        }))
        .pipe(gulp.dest(function(file) {
            return file.base;
        }));
});

browser reporter always complains about not being able to attach custom properties.

If I don't make the rule on the html and just :root the plugin returns NaN for Xgr Xsx

[custa1200]

looking at the custom properties plugin it seems to want to add them to :root rather than html

[custa1200]

Can Gridlover be altered to use the convention of putting the variables on the :root rather than the html. When I try to put it on :root none of the custom vars are recognised :(

[sakamies]

There should be no limitation on where you put the variables, so yeah, putting them in :root should just work. I'll check it out and fix that. Thanks!

A bit of a sidenote and my personal preference, but I think it might also be a good idea to use sass or less style variables with PostCSS instead of native css vars, because many browsers already support native css variables and the plugin is transforming them to static css code.