Style for the new sensors web plugin

platypush/backend/http/static/css/source/webpanel/plugins/sensors/index.scss

@@ -9,5 +9,29 @@
             &:hover { background: $hover-bg; }
         }
     }
+
+    .body {
+        display: flex;
+        flex-direction: column;
+        border: $default-border-3;
+        border-radius: 2rem;
+        margin: 2rem auto;
+        width: 80%;
+
+        .metric {
+            padding: 2rem;
+            border-bottom: $default-border-3;
+            border-radius: 2rem;
+
+            &:nth-child(odd) { background: rgba(255, 255, 255, 0.0); }
+            &:nth-child(even) { background: $default-bg-3; }
+            &:hover { background: $hover-bg; }
+
+            .value {
+                text-align: right;
+                font-weight: bold;
+            }
+        }
+    }
 }
 

platypush/backend/http/templates/plugins/sensors/index.html

@@ -1,16 +1,16 @@
 <script type="text/x-template" id="tmpl-sensors">
     <div class="sensors">
         <div class="head">
-            <button type="button" @click="refresh">
+            <button type="button" title="Refresh measurements" @click="refresh">
                 <i class="fa fa-sync"></i>
             </button>
         </div>
 
         <div class="body">
-            <sensor-metric v-for="metric in metrics"
+            <sensor-metric v-for="value, name in metrics"
-                           :key="metric.name"
+                           :key="name"
-                           :name="metric.name"
+                           :name="name"
-                           :value="metric.value">
+                           :value="value">
             </sensor-metric>
         </div>
     </div>