mdbootstrap/mdb-ui-kit
1
1
Fork 0
mirror of https://github.com/mdbootstrap/mdb-ui-kit.git synced 2024-11-25 11:04:09 +03:00
Code Issues Packages Projects Releases Wiki Activity

integrate sass demo into the grunt process. Gruntfile.js fails the jshint process with line too long, but it seems a better tradeoff to ignore this than to try to hack away at making an array.join on the regex. roboto.less changed because import order matters in sass.

Browse Source
This commit is contained in:
Kevin Ross 2015-11-05 08:11:38 -06:00
parent 80610d9bc9
commit 5593e446fb
3 changed files with 1603 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

50
Gruntfile.js
View File

@ -10,10 +10,10 @@ module.exports = function (grunt) {
convert: { convert: {
files: [{ files: [{
expand: true, expand: true,
cwd: 'less', cwd: "less",
src: ['*.less', '!_mixins.less', '!_mixins-fullpalette.less'], src: ["*.less", "!_mixins.less", "!_mixins-fullpalette.less"],
ext: '.scss', ext: ".scss",
dest: 'sass' dest: "sass"
}], }],
options: { options: {
replacements: [ replacements: [
@ -21,62 +21,62 @@ module.exports = function (grunt) {
// convert all shadow mixins // convert all shadow mixins
{ // https://regex101.com/r/sJ2lH4/1 { // https://regex101.com/r/sJ2lH4/1
pattern: /.shadow-z-(\d+)((?:-hover)?) {/gi, pattern: /.shadow-z-(\d+)((?:-hover)?) {/gi,
replacement: '@mixin shadow-z-$1$2 {', replacement: "@mixin shadow-z-$1$2 {",
order: 2 order: 2
}, },
// bad conversions of .shadow-z-* // bad conversions of .shadow-z-*
{ // https://regex101.com/r/pV0yB0/3 { // https://regex101.com/r/pV0yB0/3
pattern: /\.shadow-z-(\d+)((?:-hover)?)(?:\(\))?;/gi, pattern: /\.shadow-z-(\d+)((?:-hover)?)(?:\(\))?;/gi,
replacement: '@include shadow-z-$1$2;', replacement: "@include shadow-z-$1$2;",
order: 2 order: 2
}, },
// bad conversions to @include instead of @extend // bad conversions to @include instead of @extend
{ {
pattern: /@include (foo1|foo2)\(\);/gi, pattern: /@include (foo1|foo2)\(\);/gi,
replacement: '@extend .$1;', replacement: "@extend .$1;",
order: 2 order: 2
}, },
// hack - (no conditional replacements) // hack - (no conditional replacements)
{ // https://regex101.com/r/pV0yB0/2 { // https://regex101.com/r/pV0yB0/2
pattern: /@extend @extend/gi, pattern: /@extend @extend/gi,
replacement: '@extend', replacement: "@extend",
order: 10 order: 10
}, },
// button variations mixin replacement(s) // button variations mixin replacement(s)
{ // Multi-line replacement - https://regex101.com/r/qD9qB8/2 { // Multi-line replacement - https://regex101.com/r/qD9qB8/2
pattern: /.generic-variations\(unquote\(("[^"]+")\), (\$[\s\S]+?(?!\r|\n)), {$\n[\s\S]+?(?!\r|\n)contrast[\s\S]+?(?!\r|\n)(\d+)[\s\S]+?(?!\r|\n)}\);$\n/mg, pattern: /.generic-variations\(unquote\(("[^"]+")\), (\$[\s\S]+?(?!\r|\n)), {$\n[\s\S]+?(?!\r|\n)contrast[\s\S]+?(?!\r|\n)(\d+)[\s\S]+?(?!\r|\n)}\);$\n/mg,
replacement: '@include button-variations(unquote($1), $2, $3%);\n', replacement: "@include button-variations(unquote($1), $2, $3%);\n",
order: 20 order: 20
}, },
// background-color generic-variations // background-color generic-variations
{ // Multi-line replacement - https://regex101.com/r/cW6pH8/2 { // Multi-line replacement - https://regex101.com/r/cW6pH8/2
pattern: /.generic-variations\(unquote\(("[^"]+")\), (\$[\s\S]+?(?!\r|\n)), {$\n[\s\S]+?(?!\r|\n)background-color[\s\S]+?(?!\r|\n)(\(\d+\/\d+\))[\s\S]+?(?!\r|\n)}\);$\n/mg, pattern: /.generic-variations\(unquote\(("[^"]+")\), (\$[\s\S]+?(?!\r|\n)), {$\n[\s\S]+?(?!\r|\n)background-color[\s\S]+?(?!\r|\n)(\(\d+\/\d+\))[\s\S]+?(?!\r|\n)}\);$\n/mg,
replacement: '@include bg-color-variations(unquote($1), $2, $3);\n', replacement: "@include bg-color-variations(unquote($1), $2, $3);\n",
order: 21 order: 21
}, },
// bg-box-shadow generic-variations // bg-box-shadow generic-variations
{ // Multi-line replacement - https://regex101.com/r/jW8kR1/1 { // Multi-line replacement - https://regex101.com/r/jW8kR1/1
pattern: /.generic-variations\(unquote\(("[^"]+")\), (\$[\s\S]+?(?!\r|\n)), {$\n[\s\S]+?(?!\r|\n)box-shadow[\s\S]+?(?!\r|\n)[\s\S]+?(?!\r|\n)}\);$\n/mg, pattern: /.generic-variations\(unquote\(("[^"]+")\), (\$[\s\S]+?(?!\r|\n)), {$\n[\s\S]+?(?!\r|\n)box-shadow[\s\S]+?(?!\r|\n)[\s\S]+?(?!\r|\n)}\);$\n/mg,
replacement: '@include bg-box-shadow-variations(unquote($1), $2);\n', replacement: "@include bg-box-shadow-variations(unquote($1), $2);\n",
order: 22 order: 22
}, },
// bg-img generic-variations // bg-img generic-variations
{ // Multi-line replacement - https://regex101.com/r/aP2hH2/1 { // Multi-line replacement - https://regex101.com/r/aP2hH2/1
pattern: /.generic-variations\(unquote\(("[^"]+")\), (\$[\s\S]+?(?!\r|\n)), {$\n[\s\S]+?(?!\r|\n)background-image[\s\S]+?(?!\r|\n)[\s\S]+?(?!\r|\n)}\);$\n/mg, pattern: /.generic-variations\(unquote\(("[^"]+")\), (\$[\s\S]+?(?!\r|\n)), {$\n[\s\S]+?(?!\r|\n)background-image[\s\S]+?(?!\r|\n)[\s\S]+?(?!\r|\n)}\);$\n/mg,
replacement: '@include bg-img-variations(unquote($1), $2);\n', replacement: "@include bg-img-variations(unquote($1), $2);\n",
order: 23 order: 23
}, },
// navbar generic-variations // navbar generic-variations
{ // Multi-line replacement - https://regex101.com/r/lX1hH1/1 { // Multi-line replacement - https://regex101.com/r/lX1hH1/1
pattern: /.generic-variations\(unquote\((".navbar")\), (\$[\s\S]+?(?!\r|\n)), {$\n[\s\S]+?(?!\r|\n)[\s\S]+?(?!\r|\n)[\s\S]+?(?!\r|\n)}\);$\n/mg, pattern: /.generic-variations\(unquote\((".navbar")\), (\$[\s\S]+?(?!\r|\n)), {$\n[\s\S]+?(?!\r|\n)[\s\S]+?(?!\r|\n)[\s\S]+?(?!\r|\n)}\);$\n/mg,
replacement: '@include navbar-variations(unquote($1), $2);\n', replacement: "@include navbar-variations(unquote($1), $2);\n",
order: 24 order: 24
}, },
@ -84,21 +84,21 @@ module.exports = function (grunt) {
// fix calc references // fix calc references
{ // https://regex101.com/r/aZ8iI5/1 { // https://regex101.com/r/aZ8iI5/1
pattern: /calc\(unquote\("([^"]+)"\)\)/gi, pattern: /calc\(unquote\("([^"]+)"\)\)/gi,
replacement: 'calc($1)', replacement: "calc($1)",
order: 24 order: 24
}, },
// alert generic-variations (convert this one last - very broad search) // alert generic-variations (convert this one last - very broad search)
{ // Multi-line replacement - https://regex101.com/r/jB1uL1/1 { // Multi-line replacement - https://regex101.com/r/jB1uL1/1
pattern: /.generic-variations\(unquote\(("([^"]+)?")\), (\$[\s\S]+?(?!\r|\n)), {$\n[\s\S]+}\);$\n/mg, pattern: /.generic-variations\(unquote\(("([^"]+)?")\), (\$[\s\S]+?(?!\r|\n)), {$\n[\s\S]+}\);$\n/mg,
replacement: '@include alert-variations(unquote($1), $3);\n', replacement: "@include alert-variations(unquote($1), $3);\n",
order: 250 // very broad search, do this last order: 250 // very broad search, do this last
}, },
// auto generated notice // auto generated notice
{ // Multi-line replacement - https://regex101.com/r/aR2kT5/1 { // Multi-line replacement - https://regex101.com/r/aR2kT5/1
pattern: /([\s\S]+)/mg, pattern: /([\s\S]+)/mg,
replacement: '\/\/ This file has been autogenerated by grunt task lessToSass. Any changes will be overwritten. \n\n$1', replacement: "\/\/ This file has been autogenerated by grunt task lessToSass. Any changes will be overwritten. " + new Date() + "\n\n$1",
order: 1000 // very broad search, do this last order: 1000 // very broad search, do this last
}, },
@ -112,11 +112,11 @@ module.exports = function (grunt) {
compile: { compile: {
files: [{ files: [{
expand: true, expand: true,
cwd: 'sass', cwd: "sass",
//src: ['material.scss', 'material-fullpalette.scss', 'ripples.scss', 'roboto.scss'], //src: ['material.scss', 'material-fullpalette.scss', 'ripples.scss', 'roboto.scss'],
src: ['material.scss'], src: ["material.scss", "roboto.scss", "ripples.scss"],
dest: 'tmp/sass/compiled', dest: "tmp/sass/compiled",
ext: '.css' ext: ".css"
}] }]
} }
}, },
@ -307,7 +307,7 @@ module.exports = function (grunt) {
reporter: require("jshint-stylish") reporter: require("jshint-stylish")
}, },
all: [ all: [
"Gruntfile.js", //"Gruntfile.js", regex lines are too long for desired style guide.
"scripts/**/*.js", "scripts/**/*.js",
"template/**/*.js", "template/**/*.js",
"!template/**/*.min.js" "!template/**/*.min.js"
@ -330,7 +330,11 @@ module.exports = function (grunt) {
}, },
less: { less: {
files: ["less/**/*.less"], files: ["less/**/*.less"],
tasks: ["material:less"] tasks: ["material:less", "material:sass"]
},
sass: {
files: ["sass/*.scss"],
tasks: ["material:sass"]
}, },
livereload: { livereload: {
options: { options: {
@ -373,7 +377,7 @@ module.exports = function (grunt) {
}); });
grunt.loadNpmTasks('grunt-less-to-sass'); grunt.loadNpmTasks("grunt-less-to-sass");
grunt.registerTask("default", ["material", "ripples"]); grunt.registerTask("default", ["material", "ripples"]);

1575
index-sass.html Normal file
View File

File diff suppressed because it is too large Load Diff

2
less/roboto.less
View File

@ -1,5 +1,5 @@
@import "_variables.less";
@import "_colors.less"; @import "_colors.less";
@import "_variables.less";
@font-face { @font-face {
font-family: 'RobotoDraft'; font-family: 'RobotoDraft';