From d5120c98d0db50e48ed0c6338a9f3c509bbb259a Mon Sep 17 00:00:00 2001 From: johnyma22 Date: Thu, 5 Apr 2012 18:22:53 +0100 Subject: [PATCH] very quick admin interface styling and sensibility --- src/static/css/admin.css | 90 ++++++++++++++++++++++ src/templates/admin/plugins.html | 128 +++++++++++++++---------------- 2 files changed, 153 insertions(+), 65 deletions(-) diff --git a/src/static/css/admin.css b/src/static/css/admin.css index 80089c4c..20946531 100644 --- a/src/static/css/admin.css +++ b/src/static/css/admin.css @@ -1,3 +1,93 @@ +body { + margin: 0; + height: 100%; + color: #333; + font: 14px helvetica, sans-serif; + background: #ddd; + background: -webkit-radial-gradient(circle,#aaa,#eee 60%) center fixed; + background: -moz-radial-gradient(circle,#aaa,#eee 60%) center fixed; + background: -ms-radial-gradient(circle,#aaa,#eee 60%) center fixed; + background: -o-radial-gradient(circle,#aaa,#eee 60%) center fixed; + border-top: 8px solid rgba(51,51,51,.8); +} +#wrapper { + border-top: 1px solid #999; + margin-top: 160px; + padding: 15px; + background: #eee; + background: -webkit-linear-gradient(#fff,#ccc); + background: -moz-linear-gradient(#fff,#ccc); + background: -ms-linear-gradient(#fff,#ccc); + background: -o-linear-gradient(#fff,#ccc); + opacity: .9; + box-shadow: 0px 1px 8px rgba(0,0,0,0.3); + max-width: 1200px; + margin: auto; +} +#inner { + width: 300px; + margin: 0 auto; +} +#button:hover { + cursor: pointer; + background: #666; + background: -webkit-linear-gradient(#707070,#666666 50%,#5B5B5B 51%,#474747); + background: -moz-linear-gradient(#707070,#666666 50%,#5B5B5B 51%,#474747); + background: -ms-linear-gradient(#707070,#666666 50%,#5B5B5B 51%,#474747); + background: -o-linear-gradient(#707070,#666666 50%,#5B5B5B 51%,#474747); +} +#button:active { + box-shadow: inset 0 1px 12px rgba(0,0,0,0.9); + background: #444; +} +#label { + text-align: left; + text-shadow: 0 1px 1px #fff; + margin: 16px auto 0; +} +form { + border: 1px solid #bbb; + border-radius: 3px; + position: relative; +} +button, input { + font-weight: bold; + font-size: 15px; +} +input[type="button"] { + height:30px; +} +input[type="text"] { + border-radius: 3px; + box-sizing: border-box; + -moz-box-sizing: border-box; + padding: 10px 45px 10px 10px; + *padding: 0; /* IE7 hack */ + width: 100%; + outline: none; + border: none; +} +button{ + display:block; +} +@media only screen and (min-device-width: 320px) and (max-device-width: 720px) { + body { + background: #bbb; + background: -webkit-linear-gradient(#aaa,#eee 60%) center fixed; + background: -moz-linear-gradient(#aaa,#eee 60%) center fixed; + background: -ms-linear-gradient(#aaa,#eee 60%) center fixed; + } + #wrapper { + margin-top: 0; + } + #inner { + width: 95%; + } + #label { + text-align: center; + } +} + table { border-collapse: collapse; } diff --git a/src/templates/admin/plugins.html b/src/templates/admin/plugins.html index 5e5a1b03..6f38d048 100644 --- a/src/templates/admin/plugins.html +++ b/src/templates/admin/plugins.html @@ -19,7 +19,7 @@ if ($("#search-query")[0].value != "") socket.emit("search", $("#search-query")[0].value); }); - + $(".do-install").unbind('click').click(function (e) { var row = $(e.target).closest("tr"); doUpdate = true; @@ -95,74 +95,72 @@ - <% if (errors.length) { %> -
- <% errors.forEach(function (item) { %> -
<%= item.toString() %>
- <% }) %> -
- <% } %> +
+ + <% if (errors.length) { %> +
+ <% errors.forEach(function (item) { %> +
<%= item.toString() %>
+ <% }) %> +
+ <% } %> -

Installed plugins

- - - - - - - - - - - - - - - - - -
NameDescription
- -
+

Installed plugins

+ + + + + + + + + + + + + + + + + +
NameDescription
+ +
+ +

Search for plugins to install

+
+ + +
+ + + + + + + + + + + + + + + + + +
NameDescription
+ +
- - -

Search for plugins to install

-
- - -
- - - - - - - - - - - - - - - - - -
NameDescription
- -
- - -
-

- Please wait: +
+

+ Please wait: -

- -
+

+
+
-