alertmanager/ui/app/css/main.css
2015-11-09 13:32:41 +01:00

186 lines
2.8 KiB
CSS

body {
overflow-y: scroll;
background: #fafafa;
}
header {
padding: 1em 2.5em 1.4em 2.5em;
background: #404040;
}
header #logo {
color: #fff;
float: left;
margin: 0 80px 0 0;
}
#top-nav a {
color: #fff;
text-decoration: none
}
#top-nav .selected a {
color: #aaa;
}
#top-nav ul {
float: left;
list-style: none;
margin: 8px 0 0 0 ;
}
#top-nav li {
display: inline-block;
margin-right: 2.2em;
}
#content {
padding: 2.5em;
}
#silence-create {
background: #fff;
width: 100%;
min-width: 400px;
}
.alert-group {
margin-bottom: 5px;
}
.silence .labels, .alert-item .labels {
cursor: pointer;
}
.silence .labels, .alert-item .labels {
width: 75%;
}
.alert-group-header {
border-bottom: 1px solid #fff;
background: #bfbfbf;
padding: .8em;
}
.silence .delete-button, .alert-item .silence-button {
opacity: 0.2;
}
.silence:hover .delete-button, .alert-item:hover .silence-button {
opacity: 1.0;
}
.alert-item .overview {
background: #f0f0f0;
padding: .8em;
}
.silence .overview {
background: #bfbfbf;
padding: .8em;
}
.silence .detail, .alert-item .detail {
background: #fff;
padding: .8em;
}
.silence-matchers {
margin-bottom: 5px;
}
.silence-matchers .is-regex {
font-family: monospace;
}
#silences-query {
margin-bottom: 24px;
}
.alert-item .silence-alert {
padding: 1em 2em;
}
.list-item {
background: #fff;
margin-bottom: 1px;
}
.list-item .container-left {
width: 650px;
padding: 1em;
float: left;
background: #777;
color: #eee;
}
.lbl {
display: inline-block;
font-size: 0.7em;
padding: 0 6px;
margin: 0 2px 2px 0;
font-family: Menlo, Monaco, Consolas, Courier, monospace;
border: 1px solid #ccc;
border-radius: 3px;
background: #555;
color: #fff;
}
.lbl-highlight {
background: #e6522c;
}
.lbl-outline {
color: #555 !important;
background: rgba(255, 255, 255, 0.5) !important;
border: 1px solid #555 !important;
}
.annotations {
white-space: pre-wrap !important;
}
.table-normal.annotations td {
padding: .4em !important;
text-overflow: clip;
}
.list-item .container-right {
border-left: 650px solid #777;
padding: 1em;
}
.active-interval {
color: #aaa;
font-style: italic;
}
.silence-alert {
background: #f0f0f0;
border-top: 1px solid #fff;
border-bottom: 1px solid #fff;
}
input.collapse[type=checkbox] {
-webkit-appearance: none;
width: 1em;
height: 1em;
border: none;
}
input.collapse[type=checkbox]:after {
content: '▹';
}
input.collapse.open[type=checkbox]:after {
content: '▿';
}
.label.alertname {
background: #fff !important;
}
/**/
input[type="datetime-local"] {
font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
font-size: 1.4rem;
padding: 0.9rem 1rem;
line-height: 1;
height: 40px;
outline: none;
background: #ffffff;
border: 1px solid #dfdfdf;
border-radius: 2px;
margin-bottom: 0;
color: rgba(0, 0, 0, 0.85);
}