diff --git a/build/gulpfile.js b/build/gulpfile.js new file mode 100644 index 00000000..ea6db0b9 --- /dev/null +++ b/build/gulpfile.js @@ -0,0 +1,20 @@ +const path = require('path'); +const gulp = require('gulp'); +const concat = require('gulp-concat'); + +const prismScripts = [ + 'prismjs/components/prism-core', + 'prismjs/components/prism-markup', + 'prismjs/components/prism-clike', + 'prismjs/components/prism-c', + 'prismjs/components/prism-javascript', + 'prismjs/components/prism-css', + 'prismjs/components/prism-ruby', +].map(require.resolve); +prismScripts.push( + path.join(path.dirname(require.resolve('prismjs/components/prism-core')), 'prism-!(*.min).js')); + +gulp.task('build-prism', () => gulp.src(prismScripts) + .pipe(concat('prism.js')) + .pipe(gulp.dest(path.dirname(require.resolve('prismjs')))) +); diff --git a/package.json b/package.json index 62e1073b..5d291ae9 100644 --- a/package.json +++ b/package.json @@ -5,7 +5,7 @@ "author": "", "private": true, "scripts": { - "dev": "node build/dev-server.js", + "postinstall": "gulp --cwd build build-prism", "start": "node build/dev-server.js", "build": "node build/build.js", "lint": "eslint --ext .js,.vue src" @@ -54,6 +54,8 @@ "extract-text-webpack-plugin": "^2.0.0", "file-loader": "^0.11.1", "friendly-errors-webpack-plugin": "^1.1.3", + "gulp": "^3.9.1", + "gulp-concat": "^2.6.1", "html-webpack-plugin": "^2.28.0", "http-proxy-middleware": "^0.17.3", "node-sass": "^4.5.3", diff --git a/src/components/App.vue b/src/components/App.vue index 04508ff8..242f2b73 100644 --- a/src/components/App.vue +++ b/src/components/App.vue @@ -45,4 +45,63 @@ body { fill: currentColor; } } + +button, +input, +select, +textarea { + font-family: inherit; + font-size: inherit; + line-height: inherit; +} + +.text-input { + display: block; + width: 100%; + height: 36px; + padding: 3px 12px; + font-size: 22px; + line-height: 1.5; + color: inherit; + background-color: #fff; + background-image: none; + border: 0; + border-radius: $border-radius-base; +} + +.button { + color: #333; + background-color: transparent; + display: inline-block; + height: 36px; + padding: 3px 12px; + margin-bottom: 0; + font-size: 22px; + font-weight: 400; + line-height: 1.4; + overflow: hidden; + text-align: center; + white-space: nowrap; + vertical-align: middle; + -ms-touch-action: manipulation; + touch-action: manipulation; + cursor: pointer; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + background-image: none; + border: 0; + border-radius: $border-radius-base; + + &:focus { + color: #333; + background-color: transparent; + + &:active, + & { + outline: 0; + } + } +} diff --git a/src/components/ButtonBar.vue b/src/components/ButtonBar.vue index cfb6ef6a..113e5784 100644 --- a/src/components/ButtonBar.vue +++ b/src/components/ButtonBar.vue @@ -1,10 +1,5 @@