a little style for the web interface

This commit is contained in:
Adrian Sampson 2011-08-06 23:56:40 -07:00
parent 568683af21
commit e8baeb0c07
3 changed files with 93 additions and 8 deletions

View file

@ -113,6 +113,6 @@ class WebPlugin(BeetsPlugin):
default=False, help='debug mode')
def func(lib, config, opts, args):
app.config['lib'] = lib
app.run(debug=opts.debug)
app.run(host='', debug=opts.debug)
cmd.func = func
return [cmd]

View file

@ -0,0 +1,78 @@
body {
font-family: Helvetica, Arial, sans-serif;
}
#header {
position: fixed;
left: 0;
right: 0;
top: 0;
height: 1.7em;
color: white;
/* shadowy border */
box-shadow: 0 0 20px #999;
-webkit-box-shadow: 0 0 20px #999;
-moz-box-shadow: 0 0 20px #999;
/* background gradient */
background: #0e0e0e;
background: -moz-linear-gradient(top, #6b6b6b 0%, #0e0e0e 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#6b6b6b), color-stop(100%,#0e0e0e));
background: -webkit-linear-gradient(top, #6b6b6b 0%,#0e0e0e 100%);
background: -o-linear-gradient(top, #6b6b6b 0%,#0e0e0e 100%);
background: -ms-linear-gradient(top, #6b6b6b 0%,#0e0e0e 100%);
background: linear-gradient(top, #6b6b6b 0%,#0e0e0e 100%);
}
#header h1 {
font-size: 1em;
font-weight: bold;
color: white;
margin: 0.25em;
}
#entities {
width: 17em;
position: fixed;
top: 1.7em;
left: 0;
bottom: 0;
margin: 0;
z-index: 1;
background: #dde4eb;
/* shadowy border */
box-shadow: 0 0 20px #666;
-webkit-box-shadow: 0 0 20px #666;
-moz-box-shadow: 0 0 20px #666;
}
#queryForm {
display: block;
text-align: center;
margin: 0.25em 0;
}
#query {
width: 95%;
font-size: 1em;
}
#entities ul {
width: 17em;
position: fixed;
top: 4em;
left: 0;
bottom: 0;
margin: 0;
padding: 0;
overflow-y: auto;
overflow-x: hidden;
}
#entities ul li {
list-style: none;
margin: 0 8px 8px;
padding: 0;
}

View file

@ -3,6 +3,9 @@
<head>
<title>beets</title>
<link rel="stylesheet"
href="{{ url_for('static', filename='beets.css') }}" type="text/css">
<script src="{{ url_for('static', filename='jquery.js') }}"></script>
<script src="{{ url_for('static', filename='underscore.js') }}">
</script>
@ -10,17 +13,21 @@
<script src="{{ url_for('static', filename='beets.js') }}"></script>
</head>
<body>
<h1>beets</h1>
<form id="queryForm">
<input type="search" id="query">
</form>
<ul id="results">
</ul>
<div id="header">
<h1>beets</h1>
</div>
<div id="entities">
<form id="queryForm">
<input type="search" id="query" placeholder="Query">
</form>
<ul id="results">
</ul>
</div>
<!-- Templates. -->
<script type="text/template" id="item-entry-template">
<%= artist %> - <%= title %>
<a href="/item/<%= id %>/file">download</a>
</script>
</body>
</html>