public/css/widget/downtime-card.less


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47

.downtime-progress {
  .progress-bar();

  &.flexible.in-effect .marker {
    &.start,
    &.end {
      background-color: @gray-light;
    }

    &.flex-start,
    &.flex-end {
      background-color: @icinga-blue;
    }
  }

  .downtime-elapsed {
    background-color: @color-ok;

    &:before,
    &:after {
      background-color: @color-ok;
    }
  }

  .downtime-overrun {
    background-color: @color-down;

    &:before,
    &:after {
      background-color: @color-down;
    }
  }

  .downtime-elapsed + .downtime-overrun {
    &:before {
      display: none;
    }
  }
}

.downtime-progress.progress-bar {
  // This requires more specificity, otherwise it has no effect
  .above,
  .below {
    padding: 2em 10%;
  }
}