| @mixin state-label { |
| text-transform: uppercase; |
| font-weight: 700; |
| font-size: .8em; |
| } |
| |
| $title-minWidth: 210px; |
| |
| .header__actions-bar { |
| padding-left: 1.5em; |
| font-weight: 700; |
| .sensor__reading { |
| margin-right: .3em; |
| } |
| .sensor__heading-current { |
| padding-right: 1em; |
| } |
| } |
| |
| .sensor__heading-current { |
| margin: 0; |
| @include mediaQuery(medium) { |
| margin-left: 10px; |
| margin-right: 10px; |
| } |
| } |
| |
| .sensor__label { |
| float: left; |
| font-weight: 300; |
| @include mediaQuery(medium) { |
| display: none; |
| } |
| } |
| |
| .sensor__title { |
| min-width: 30%; |
| margin-bottom: 0; |
| } |
| |
| .sensor__reading { |
| width: 100%; |
| text-align: right; |
| margin-bottom: 0; |
| display: none; |
| @include mediaQuery(medium) { |
| display: inline-block; |
| width: auto; |
| min-width: calc(70% * (1 / 5) - 18px); |
| } |
| } |
| |
| .sensor__readings-row { |
| width: 100%; |
| position: relative; |
| display: block; |
| margin: 0; |
| background: $white; |
| text-decoration: none; |
| border: 1px solid $medgrey; |
| background: lighten($lightgrey,1%); |
| margin-top: 1em; |
| @include mediaQuery(medium) { |
| padding: .3em 1em .3em 1.5em; |
| margin-top: 0; |
| border-top: 0; |
| background: transparent; |
| } |
| .sensor__title { |
| font-weight: 700; |
| background: darken($lightgrey, 5%); |
| min-width: 100%; |
| padding: .8em; |
| @include mediaQuery(medium) { |
| min-width: 30%; |
| background: transparent; |
| padding: .5em .5em .5em 0; |
| } |
| .icon__normal { |
| width: 0; |
| } |
| } |
| .content-label { |
| font-size: 1em; |
| margin-left: .8em; |
| color: $darkgrey; |
| } |
| .sensor__reading { |
| @include fontCourierBold; |
| display: block; |
| padding: .3em .8em; |
| @include mediaQuery(medium) { |
| display: inline-block; |
| padding: 0; |
| } |
| } |
| .sensor__current { |
| background: darken($thresh-normal, 3%); |
| margin: 0; |
| @include mediaQuery(medium) { |
| background: $thresh-normal; |
| padding: .7em .3em; |
| margin-left: 10px; |
| min-width: 109px; |
| } |
| @include mediaQuery(large) { |
| background: $thresh-normal; |
| padding: .7em; |
| margin-left: .3em; |
| margin-right: .3em; |
| min-width: 150px; |
| } |
| .sensor__label { |
| font-weight: 700; |
| @include mediaQuery(medium) { |
| font-weight:300; |
| } |
| } |
| } |
| .sensor__critical { |
| background: $thresh-critical; |
| color: $white; |
| .content-label { |
| color: $white; |
| } |
| } |
| .sensor__warn { |
| background: $thresh-warning; |
| color: $black; |
| .content-label { |
| color: $black; |
| } |
| } |
| |
| } |
| |
| // Sensors |
| |
| #sensors, #sensors-overview { |
| |
| .toggle-filter { |
| margin-right: 0; |
| } |
| } |
| |
| //end sensor details |