jab2870/Vim-Vixen
Archived
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

command-line as background page

Browse source
This commit is contained in:
Shin'ya Ueoka 2017-08-28 20:08:16 +09:00
parent e46f664363
commit a808b28940
4 changed files with 75 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

16
src/command-line/index.html Normal file
View file

@ -0,0 +1,16 @@
<!doctype html>
<html>
<head>
<meta charset=utf-8 />
<title>VimVixen command-line</title>
<script src='command-line.js'></script>
</head>
<body class='vimvixen-command-line'>
<div>
<p class='vimvixen-command-line-title'></p>
<div class='vimvixen-command-line-line'>
<i class='vimvixen-command-line-line-prompt'></i><input class='vimvixen-command-line-line-input'></input>
</div>
</div>
</body>
</html>

1
src/command-line/index.js Normal file
View file

@ -0,0 +1 @@
import './index.scss';

42
src/command-line/index.scss Normal file
View file

@ -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;
}
}
}

18
webpack.config.js
View file

@ -1,3 +1,4 @@
var HtmlWebpackPlugin = require('html-webpack-plugin');
var path = require('path'); var path = require('path');
const src = path.resolve(__dirname, 'src'); const src = path.resolve(__dirname, 'src');
@ -6,7 +7,8 @@ const dist = path.resolve(__dirname, 'build');
module.exports = { module.exports = {
entry: { entry: {
index: path.join(src, 'content'), index: path.join(src, 'content'),
background: path.join(src, 'background') background: path.join(src, 'background'),
'command-line': path.join(src, 'command-line')
}, },
output: { output: {
@ -28,10 +30,22 @@ module.exports = {
test: /\.css$/, test: /\.css$/,
loader: 'style-loader!css-loader', loader: 'style-loader!css-loader',
}, },
{
test: /\.scss$/,
loader: 'style-loader!css-loader!sass-loader?sourceMap=true'
},
] ]
}, },
resolve: { resolve: {
extensions: [ '.js' ] extensions: [ '.js' ]
} },
plugins: [
new HtmlWebpackPlugin({
template: path.join(src, 'command-line', 'index.html'),
filename: path.join(dist, 'command-line.html'),
inject: false
})
]
}; };