https://github.com/luckyraul/gulp-extract-media-query
Gulp plugin, which extracts media queries to a separate file
https://github.com/luckyraul/gulp-extract-media-query
css gulp media-query
Last synced: 3 months ago
JSON representation
Gulp plugin, which extracts media queries to a separate file
- Host: GitHub
- URL: https://github.com/luckyraul/gulp-extract-media-query
- Owner: luckyraul
- Created: 2017-06-23T23:13:19.000Z (almost 8 years ago)
- Default Branch: master
- Last Pushed: 2017-06-27T21:31:28.000Z (almost 8 years ago)
- Last Synced: 2025-02-09T08:17:54.794Z (3 months ago)
- Topics: css, gulp, media-query
- Language: JavaScript
- Homepage:
- Size: 1.95 KB
- Stars: 0
- Watchers: 3
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# gulp-extract-media-query
Gulp plugin, which extracts media queries into separate files.
HOW TO USE
-------
```js
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
-------
```css
h1 {
font-size: 30px;
}
@media (min-width: 768px) {
h1 {
font-size: 20px;
}
}
```
Result CSS files
-------
style.css
style-768.css
h1 {
font-size: 30px;
}
h1 {
font-size: 20px;
}
You can include them in your html:
```html
```