53b539d2fc
This makes button use a more standard UX pattern. Change-Id: I8cac9f4653f6fcce0e0d4a08e815d3b1f1eaedae
72 lines
1.6 KiB
HTML
72 lines
1.6 KiB
HTML
{% load static %}
|
|
|
|
<style>
|
|
.chicklet-container {
|
|
border: 1px solid #F1F1F1;
|
|
color:black;
|
|
font-weight: bold;
|
|
background-color: white;
|
|
padding: 14px 35px 14px 14px;
|
|
margin-bottom: 18px;
|
|
border-radius: 4px;
|
|
}
|
|
.base-chicklet {
|
|
border: 3px solid;
|
|
color: #7C7C7C;
|
|
background-color: white;
|
|
display:inline-block;
|
|
padding:0px;
|
|
text-shadow: 0 1px 0 rgba(255,255,255,.5);
|
|
border-radius: 4px;
|
|
}
|
|
.chicklet-success {
|
|
border-color: #36A32C;
|
|
}
|
|
.chicklet-notfound {
|
|
border-color: #e5e5e5;
|
|
}
|
|
.chicklet-unknown {
|
|
border-color: #626262;
|
|
}
|
|
.chicklet-error {
|
|
border-color: #9E1213;
|
|
}
|
|
.chicklet-warning {
|
|
border-color: #D6C037;
|
|
}
|
|
.status-icon-holder {
|
|
background-color: #EDEEF0;
|
|
float: left;
|
|
padding-top:10px;
|
|
padding-left: 6px;
|
|
padding-right: 2px;
|
|
padding-bottom: 10px;
|
|
border-right:2px solid;
|
|
border-color: #D8D7DD;
|
|
}
|
|
.service-text {
|
|
float: right;
|
|
margin: 10px;
|
|
min-width: 60px;
|
|
}
|
|
</style>
|
|
<div style="border: 1px solid #dddddd;">
|
|
<div ng-controller = "monitoringController"
|
|
ng-init="fetchStatus('{% get_static_prefix %}')">
|
|
<div class="chicklet-container" ng-repeat="group in _serviceModel">
|
|
<div>
|
|
{$ group.name $}
|
|
</div>
|
|
<div ng-repeat="service in group.services" style="display:inline-block; margin-bottom:4px; margin-right:4px;">
|
|
<a href="{% url 'horizon:monitoring:alarms:index' %}alarm/{$ service.name $}">
|
|
<div class="btn {$ service.class $}">
|
|
<div class="fa {$ service.icon $}"> </div>
|
|
{$ service.display $}
|
|
</div>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|