blob: ff4ea56ad1f385d8fcb0bf4855546d873f73379c [file] [log] [blame]
Michael Davisaeedf9e2017-04-06 14:35:56 -05001<div id="sensors">
2 <div class="row column">
3 <h1>Fan Speed Sensors</h1>
4 </div>
5 <section class="row column">
6 <div class="page-header">
7 <h2 class="inline h4">Sensors present in the system</h2>
8 <button class="inline btn-export float-right">Export</button>
9 </div>
10 </section>
11
12 <!-- Filters -->
13 <section class="row column">
14 <!-- search -->
15 <div class="content__search">
16 <label for="content__search-input">Sensors Search</label>
17 <input id="content__search-input" type="text" placeholder="Filter issues"/>
18 <input id="content__search-submit" type="submit" class="btn btn-secondary" value="Submit"/>
19 </div>
20 <div class="toggle-filter">
21 <button class="inline first btn-primary">All
22 </button>
23 <button class="inline " ng-click="togglehigh = !togglehigh"
24 ng-class="togglehigh ? 'btn-primary' : 'btn-secondary'">Critical
25 </button>
26 <button class="inline" ng-click="togglemed = !togglemed"
27 ng-class="togglemed ? 'btn-primary' : 'btn-secondary'">Warning
28 </button>
29 <button class="inline last" ng-click="togglelow = !togglelow"
30 ng-class="togglelow ? 'btn-primary' : 'btn-secondary'">Normal
31 </button>
32 </div>
33 </section> <!-- end filter -->
34
35 <section class="row column">
36 <div id="back-link">
37 <a href="#/overview/sensors-overview">Back to Sensor Overview</a>
38 </div>
39 </section>
40
41 <section id="sensor__details" class="row column">
42 <div class="row column header-row">
43 <div class="column small-10 large-11 end header__actions-bar">
44 <p class="inline priority-tag-circ high-priority" aria-label="High Priority"></p>
45 <p class="inline sensor__heading sensor__category">Fan speed (RPMs)</p>
46 <p class="inline sensor__heading middle">Reading</p>
47 <p class="inline float-right sensor__heading right">State</p>
48 </div>
49 <div class="column small-2 large-1 sensor__heading trigger-col"></div>
50 </div>
51
52 <!-- Sensor -->
53 <div class="row column accord-row" ng-class="{'active': sensors__metadatarow, 'selected': sensors__selected}">
54 <div class="row">
55 <div class="column small-10 large-11 sensor__info" ng-click="sensors__metadatarow = ! sensors__metadatarow">
56 <p class="inline priority-tag-circ high-priority" aria-label="High Priority"></p>
57 <p class="inline sensor__title">Fan Speed 1</p>
58 <p class="inline sensor__reading">6200 <span>rpms</span></p>
59 <p class="inline float-right sensor__critical-label">Critical</p>
60 </div>
61 <div class="column small-2 large-1">
62 <button class="accord-trigger" ng-class="{'active': sensors__metadatarow}" ng-click="sensors__metadatarow = ! sensors__metadatarow"></button>
63 </div>
64 </div>
65 <div class="row sensors__metadata-row" ng-class="{'active': sensors__metadatarow}">
66 <div class="column small-12">
67 <div class="threshold-chart__wrapper">
68 <span class="threshold__label low">Low</span>
69 <div class="threshold-chart">
70 <span class="threshold__marker thresh__high-critical" style="left: 90%;"><span class="threshold__value">6200 RPMs</span></span>
71 <span class="threshold thresh__low-critical"></span>
72 <span class="threshold thresh__low-warn"></span>
73 <span class="threshold thresh__normal"></span>
74 <span class="threshold thresh__high-warn"></span>
75 <span class="threshold thresh__high-critical"></span>
76 </div>
77 <span class="threshold__label high">High</span>
78 </div>
79 </div>
80 </div>
81 </div>
82
83 <!-- Sensor -->
84 <div class="row column accord-row" ng-class="{'active': sensors__metadatarow2, 'selected': sensors__selected}">
85 <div class="row">
86 <div class="column small-10 large-11 sensor__info" ng-click="sensors__metadatarow2 = ! sensors__metadatarow2">
87 <p class="inline priority-tag-circ normal-priority" aria-label="Normal Priority"></p>
88 <p class="inline sensor__title">Fan Speed 2</p>
89 <p class="inline sensor__reading">4600 <span>rpms</span></p>
90 </div>
91 <div class="column small-2 large-1">
92 <button class="accord-trigger" ng-class="{'active': sensors__metadatarow2}" ng-click="sensors__metadatarow2 = ! sensors__metadatarow2"></button>
93 </div>
94 </div>
95 <div class="row sensors__metadata-row" ng-class="{'active': sensors__metadatarow2}">
96 <div class="column small-12">
97 <div class="threshold-chart__wrapper">
98 <span class="threshold__label low">Low</span>
99 <div class="threshold-chart">
100 <span class="threshold__marker thresh__normal" style="left: 40%;"><span class="threshold__value">4600 RPMs</span></span>
101 <span class="threshold thresh__low-critical"></span>
102 <span class="threshold thresh__low-warn"></span>
103 <span class="threshold thresh__normal"></span>
104 <span class="threshold thresh__high-warn"></span>
105 <span class="threshold thresh__high-critical"></span>
106 </div>
107 <span class="threshold__label high">High</span>
108 </div>
109 </div>
110 </div>
111 </div>
112
113 <!-- Sensor -->
114 <div class="row column accord-row" ng-class="{'active': sensors__metadatarow3, 'selected': sensors__selected}">
115 <div class="row">
116 <div class="column small-10 large-11 sensor__info" ng-click="sensors__metadatarow3 = ! sensors__metadatarow3">
117 <p class="inline priority-tag-circ warn-priority" aria-label="Medium Priority"></p>
118 <p class="inline sensor__title">Fan Speed 3</p>
119 <p class="inline sensor__reading">1200 <span>rpms</span></p>
120 <p class="inline float-right sensor__warning-label">warning</p>
121 </div>
122 <div class="column small-2 large-1">
123 <button class="accord-trigger" ng-class="{'active': sensors__metadatarow3}"
124 ng-click="sensors__metadatarow3 = ! sensors__metadatarow3"></button>
125 </div>
126 </div>
127 <div class="row sensors__metadata-row" ng-class="{'active': sensors__metadatarow3}">
128 <div class="column small-12">
129 <div class="threshold-chart__wrapper">
130 <span class="threshold__label low">Low</span>
131 <div class="threshold-chart">
132 <span class="threshold__marker thresh__low-warn" style="left: 15%;"><span class="threshold__value">1200 RPMs</span></span>
133 <span class="threshold thresh__low-critical"></span>
134 <span class="threshold thresh__low-warn"></span>
135 <span class="threshold thresh__normal"></span>
136 <span class="threshold thresh__high-warn"></span>
137 <span class="threshold thresh__high-critical"></span>
138 </div>
139 <span class="threshold__label high">High</span>
140 </div>
141 </div>
142 </div>
143 </div>
144 </section>
145 <paginate ng-include="paginate"></paginate>
146</div> <!-- end event log -->