GUI -- Application View Details Panel -
  - simplified DOM structure
  - refactored code to reduce boilerplate
  - cleaned up CSS

Change-Id: Iff443d7f038f1f770e7b3e9ed383c65b96ba6886
diff --git a/web/gui/src/main/webapp/app/view/app/app.css b/web/gui/src/main/webapp/app/view/app/app.css
index 4912809..eab45ef 100644
--- a/web/gui/src/main/webapp/app/view/app/app.css
+++ b/web/gui/src/main/webapp/app/view/app/app.css
@@ -15,7 +15,7 @@
  */
 
 /*
- ONOS GUI -- Host View -- CSS file
+ ONOS GUI -- Applications View -- CSS file
  */
 
 #ov-app h2 {
@@ -75,7 +75,7 @@
 }
 
 #application-details-panel .container {
-    padding: 0 12px;
+    padding: 0 10px;
 }
 
 #application-details-panel .close-btn {
@@ -91,60 +91,48 @@
     fill: #ccc;
 }
 
-#application-details-panel .dev-icon {
+#application-details-panel .app-icon {
     display: inline-block;
     padding: 0 6px 0 0;
     vertical-align: middle;
 }
-.light .dev-icon svg.embeddedIcon .glyph {
-    fill: rgb(0, 172, 229);
-}
-.dark .dev-icon svg.embeddedIcon .glyph {
-    fill: #486D91;
-}
 
 #application-details-panel h2 {
     display: inline-block;
     margin: 8px 0;
+    font-size: 12pt;
 }
 
 #application-details-panel .top div.left {
     float: left;
-    padding: 0 18px 0 0;
+    padding: 0 12px 0 0;
 }
 #application-details-panel .top div.right {
     display: inline-block;
+    overflow: hidden;
+    width: 320px;
 }
 
-#application-details-panel td.label {
+#application-details-panel td.label,
+#application-details-panel .app-url i {
     font-style: italic;
     padding-right: 12px;
     /* works for both light and dark themes ... */
     color: #777;
 }
 
-#application-details-panel .actionBtns div {
-    padding: 12px 6px;
+#application-details-panel td.value-bold {
+    font-weight: bold;
 }
 
-#application-details-panel .top hr {
+#application-details-panel .app-url {
+    padding: 10px 6px 6px;
+}
+
+#application-details-panel hr {
     width: 95%;
-    margin: 0 auto;
+    margin: 10px auto;
 }
-
-.light #application-details-panel hr {
-    opacity: .5;
-    border-color: #FFF;
-}
-.dark #application-details-panel hr {
-    border-color: #666;
-}
-
-#application-details-panel .middle hr {
-    width: 95%;
-    margin: 0 auto;
-}
-
 .light #application-details-panel hr {
     opacity: .5;
     border-color: #FFF;
@@ -155,25 +143,12 @@
 
 #application-details-panel .bottom table {
     border-spacing: 0;
+    width: 100%;
 }
 
-#application-details-panel .bottom th {
-    letter-spacing: 0.02em;
-}
-
-.light #application-details-panel .bottom th {
-    background-color: #CCC;
-    /* default text color */
-}
-.dark #application-details-panel .bottom th {
-    background-color: #131313;
-    color: #ccc;
-}
-
-#application-details-panel .bottom th,
 #application-details-panel .bottom td {
     padding: 6px 12px;
-    text-align: center;
+    text-align: left;
 }
 
 .light #application-details-panel .bottom tr:nth-child(odd) {