Improved device page

mean-app/dist/main.bundle.js

@@ -978,7 +978,7 @@ module.exports = "<div class=\"col-md-12\">\r\n\t<h2>{{name}}</h2>\r\n</div>\r\n
 /***/ 678:
 /***/ (function(module, exports) {
 
-module.exports = "<div>\r\n\r\n<ul>\r\n        <li *ngFor=\"let device of devices\" (click)=\"goToDetails(device.sn)\">\r\n          {{device.name}}\r\n        </li>\r\n</ul>\r\n\r\n</div>"
+module.exports = "<div class=\"col-md-12\">\r\n\r\n <div class=\"row\">\r\n\r\n    <div class=\"col-md-4\" *ngFor=\"let device of devices\">\r\n\r\n    \t<div class=\"well\" style=\"cursor:pointer;\" (click)=\"goToDetails(device.sn)\">\r\n\r\n      \t\t<h3>{{device.name}}</h3>\r\n\r\n      \t</div>\r\n    </div>\r\n\r\n </div>\r\n</div>"
 
 /***/ }),
 

mean-app/src/app/device.component.html

@@ -1,9 +1,15 @@
-<div>
+<div class="col-md-12">
 
-<ul>
-        <li *ngFor="let device of devices" (click)="goToDetails(device.sn)">
-          {{device.name}}
-        </li>
-</ul>
+ <div class="row">
 
+    <div class="col-md-4" *ngFor="let device of devices">
+
+    	<div class="well" style="cursor:pointer;" (click)="goToDetails(device.sn)">
+
+      		<h3>{{device.name}}</h3>
+
+      	</div>
+    </div>
+
+ </div>
 </div>