add grunt sass theme task
This commit is contained in:
parent
2abf6678fa
commit
6a0ce3c5e9
3 changed files with 26 additions and 27 deletions
23
Gruntfile.js
23
Gruntfile.js
|
@ -42,6 +42,19 @@ module.exports = function(grunt) {
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
|
sass: {
|
||||||
|
main: {
|
||||||
|
files: {
|
||||||
|
'css/theme/default.css': 'css/theme/source/default.scss',
|
||||||
|
'css/theme/beige.css': 'css/theme/source/beige.scss',
|
||||||
|
'css/theme/night.css': 'css/theme/source/night.scss',
|
||||||
|
'css/theme/serif.css': 'css/theme/source/serif.scss',
|
||||||
|
'css/theme/simple.css': 'css/theme/source/simple.scss',
|
||||||
|
'css/theme/sky.css': 'css/theme/source/sky.scss'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
|
||||||
jshint: {
|
jshint: {
|
||||||
options: {
|
options: {
|
||||||
curly: false,
|
curly: false,
|
||||||
|
@ -64,8 +77,14 @@ module.exports = function(grunt) {
|
||||||
},
|
},
|
||||||
|
|
||||||
watch: {
|
watch: {
|
||||||
|
main: {
|
||||||
files: [ 'Gruntfile.js', 'js/reveal.js', 'css/reveal.css' ],
|
files: [ 'Gruntfile.js', 'js/reveal.js', 'css/reveal.css' ],
|
||||||
tasks: 'default'
|
tasks: 'default'
|
||||||
|
},
|
||||||
|
theme: {
|
||||||
|
files: [ 'css/theme/source/*.scss', 'css/theme/template/*.scss' ],
|
||||||
|
tasks: 'themes'
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
});
|
});
|
||||||
|
@ -75,8 +94,12 @@ module.exports = function(grunt) {
|
||||||
grunt.loadNpmTasks( 'grunt-contrib-cssmin' );
|
grunt.loadNpmTasks( 'grunt-contrib-cssmin' );
|
||||||
grunt.loadNpmTasks( 'grunt-contrib-uglify' );
|
grunt.loadNpmTasks( 'grunt-contrib-uglify' );
|
||||||
grunt.loadNpmTasks( 'grunt-contrib-watch' );
|
grunt.loadNpmTasks( 'grunt-contrib-watch' );
|
||||||
|
grunt.loadNpmTasks( 'grunt-contrib-sass' );
|
||||||
|
|
||||||
// Default task
|
// Default task
|
||||||
grunt.registerTask( 'default', [ 'jshint', 'cssmin', 'uglify' ] );
|
grunt.registerTask( 'default', [ 'jshint', 'cssmin', 'uglify' ] );
|
||||||
|
|
||||||
|
// Theme task
|
||||||
|
grunt.registerTask( 'themes', [ 'sass' ] );
|
||||||
|
|
||||||
};
|
};
|
||||||
|
|
|
@ -1,25 +0,0 @@
|
||||||
## Dependencies
|
|
||||||
|
|
||||||
Themes are written using Sass to keep things modular and reduce the need for repeated selectors across files. Find out how to install Sass here http://sass-lang.com/, once Sass is installed run the follwing command to start monitoring the source files for changes.
|
|
||||||
|
|
||||||
```
|
|
||||||
sass --watch css/theme/source/:css/theme --style expanded
|
|
||||||
```
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
## Creating a Theme
|
|
||||||
|
|
||||||
To create your own theme, start by duplicating any ```.scss``` file in [/css/theme/source](https://github.com/hakimel/reveal.js/blob/master/css/theme/source). Each theme does four things in the following order:
|
|
||||||
|
|
||||||
1. **Include [/css/theme/template/mixins.scss](https://github.com/hakimel/reveal.js/blob/master/css/theme/template/mixins.scss)**
|
|
||||||
Shared utility functions.
|
|
||||||
|
|
||||||
2. **Include [/css/theme/template/settings.scss](https://github.com/hakimel/reveal.js/blob/master/css/theme/template/settings.scss)**
|
|
||||||
Declares a set of custom variables that the template file (step 4) expects. Can be overridden in step 3.
|
|
||||||
|
|
||||||
3. **Override**
|
|
||||||
This is where you override the default theme. Either by specifying variables (see [settings.scss](https://github.com/hakimel/reveal.js/blob/master/css/theme/template/settings.scss) for reference) or by adding full selectors with hardcoded styles.
|
|
||||||
|
|
||||||
4. **Include [/css/theme/template/theme.scss](https://github.com/hakimel/reveal.js/blob/master/css/theme/template/theme.scss)**
|
|
||||||
The template theme file which will generate final CSS output based on the currently defined variables.
|
|
|
@ -29,6 +29,7 @@
|
||||||
"grunt-contrib-cssmin": "~0.4.1",
|
"grunt-contrib-cssmin": "~0.4.1",
|
||||||
"grunt-contrib-uglify": "~0.1.1",
|
"grunt-contrib-uglify": "~0.1.1",
|
||||||
"grunt-contrib-watch": "~0.2.0",
|
"grunt-contrib-watch": "~0.2.0",
|
||||||
|
"grunt-contrib-sass": "~0.2.2",
|
||||||
"grunt": "~0.4.0"
|
"grunt": "~0.4.0"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue