1.icon {
2  display: inline-block;
3  width: 1.5em;
4  height: auto;
5}
6
7.icon__more {
8  fill: $primary-accent;
9  stroke: $primary-accent;
10  background: transparent;
11  overflow: visible;
12  &:hover {
13    cursor: pointer;
14  }
15}
16
17.icon__more-dropdown {
18  background: $background-02;
19  position: absolute;
20  right: 3px;
21  white-space: normal;
22  word-wrap: normal;
23  z-index: 200;
24  padding: 1em;
25  font-size: 1em;
26  box-shadow: 2px 4px 5px $box-shadow-color;
27}
28
29.icon__bar-arrow {
30  font-style: normal;
31  &:before {
32    content: '\21E5';
33    position: absolute;
34    font-size: 1.7em;
35    vertical-align: middle;
36    transform: rotate(90deg);
37    display: inline-block;
38    left: 0px;
39    top: -5px;
40  }
41}
42
43.icon-angle {
44  font-style: normal;
45  &:before {
46    content: '\276F';
47    display: inline-block;
48    font-size: 1em;
49    margin-left: 1em;
50    color: $text-02;
51  }
52}
53//Status icons
54@mixin status-icon {
55  background-repeat: no-repeat;
56  vertical-align: middle;
57  width: 16px;
58  height: 16px;
59  margin-right: .4em;
60}
61
62.icon__warning {
63  @include status-icon;
64  background-image: url(../assets/images/icon-warning.svg);
65}
66
67.modal .icon__warning {
68  width: 30px;
69  height: 30px;
70}
71
72.icon__critical {
73  @include status-icon;
74  background-image: url(../assets/images/icon-critical.svg);
75}
76
77.icon__good {
78  @include status-icon;
79  background-image: url(../assets/images/icon-on.svg);
80}
81
82.icon__off {
83  @include status-icon;
84  background-image: url(../assets/images/icon-off.svg);
85}
86
87.icon__info{
88  margin-top: -4px;
89  margin-right: .5em;
90  width: 25px;
91  height: 25px;
92  fill: $primary-accent;
93  float: left;
94}
95
96.icon__up-arrow {
97  margin-right: .4em;
98  margin-bottom: -15px;
99  background: url(../assets/images/icon-arrow-blue.svg) center center no-repeat;
100  height: 40px;
101  width: 30px;
102  &.icon-as-spacer {
103    background: url(../assets/images/icon-arrow-gray.svg) center center no-repeat;
104  }
105}
106
107.icon__down-arrow {
108  @extend .icon__up-arrow;
109  transform: rotate(180deg);
110}
111