1@mixin col-label {
2  text-transform: uppercase;
3  font-weight: 700;
4  font-size: .8em;
5}
6
7$title-minWidth: 210px;
8
9.inventory__heading {
10  font-weight: 700;
11  padding: 1em 0;
12}
13
14// Inventory Overview
15.inventory-overview {
16  .inventory__group {
17    position: relative;
18    display: block;
19    margin: 0;
20    font-weight: 700;
21    background: $white;
22    padding: 1em 1em 0 1.5em;
23    text-decoration: none;
24    border-left: 1px solid $medgrey;
25    border-right: 1px solid $medgrey;
26    width: 100%;
27    border-bottom: 0;
28    vertical-align: middle;
29    @include fastTransition-all;
30    &:hover {
31      background: $lightblue;
32      color: $black;
33      cursor: pointer;
34    }
35    &.active {
36      background: darken($lightgrey, 3%);
37      &:last-child {
38        border-bottom: 1px solid $medgrey;
39      }
40    }
41    .inv-active {
42      color: darken($active, 20%);
43    }
44    &.inv-disabled {
45      background: $medgrey;
46      .inventory__device-col,
47      .inventory__function-col {
48        color: lighten($darkgrey, 20%);
49      }
50      .accord-trigger {
51        display: none;
52      }
53      &:hover,
54      .accord-trigger:hover {
55        cursor: default;
56      }
57    }
58  }
59
60  // Header row
61  .header__actions-bar {
62    padding: 0 1em 0 1.5em;
63    .inventory__assoc-event {
64      padding-right: 1em;
65      &:hover {
66        cursor: pointer;
67      }
68    }
69  }
70}
71// Inventory items
72.inventory-overview {
73  .inventory__device-col {
74    margin-right: 6px;
75    width: 50%;
76    text-transform: capitalize;
77    @include mediaQuery(medium){
78      width: auto;
79    }
80  }
81
82  .inventory__function-col {
83      @include col-label;
84      color: $severity-medium-lightbg;
85      display: none;
86  }
87  .inventory__device-col,
88  .inventory__function-col {
89    @media (min-width: 1025px){
90      display: inline-block;
91      @include calcColumn-4(5px);
92    }
93  }
94
95  .inventory__metadata {
96    height: 0;
97    max-height: 0;
98    margin: 0 -1em 0 -1.5em;
99    border-top: 1px solid $medgrey;
100    position: relative;
101    overflow: hidden;
102    @include fastTransition-all;
103    &.active {
104      height: 100%;
105      max-height: 1000px;
106      border-bottom: 1px solid $medgrey;
107      background: $lightgrey;
108      padding-bottom: 1em;
109      @include fastTransition-all;
110    }
111    &:hover {
112      cursor: default;
113    }
114  }
115
116  .inventory__metadata-block {
117    min-width: 100%;
118    padding: .5em 1em .5em 1.5em;
119    @include mediaQuery(small) {
120      @include calcColumn-3;
121    }
122    .content-label {
123      color: $darkgrey;
124    }
125  }
126
127  .inventory__metadata-scroll {
128      position: relative;
129      height: 100%;
130      max-height: 200px;
131      overflow-y: scroll;
132      bottom: 0;
133      right:0;
134      width: 100%;
135      padding-top: 1em;
136      padding-left: 1.5em;
137      border-top: 1px solid $medgrey;
138    .inventory__metadata-block {
139      @include calcSplitColumn;
140      margin-bottom: .5em;
141      padding: 0;
142    }
143    @include mediaQuery(medium) {
144      position: absolute;
145      border-left: 1px solid $medgrey;
146      border-top: 0;
147      max-height: 500px;
148      padding: .5em 1em;
149      width: 30%;
150    }
151    .icon__warning {
152      margin-top: -5px;
153      margin-left: .3em;
154    }
155  }
156}
157
158//end inventory details
159
160
161