scniro/gulp-clean-css

Quotes removed from single column grid definitions

Closed this issue · 1 comments

Description

If you define a single column CSS grid using the grid property (instead of the explicit grid-template-areas/rows/columns), the quotes get removed from the the grid area names which results in invalid CSS (as far as I can tell).

The minified CSS fails to render properly in both Chrome and Firefox whereas the regular CSS renders as expected. Quotes are NOT removed when using grid-template-areas property.

gulp version: 4.0.2
gulp-clean-css version: 4.2.0

Repro

test.css

#wrapper {
    display: grid;
    grid:
        "logo" auto
        "nav" auto
        "content" 1fr
        / 1fr;
}

test.min.css

#wrapper{display:grid;grid:logo auto nav auto content 1fr/1fr}

gulpfile.js

const { src, dest, series, } = require('gulp');
const rename = require('gulp-rename');
const cleanCSS = require('gulp-clean-css');

const minifyCss = () => {
    return src('./test.css')
        .pipe(cleanCSS({ rebase: false }))
        .pipe(rename({
            suffix: '.min'
        }))
        .pipe(dest(f => f.base));
}

exports.default = series(minifyCss);

Sorry, my mistake. This should have been filed against clean-css. It's late, I'm tired.