1@mixin state-label {
2  text-transform: uppercase;
3  font-weight: 700;
4  font-size: .8em;
5}
6
7$title-minWidth: 210px;
8
9.header__actions-bar {
10  padding-left: 1.5em;
11  font-weight: 700;
12  .sensor__reading {
13    margin-right: .3em;
14  }
15  .sensor__heading-current {
16    padding-right: 1em;
17  }
18}
19
20.sensor__heading-current {
21  margin: 0;
22  @include mediaQuery(medium) {
23    margin-left: 10px;
24    margin-right: 10px;
25  }
26}
27
28.sensor__label {
29  float: left;
30  font-weight: 300;
31  @include mediaQuery(medium) {
32    display: none;
33  }
34}
35
36.sensor__title {
37  min-width: 30%;
38  margin-bottom: 0;
39}
40
41.sensor__reading {
42  width: 100%;
43  text-align: right;
44  margin-bottom: 0;
45  display: none;
46  @include mediaQuery(medium) {
47    display: inline-block;
48    width: auto;
49    min-width: calc(70% * (1 / 5) - 18px);
50  }
51}
52
53.sensor__readings-row {
54  width: 100%;
55  position: relative;
56  display: block;
57  margin: 0;
58  background: $white;
59  text-decoration: none;
60  border: 1px solid $medgrey;
61  background: lighten($lightgrey,1%);
62  margin-top: 1em;
63  @include mediaQuery(medium) {
64    padding: .3em 1em .3em 1.5em;
65    margin-top: 0;
66    border-top: 0;
67    background: transparent;
68  }
69  .sensor__title {
70    font-weight: 700;
71    background: darken($lightgrey, 5%);
72    min-width: 100%;
73    padding: .8em;
74    @include mediaQuery(medium) {
75      min-width: 30%;
76      background: transparent;
77      padding: .5em .5em .5em 0;
78    }
79    .icon__normal {
80      width: 0;
81    }
82  }
83  .content-label {
84    font-size: 1em;
85    margin-left: .8em;
86    color: $darkgrey;
87  }
88  .sensor__reading {
89    @include fontCourierBold;
90    display: block;
91    padding: .3em .8em;
92    @include mediaQuery(medium) {
93      display: inline-block;
94      padding: 0;
95    }
96  }
97  .sensor__current {
98    background: darken($thresh-normal, 3%);
99    margin: 0;
100    @include mediaQuery(medium) {
101      background: $thresh-normal;
102      padding: .7em .3em;
103      margin-left: 10px;
104      min-width: 109px;
105    }
106    @include mediaQuery(large) {
107      background: $thresh-normal;
108      padding: .7em;
109      margin-left: .3em;
110      margin-right: .3em;
111      min-width: 150px;
112    }
113    .sensor__label {
114      font-weight: 700;
115      @include mediaQuery(medium) {
116        font-weight:300;
117      }
118    }
119  }
120  .sensor__critical {
121    background: $thresh-critical;
122    color: $white;
123    .content-label {
124      color: $white;
125    }
126  }
127  .sensor__warn {
128    background: $thresh-warning;
129    color: $black;
130    .content-label {
131      color: $black;
132    }
133  }
134
135}
136
137// Sensors
138
139#sensors, #sensors-overview {
140
141  .toggle-filter {
142    margin-right: 0;
143  }
144}
145
146//end sensor details
147