mirror of https://github.com/status-im/consul.git
ui: initial settings ui
This commit is contained in:
parent
e970ea8ddf
commit
f581c94b39
|
@ -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">⚙</span>{{/link-to}}
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
|
@ -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;
|
||||||
|
|
|
@ -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;
|
||||||
|
|
Loading…
Reference in New Issue