commit eab2e7d77659741e2a3d4b4b58c178d5e3447325 Author: Marcos Moura Date: Fri Jun 17 20:32:39 2016 -0300 Initial setup diff --git a/.babelrc b/.babelrc new file mode 100644 index 0000000..c71d366 --- /dev/null +++ b/.babelrc @@ -0,0 +1,4 @@ +{ + "plugins": ["transform-runtime"], + "presets": ["es2015", "stage-0"] +} diff --git a/.editorconfig b/.editorconfig new file mode 100644 index 0000000..e717f5e --- /dev/null +++ b/.editorconfig @@ -0,0 +1,13 @@ +# http://editorconfig.org +root = true + +[*] +indent_style = space +indent_size = 2 +end_of_line = lf +charset = utf-8 +trim_trailing_whitespace = true +insert_final_newline = true + +[*.md] +trim_trailing_whitespace = false diff --git a/.eslintrc b/.eslintrc new file mode 100644 index 0000000..a25514c --- /dev/null +++ b/.eslintrc @@ -0,0 +1,189 @@ +{ + "ecmaFeatures": { + "arrowFunctions": true, + "classes": true, + "generators": true, + "modules": true, + "superInFunctions": true + }, + "env": { + "browser": true, + "amd": true, + "es6": true, + "node": true + }, + "globals": { + "arguments": true, + "window": true, + "gapi": true, + "angular": true + }, + "parser": "babel-eslint", + "rules": { + "arrow-parens": 2, + "arrow-spacing": [ + 2, + { + "before": true, + "after": true + } + ], + "brace-style": [ + 2, + "1tbs", + { + "allowSingleLine": false + } + ], + "comma-dangle": [ + 1, + "never" + ], + "comma-spacing": [ + 1, + { + "before": false, + "after": true + } + ], + "comma-style": [ + 2, + "last" + ], + "consistent-this": [ + 2, + "self" + ], + "constructor-super": 2, + "curly": 2, + "default-case": 2, + "dot-location": [ + 2, + "property" + ], + "eol-last": 2, + "eqeqeq": [ + 2, + "smart" + ], + "indent": [ + 2, + 2, + { + "SwitchCase": 1 + } + ], + "key-spacing": [ + 1, + { + "beforeColon": false, + "afterColon": true + } + ], + "max-nested-callbacks": [ + 1, + 4 + ], + "new-cap": 1, + "new-parens": 1, + "newline-after-var": [ + 2, + "always" + ], + "no-array-constructor": 2, + "no-class-assign": 2, + "no-cond-assign": 2, + "no-const-assign": 2, + "no-constant-condition": 2, + "no-delete-var": 2, + "no-dupe-args": 2, + "no-dupe-class-members": 2, + "no-dupe-keys": 2, + "no-duplicate-case": 2, + "no-else-return": 1, + "no-empty": 2, + "no-eq-null": 2, + "no-eval": 2, + "no-ex-assign": 2, + "no-extend-native": 2, + "no-extra-boolean-cast": 2, + "no-extra-parens": 1, + "no-extra-semi": 2, + "no-floating-decimal": 2, + "no-func-assign": 2, + "no-implied-eval": 2, + "no-inner-declarations": 2, + "no-lonely-if": 2, + "no-loop-func": 2, + "no-mixed-spaces-and-tabs": 2, + "no-multi-spaces": 1, + "no-multi-str": 2, + "no-multiple-empty-lines": [ + 1, + { + "max": 2 + } + ], + "no-negated-in-lhs": 2, + "no-nested-ternary": 2, + "no-new": 2, + "no-new-func": 2, + "no-new-object": 2, + "no-new-wrappers": 2, + "no-obj-calls": 2, + "no-redeclare": 2, + "no-script-url": 2, + "no-self-compare": 2, + "no-spaced-func": 1, + "no-sparse-arrays": 2, + "no-this-before-super": 2, + "no-trailing-spaces": 1, + "no-undef": 2, + "no-undef-init": 2, + "no-underscore-dangle": 2, + "no-unexpected-multiline": 2, + "no-unneeded-ternary": 2, + "no-unreachable": 2, + "no-unused-vars": 1, + "no-use-before-define": 1, + "one-var": [ + 2, + "never" + ], + "quote-props": [ + 1, + "as-needed" + ], + "quotes": [ + 2, + "single" + ], + "radix": 2, + "semi": [ + 2, + "always" + ], + "semi-spacing": [ + 1, + { + "before": false, + "after": true + } + ], + "keyword-spacing": 2, + "space-before-blocks": 2, + "space-before-function-paren": [ + 2, + "never" + ], + "space-infix-ops": 2, + "space-unary-ops": 2, + "strict": 0, + "use-isnan": 2, + "wrap-regex": 2, + "yoda": [ + 2, + "never" + ] + } +} diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..6122bb3 --- /dev/null +++ b/.gitignore @@ -0,0 +1,3 @@ +node_modules +.tmp +dest diff --git a/README.md b/README.md new file mode 100644 index 0000000..cf62053 --- /dev/null +++ b/README.md @@ -0,0 +1,9 @@ +# Vue.js Material + +## Introduction + +## Still in development + +## License + +MIT diff --git a/gulpfile.babel.js/config.js b/gulpfile.babel.js/config.js new file mode 100644 index 0000000..fbcd07e --- /dev/null +++ b/gulpfile.babel.js/config.js @@ -0,0 +1,32 @@ +import path from 'path'; + +let gulp = { + path: 'gulp', + scripts: [path.normalize('gulpfile.babel.js/**/*.js')] +}; + +let src = { + path: 'src', + assets: path.normalize('src/assets'), + files: path.normalize('src/**/*.{txt,xml,html,json,jpg,png,gif,svg,ico}'), + images: path.normalize('src/**/*.{jpg,png,gif,svg}'), + imagesFolder: path.normalize('src/assets/images'), + html: path.normalize('src/**/*.html'), + scripts: path.normalize('src/assets/scripts/**/*.js'), + stylesheet: path.normalize('src/assets/**/core.scss'), + stylesheets: path.normalize('src/assets/**/*.scss') +}; + +let dest = { + path: 'dest', + scripts: path.normalize('dest/assets/scripts/**/*.js'), + images: path.normalize('dest/**/*.{jpg,png,gif,svg}'), + imagesFolder: path.normalize('dest/assets/images'), + stylesheets: path.normalize('dest/assets') +}; + +export default { + gulp, + src, + dest +}; diff --git a/gulpfile.babel.js/index.js b/gulpfile.babel.js/index.js new file mode 100644 index 0000000..78cbfd1 --- /dev/null +++ b/gulpfile.babel.js/index.js @@ -0,0 +1,36 @@ +import runSequence from 'run-sequence'; +import gulp from 'gulp'; +import './tasks/clean'; +import './tasks/copy'; +import './tasks/browserify'; +import './tasks/sass'; +import './tasks/eslint'; +import './tasks/watch'; +import './tasks/uglify'; +import './tasks/report'; + +gulp.task('default', () => { + runSequence( + 'clean', + [ + 'browserify', + 'eslint-all', + 'sass', + 'copy' + ], + 'watch' + ); +}); + +gulp.task('build', () => { + runSequence( + 'clean', + [ + 'copy', + 'browserify-build', + 'sass-build' + ], + 'uglify', + 'report' + ); +}); diff --git a/gulpfile.babel.js/tasks/browser-sync.js b/gulpfile.babel.js/tasks/browser-sync.js new file mode 100644 index 0000000..e5cb9bc --- /dev/null +++ b/gulpfile.babel.js/tasks/browser-sync.js @@ -0,0 +1,32 @@ +import _browsersync from 'browser-sync'; +import gulp from 'gulp'; +import config from '../config'; + +let browserSync = _browsersync.create(); + +gulp.task('browserSync', () => { + browserSync.init({ + notify: false, + logLevel: 'silent', + logSnippet: false, + port: 9000, + ghostMode: { + clicks: true, + scroll: true, + links: true, + forms: true + }, + server: { + baseDir: [config.dest.path] + }, + ui: { + port: 9001, + weinre: { + port: 9002 + } + }, + watchTask: true + }); +}); + +export default browserSync; diff --git a/gulpfile.babel.js/tasks/browserify.js b/gulpfile.babel.js/tasks/browserify.js new file mode 100644 index 0000000..379435a --- /dev/null +++ b/gulpfile.babel.js/tasks/browserify.js @@ -0,0 +1,90 @@ +import gulp from 'gulp'; +import util from 'gulp-util'; +import uglify from 'gulp-uglify'; +import path from 'path'; +import watchify from 'watchify'; +import babelify from 'babelify'; +import envify from 'envify/custom'; +import vueify from 'vueify'; +import xtend from 'xtend'; +import prettyTime from 'pretty-hrtime'; +import browserify from 'browserify'; +import uglifyify from 'uglifyify'; +import source from 'vinyl-source-stream'; +import buffer from 'vinyl-buffer'; +import config from '../config'; +import browserSync from './browser-sync'; + +let app = 'main.js'; +let entry = path.normalize(config.src.path + '/assets/scripts/' + app); + +gulp.task('browserify', () => { + let b = watchify(browserify(xtend(watchify.args, { + debug: true, + watch: true, + fast: true, + fullPaths: true, + keepAlive: true, + detectGlobals: false, + ignoreWatch: true, + noparse: ['node_modules/**/*.js'], + entries: entry, + transform: [ + envify({ + NODE_ENV: 'development' + }), + vueify, + babelify.configure() + ] + }))); + + let bundle = () => { + let bundleTimer = process.hrtime(); + + return b.bundle() + .on('error', (error) => { + let dirname = path.join(__dirname, '..', '..', 'src') + '/'; + + if (error.fileName) { + util.log(util.colors.red(error.name) + + ': ' + util.colors.yellow(error.fileName.replace(dirname, '')) + + ': ' + 'Line ' + util.colors.magenta(error.lineNumber) + + ' & ' + 'Column ' + util.colors.magenta(error.columnNumber || error.column) + + ': ' + util.colors.blue(error.description)); + } else { + util.log(util.colors.red(error.name) + ': ' + util.colors.yellow(error.message.replace(dirname, ''))); + } + }) + .pipe(source(app)) + .pipe(buffer()) + .pipe(gulp.dest(path.normalize(config.dest.path + '/assets/scripts'))) + .pipe(browserSync.stream()) + .on('finish', () => { + util.log('Browserify', util.colors.cyan(app), 'after', util.colors.magenta(prettyTime(process.hrtime(bundleTimer)))); + }); + }; + + b.on('update', bundle); + + return bundle(); +}); + +gulp.task('browserify-build', () => { + let bundleTimer = process.hrtime(); + + return browserify(entry) + .transform(envify({ + NODE_ENV: 'development' + })) + .transform(vueify) + .transform(babelify.configure()) + .transform(uglifyify) + .bundle() + .pipe(source(app)) + .pipe(buffer()) + .pipe(uglify()) + .pipe(gulp.dest(path.normalize(config.dest.path + '/assets/scripts'))) + .on('finish', () => { + util.log('Browserify', util.colors.cyan(app), 'after', util.colors.magenta(prettyTime(process.hrtime(bundleTimer)))); + }); +}); diff --git a/gulpfile.babel.js/tasks/clean.js b/gulpfile.babel.js/tasks/clean.js new file mode 100644 index 0000000..bc72b7f --- /dev/null +++ b/gulpfile.babel.js/tasks/clean.js @@ -0,0 +1,7 @@ +import gulp from 'gulp'; +import del from 'del'; +import config from '../config'; + +gulp.task('clean', () => { + return del([config.dest.path]); +}); diff --git a/gulpfile.babel.js/tasks/copy.js b/gulpfile.babel.js/tasks/copy.js new file mode 100644 index 0000000..8aed4d7 --- /dev/null +++ b/gulpfile.babel.js/tasks/copy.js @@ -0,0 +1,10 @@ +import gulp from 'gulp'; +import changed from 'gulp-changed'; +import config from '../config'; + +gulp.task('copy', () => { + return gulp + .src(config.src.files) + .pipe(changed(config.dest.path)) + .pipe(gulp.dest(config.dest.path)); +}); diff --git a/gulpfile.babel.js/tasks/eslint.js b/gulpfile.babel.js/tasks/eslint.js new file mode 100644 index 0000000..0f44bb4 --- /dev/null +++ b/gulpfile.babel.js/tasks/eslint.js @@ -0,0 +1,27 @@ +import gulp from 'gulp'; +import eslint from 'gulp-eslint'; +import changed from 'gulp-changed-in-place'; +import config from '../config'; + +gulp.task('eslint-all', () => { + return gulp + .src(config.gulp.scripts.concat(config.src.scripts)) + .pipe(eslint()) + .pipe(eslint.format()); +}); + +gulp.task('eslint-gulp', () => { + return gulp + .src(config.gulp.scripts) + .pipe(changed()) + .pipe(eslint()) + .pipe(eslint.format()); +}); + +gulp.task('eslint', () => { + return gulp + .src(config.src.scripts) + .pipe(changed()) + .pipe(eslint()) + .pipe(eslint.format()); +}); diff --git a/gulpfile.babel.js/tasks/report.js b/gulpfile.babel.js/tasks/report.js new file mode 100644 index 0000000..4501c66 --- /dev/null +++ b/gulpfile.babel.js/tasks/report.js @@ -0,0 +1,12 @@ +import gulp from 'gulp'; +import path from 'path'; +import size from 'gulp-size'; +import config from '../config'; + +gulp.task('report', () => { + return gulp + .src(path.normalize(config.dest.path + '/**/*')) + .pipe(size({ + title: 'Size of' + })); +}); diff --git a/gulpfile.babel.js/tasks/sass.js b/gulpfile.babel.js/tasks/sass.js new file mode 100644 index 0000000..4270abc --- /dev/null +++ b/gulpfile.babel.js/tasks/sass.js @@ -0,0 +1,43 @@ +import gulp from 'gulp'; +import sass from 'gulp-sass'; +import cssImport from 'gulp-import-css'; +import moduleImporter from 'sass-module-importer'; +import sourcemaps from 'gulp-sourcemaps'; +import cssnano from 'gulp-cssnano'; +import autoprefixer from 'gulp-autoprefixer'; +import browserSync from './browser-sync'; +import config from '../config'; + +gulp.task('sass', () => { + return gulp + .src(config.src.stylesheet) + .pipe(sourcemaps.init()) + .pipe( + sass({ + importer: moduleImporter(), + outputStyle: 'expanded' + }).on('error', sass.logError) + ) + .pipe(cssImport()) + .pipe(sourcemaps.write()) + .pipe(gulp.dest(config.dest.stylesheets)) + .pipe(browserSync.stream()); +}); + +gulp.task('sass-build', () => { + return gulp + .src(config.src.stylesheet) + .pipe( + sass({ + importer: moduleImporter() + }).on('error', sass.logError) + ) + .pipe(cssImport()) + .pipe(autoprefixer({ + browsers: ['last 2 versions'], + flexbox: 'no-2009', + cascade: false + })) + .pipe(cssnano({ discardComments: {removeAll: true} })) + .pipe(gulp.dest(config.dest.stylesheets)); +}); diff --git a/gulpfile.babel.js/tasks/uglify.js b/gulpfile.babel.js/tasks/uglify.js new file mode 100644 index 0000000..6ec3eac --- /dev/null +++ b/gulpfile.babel.js/tasks/uglify.js @@ -0,0 +1,10 @@ +import gulp from 'gulp'; +import path from 'path'; +import uglify from 'gulp-uglify'; +import config from '../config'; + +gulp.task('uglify', () => { + return gulp.src(path.normalize(config.dest.path + '/assets/scripts/main.js')) + .pipe(uglify()) + .pipe(gulp.dest(path.normalize(config.dest.path + '/assets/scripts'))); +}); diff --git a/gulpfile.babel.js/tasks/watch.js b/gulpfile.babel.js/tasks/watch.js new file mode 100644 index 0000000..654f206 --- /dev/null +++ b/gulpfile.babel.js/tasks/watch.js @@ -0,0 +1,31 @@ +import gulp from 'gulp'; +import watch from 'gulp-watch'; +import runSequence from 'run-sequence'; +import config from '../config'; +import browserSync from './browser-sync'; + +let watchConfig = { + verbose: true +}; + +gulp.task('watch', ['browserSync'], () => { + watch(['.eslintrc', '.eslintignore'], watchConfig, () => { + runSequence('eslint-all'); + }); + + watch(config.gulp.scripts, watchConfig, () => { + runSequence('eslint-gulp'); + }); + + watch(config.src.scripts, watchConfig, () => { + runSequence('eslint'); + }); + + watch(config.src.stylesheets, watchConfig, () => { + runSequence('sass'); + }); + + watch(config.src.files, watchConfig, () => { + runSequence('copy', browserSync.reload); + }); +}); diff --git a/package.json b/package.json new file mode 100644 index 0000000..6af3a99 --- /dev/null +++ b/package.json @@ -0,0 +1,56 @@ +{ + "projectName": "Vue.js Material", + "name": "vuejs-material", + "description": "Material Design for Vue.js", + "developers": "Marcos Moura", + "version": "0.0.0", + "repository": { + "type": "git", + "url": "https://github.com/marcosmoura/vue-material.git" + }, + "authors": [ + "Marcos Moura " + ], + "devDependencies": { + "babel": "^6.5.2", + "babel-core": "^6.7.4", + "babel-eslint": "^6.0.4", + "babel-plugin-transform-runtime": "^6.6.0", + "babel-preset-es2015": "^6.6.0", + "babel-preset-stage-0": "^6.5.0", + "babel-runtime": "^6.6.1", + "babelify": "^7.2.0", + "browser-sync": "^2.11.2", + "browserify": "^13.0.0", + "del": "^2.2.0", + "envify": "^3.4.0", + "gulp": "^3.9.1", + "gulp-autoprefixer": "^3.1.0", + "gulp-babel": "^6.1.2", + "gulp-changed": "^1.3.0", + "gulp-changed-in-place": "^2.0.3", + "gulp-cssnano": "^2.1.1", + "gulp-eslint": "^2.0.0", + "gulp-imagemin": "^3.0.1", + "gulp-import-css": "^0.1.2", + "gulp-sass": "^2.2.0", + "gulp-size": "^2.1.0", + "gulp-sourcemaps": "^1.6.0", + "gulp-uglify": "^1.5.3", + "gulp-util": "^3.0.7", + "gulp-watch": "^4.3.5", + "pretty-hrtime": "^1.0.2", + "run-sequence": "^1.1.5", + "sass-module-importer": "^1.2.0", + "stringify": "^5.1.0", + "uglifyify": "^3.0.1", + "vinyl-buffer": "^1.0.0", + "vinyl-source-stream": "^1.1.0", + "vueify": "^8.5.4", + "watchify": "^3.7.0", + "xtend": "^4.0.1" + }, + "dependencies": { + "vue": "^1.0.25" + } +} diff --git a/src/assets/scripts/main.js b/src/assets/scripts/main.js new file mode 100644 index 0000000..8fea6fb --- /dev/null +++ b/src/assets/scripts/main.js @@ -0,0 +1 @@ +import Vue from 'vue'; diff --git a/src/assets/stylesheets/core.scss b/src/assets/stylesheets/core.scss new file mode 100644 index 0000000..ef87b01 --- /dev/null +++ b/src/assets/stylesheets/core.scss @@ -0,0 +1,15 @@ +/* Common mixins */ +@import 'utils/mixins'; + + +/* Commons */ +@import 'utils/commons'; + + +/* Variables */ +@import 'variables'; + + +/* Core Styles */ +@import 'structure'; +@import 'type'; diff --git a/src/assets/stylesheets/structure.scss b/src/assets/stylesheets/structure.scss new file mode 100644 index 0000000..e69de29 diff --git a/src/assets/stylesheets/type.scss b/src/assets/stylesheets/type.scss new file mode 100644 index 0000000..e69de29 diff --git a/src/assets/stylesheets/utils/commons.scss b/src/assets/stylesheets/utils/commons.scss new file mode 100644 index 0000000..aa9b80b --- /dev/null +++ b/src/assets/stylesheets/utils/commons.scss @@ -0,0 +1,96 @@ +/* Apply the border-box box model to HTML and inheriting + to all children elements + ========================================================================== */ + +html { + box-sizing: border-box; + + *, + *:before, + *:after { + box-sizing: inherit; + } +} + + + +/* Always hide an element when it has the `hidden` HTML attribute. + ========================================================================== */ + +[hidden] { + display: none !important; +} + + + +/* Fluid Media + ========================================================================== */ + +audio, +img, +svg, +object, +embed, +canvas, +video, +iframe { + max-width: 100%; + height: auto; + font-style: italic; + vertical-align: middle; +} + + + +/* Remove figure extra margin + ========================================================================== */ + +figure { + margin-right: auto; + margin-left: auto; + + > img { + display: block; + } +} + + + +/* Remove outline from button + ========================================================================== */ + +button:focus { + outline: none; +} + + + +/* Suppress the focus outline on links that cannot be accessed via keyboard. + This prevents an unwanted focus outline from appearing around elements + that might still respond to pointer events. + ========================================================================== */ + +[tabindex="-1"]:focus { + outline: none !important; +} + + + +/* Remove extra vertical spacing when nesting lists + ========================================================================== */ + +li { + > ul, + > ol { + margin-bottom: 0; + } +} + + + +/* Remove spacing between table cells + ========================================================================== */ + +table { + empty-cells: show; +} diff --git a/src/assets/stylesheets/utils/mixins.scss b/src/assets/stylesheets/utils/mixins.scss new file mode 100644 index 0000000..e69de29 diff --git a/src/assets/stylesheets/variables.scss b/src/assets/stylesheets/variables.scss new file mode 100644 index 0000000..e69de29 diff --git a/src/index.html b/src/index.html new file mode 100644 index 0000000..709e1bd --- /dev/null +++ b/src/index.html @@ -0,0 +1,26 @@ + + + + + + + + + + + + + + + Vue.js Material + + + + + + + + + + +