1.0.0 • Published 7 years ago
gulp-extract-media-query v1.0.0
gulp-extract-media-query
Gulp plugin, which extracts media queries into separate files.
HOW TO USE
var gulp = require('gulp');
var extractMediaQuery = require('gulp-extract-media-query');
gulp.task('css', function() {
gulp.src('src/style.css')
.pipe(extractMediaQuery({
match: '(min-width: 768px)',
postfix: '-768'
}))
.pipe(gulp.dest('build'));
});
Source CSS sample
h1 {
font-size: 30px;
}
@media (min-width: 768px) {
h1 {
font-size: 20px;
}
}
Result CSS files
You can include them in your html:
<link rel="stylesheet" type="text/css" href="style.css" />
<link rel="stylesheet" type="text/css" href="style-768.css" media="(min-width: 768px)" />
1.0.0
7 years ago