From a808b2894090f30e65f396f7caa5af36af83442c Mon Sep 17 00:00:00 2001 From: Shin'ya Ueoka Date: Mon, 28 Aug 2017 20:08:16 +0900 Subject: command-line as background page --- src/command-line/index.html | 16 ++++++++++++++++ src/command-line/index.js | 1 + src/command-line/index.scss | 42 ++++++++++++++++++++++++++++++++++++++++++ webpack.config.js | 18 ++++++++++++++++-- 4 files changed, 75 insertions(+), 2 deletions(-) create mode 100644 src/command-line/index.html create mode 100644 src/command-line/index.js create mode 100644 src/command-line/index.scss diff --git a/src/command-line/index.html b/src/command-line/index.html new file mode 100644 index 0000000..e9e4123 --- /dev/null +++ b/src/command-line/index.html @@ -0,0 +1,16 @@ + + + + + VimVixen command-line + + + +
+

+
+ +
+
+ + diff --git a/src/command-line/index.js b/src/command-line/index.js new file mode 100644 index 0000000..67aac61 --- /dev/null +++ b/src/command-line/index.js @@ -0,0 +1 @@ +import './index.scss'; diff --git a/src/command-line/index.scss b/src/command-line/index.scss new file mode 100644 index 0000000..2256bf2 --- /dev/null +++ b/src/command-line/index.scss @@ -0,0 +1,42 @@ +html, body, * { + margin: 0; + padding: 0; +} + +.vimvixen-command-line { + border-top: 1px solid gray; + bottom: 0; + margin: 0; + padding: 0; + + &-title { + background-color: lightgray; + font-weight: bold; + margin: 0; + padding: 0; + } + + &-line { + background-color: white; + display: flex; + + @mixin input-style { + font-style: normal; + font-family: monospace; + font-size: 12px; + } + + &-prompt:before { + content: ':'; + + @include input-style; + } + + &-input { + border: none; + flex-grow: 1; + + @include input-style; + } + } +} diff --git a/webpack.config.js b/webpack.config.js index 1c80236..5019366 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -1,3 +1,4 @@ +var HtmlWebpackPlugin = require('html-webpack-plugin'); var path = require('path'); const src = path.resolve(__dirname, 'src'); @@ -6,7 +7,8 @@ const dist = path.resolve(__dirname, 'build'); module.exports = { entry: { index: path.join(src, 'content'), - background: path.join(src, 'background') + background: path.join(src, 'background'), + 'command-line': path.join(src, 'command-line') }, output: { @@ -28,10 +30,22 @@ module.exports = { test: /\.css$/, loader: 'style-loader!css-loader', }, + { + test: /\.scss$/, + loader: 'style-loader!css-loader!sass-loader?sourceMap=true' + }, ] }, resolve: { extensions: [ '.js' ] - } + }, + + plugins: [ + new HtmlWebpackPlugin({ + template: path.join(src, 'command-line', 'index.html'), + filename: path.join(dist, 'command-line.html'), + inject: false + }) + ] }; -- cgit v1.2.3