RepoMirrors
/
alertmanager
mirror of https://github.com/prometheus/alertmanager
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Make collapsible detail sections more visible

This commit is contained in:
Fabian Reinartz 2015-11-10 14:55:57 +01:00
parent ede4b63a91
commit f1a6f8892f
3 changed files with 30 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
ui/app/css/main.css
View File

@ -48,10 +48,19 @@ header #logo {
margin-bottom: 5px;
}
.silence .labels, .alert-item .labels {
.alert-item .expand, .silence-item .expand {
float: left;
font-size: 160%;
cursor: pointer;
width: 30px;
font-weight: 100;
padding-right: 12px;
padding-left: 4px;
}
.silence .labels, .alert-item .labels {
.silence-item .labels, .alert-item .labels {
}
.silence-item .labels, .alert-item .labels {
width: 65%;
}
@ -61,10 +70,10 @@ header #logo {
padding: .8em;
}
.silence .delete-button, .alert-item .silence-button {
.silence-item .delete-button, .alert-item .silence-button {
opacity: 0.2;
}
.silence:hover .delete-button, .alert-item:hover .silence-button {
.silence-item:hover .delete-button, .alert-item:hover .silence-button {
opacity: 1.0;
}
@ -76,14 +85,14 @@ header #logo {
background: #f0f0f0;
padding: .8em;
}
.silence .overview {
.silence-item .overview {
background: #bfbfbf;
padding: .8em;
}
.silence.highlight .overview {
.silence-item.highlight .overview {
background: #dfdfdf;
}
.silence .detail, .alert-item .detail {
.silence-item .detail, .alert-item .detail {
background: #fff;
padding: .8em;
}
@ -138,8 +147,11 @@ header #logo {
}
.muted-lbl {
background: #FFCC00;
color: #555;
background: #ffe47a;
color: #555 !important;
}
.muted-lbl a {
color: #555 !important;
}
.annotations {

5
ui/app/partials/alert.html
View File

@ -1,6 +1,9 @@
<div class="alert-item" ng-controller="AlertCtrl">
<div class="overview group">
<div class="labels left" ng-click="toggleDetails()">
<div class="expand" ng-show="showDetails" ng-click="toggleDetails()">–</div>
<div class="expand" ng-hide="showDetails" ng-click="toggleDetails()">+</div>
<div class="labels left">
<span ng-repeat="(name, value) in alert.labels | orderBy:name">
<span ng-hide="group[name]" class="lbl {{ name == 'alertname' ? 'lbl-highlight' : 'lbl-outline' }}">
{{ name }} = '{{ value }}'

7
ui/app/partials/silence.html
View File

@ -1,6 +1,9 @@
<div class="silence {{ highlight ? 'highlight' : ''}}" ng-controller="SilenceCtrl">
<div class="silence-item {{ highlight ? 'highlight' : ''}}" ng-controller="SilenceCtrl">
<div class="overview group">
<div class="labels left" ng-click="toggleDetails()">
<div class="expand" ng-show="showDetails" ng-click="toggleDetails()">–</div>
<div class="expand" ng-hide="showDetails" ng-click="toggleDetails()">+</div>
<div class="labels left">
<span ng-repeat="m in sil.matchers | orderBy:name">
<span class="lbl {{ m.name == 'alertname' ? 'lbl-highlight' : '' }}">
{{ m.name }} =<span ng-show="m.isRegex">~</span> '{{ m.value }}'