luxolus/open-consul
2
0
Fork 0
Code Issues 1 Pull requests Packages Releases Wiki Activity

ui: initial settings ui

Browse source
This commit is contained in:
Jack Pearkes 2014-08-22 12:57:38 -07:00
parent 7a40350311
commit 888e97ef50
3 changed files with 30 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

13
ui/index.html
View file

@ -102,18 +102,17 @@
<script type="text/x-handlebars" data-template-name="dc"> <script type="text/x-handlebars" data-template-name="dc">
<div class="row"> <div class="row">
<div class="col-md-12 col-sm-12 col-xs-12 topbar"> <div {{ bind-attr class=":col-md-12 :col-sm-12 :col-xs-12 :topbar hasFailingChecks:topbar-orange:topbar-green" }}>
<div class="col-md-1 col-sm-2 col-xs-8 col-sm-offset-0 col-xs-offset-1"> <div class="col-md-1 col-sm-2 col-xs-8 col-sm-offset-0 col-xs-offset-1">
<a href="#"><div class="top-brand"></div></a> <a href="#"><div class="top-brand"></div></a>
</div> </div>
<div class="col-md-2 col-sm-3 col-xs-8 col-sm-offset-0 col-xs-offset-1"> <div class="col-md-2 col-sm-3 col-xs-8 col-sm-offset-0 col-xs-offset-1">
{{#link-to 'services' (query-params status=checkStatus) tagName="div" href=false }}<a {{bind-attr class=":col-xs-12 :btn hasFailingChecks:btn-warning:btn-success"}}>Services</a>{{/link-to}} {{#link-to 'services' class='btn btn-default col-xs-12'}}Services{{/link-to}}
</div> </div>
<div class="col-md-2 col-sm-3 col-xs-8 col-sm-offset-0 col-xs-offset-1"> <div class="col-md-2 col-sm-3 col-xs-8 col-sm-offset-0 col-xs-offset-1">
{{#link-to 'nodes' (query-params status=checkStatus) tagName="div" href=false }}<a {{bind-attr class=":col-xs-12 :btn hasFailingChecks:btn-warning:btn-success"}}>Nodes</a>{{/link-to}} {{#link-to 'nodes' class='btn btn-default col-xs-12'}}Nodes{{/link-to}}
</div> </div>
<div class="col-md-2 col-sm-3 col-xs-8 col-sm-offset-0 col-xs-offset-1"> <div class="col-md-2 col-sm-3 col-xs-8 col-sm-offset-0 col-xs-offset-1">
@ -124,7 +123,7 @@
{{#link-to 'acls' class='btn btn-default col-xs-12'}}ACL{{/link-to}} {{#link-to 'acls' class='btn btn-default col-xs-12'}}ACL{{/link-to}}
</div> </div>
<div class="col-md-2 col-md-offset-1 col-sm-2 col-xs-6 col-sm-offset-0 col-xs-offset-1"> <div class="col-md-2 col-sm-2 col-xs-6 col-sm-offset-0 col-xs-offset-1">
<a {{bind-attr class=":col-xs-12 :btn isDropDownVisible:btn-primary:btn-default"}} {{action "toggle"}}> <span class="elip-overflow">{{model}} <span class="caret"></span></span> </a> <a {{bind-attr class=":col-xs-12 :btn isDropDownVisible:btn-primary:btn-default"}} {{action "toggle"}}> <span class="elip-overflow">{{model}} <span class="caret"></span></span> </a>
{{#if isDropdownVisible}} {{#if isDropdownVisible}}
@ -136,6 +135,10 @@
{{/if}} {{/if}}
</div> </div>
<div class="col-md-1 col-sm-2 col-xs-8 col-md-offset-0 col-sm-offset-2 col-xs-offset-1">
{{#link-to 'nodes' class='btn btn-default col-xs-6 icon'}}<span class="wrap">&#9881;</span>{{/link-to}}
</div>
</div> </div>
</div> </div>

8
ui/styles/_nav.scss
View file

@ -16,6 +16,14 @@
min-height: 95px; min-height: 95px;
border-bottom: 1px #eee solid; border-bottom: 1px #eee solid;
&.topbar-green {
border-top: 6px $green-faded solid;
}
&.topbar-orange {
border-top: 6px $orange-faded solid;
}
.btn { .btn {
margin-top: 20px; margin-top: 20px;
min-width: 100px; min-width: 100px;

14
ui/styles/base.scss
View file

@ -98,6 +98,20 @@ a {
background-color: $gray-background; background-color: $gray-background;
} }
.topbar {
.btn.icon {
min-width: 50px;
font-size: 30px;
height: 33px;
padding: 0;
.wrap {
position: absolute;
top: -8px;
left: 14px;
}
}
}
.action-bar { .action-bar {
min-height: 50px; min-height: 50px;
padding-top: 10px; padding-top: 10px;