NG-UI Design Changes

 * Drop-down action design changes to the display="dynamic" and
 container="body"
 * SDN/WIM State label color changed.
 * Dynamic Metric graph color is implemented.

Change-Id: If40f3f087286c8f8a36a0a5702e0116c95ecd956
Signed-off-by: Barath Kumar R <barath.r@tataelxsi.co.in>
diff --git a/src/assets/scss/app.scss b/src/assets/scss/app.scss
index bc8a216..457d940 100644
--- a/src/assets/scss/app.scss
+++ b/src/assets/scss/app.scss
@@ -22,10 +22,11 @@
 * {
   outline: 0;
 }
-button[type=submit]:focus, .sidebar-body button[type=button]:focus {
+button[type="submit"]:focus,
+.sidebar-body button[type="button"]:focus {
   @include box-shadow(0, 0, 0, 0.2rem, lighten($primary, 50%) !important);
 }
-.btn-danger:focus{
+.btn-danger:focus {
   @include box-shadow(0, 0, 0, 0.2rem, lighten($danger, 30%) !important);
 }
 body,
@@ -33,7 +34,10 @@
 .scroll-box,
 .smarttable-style,
 .modal-body-custom-height,
-.layout-wrapper, .CodeMirror-vscrollbar, .ng-sidebar, .runninginstances .popover-body {
+.layout-wrapper,
+.CodeMirror-vscrollbar,
+.ng-sidebar,
+.runninginstances .popover-body {
   &::-webkit-scrollbar {
     @include wh-value(10px, null);
   }
@@ -214,12 +218,12 @@
     @include background(null, $theme-bg-color, null, null, null);
   }
   /** Vim Show running instance Details **/
-  .runninginstances{
-     width:200px;
-     .popover-body{
+  .runninginstances {
+    width: 200px;
+    .popover-body {
       max-height: 200px;
       overflow-y: scroll;
-     }
+    }
   }
   /****************************************************************************/
   /************************** Smart table custom design ***********************/
@@ -412,20 +416,24 @@
         }
       }
     }
-    .dropdown-menu {
-      @include border(all, 1, solid, $primary);
-      @include padding-value(0, 0, 0, 0);
-      button.btn.btn-primary {
-        @include background(null, transparent, null, null, null);
-        @include padding-value(8, 8, 8, 8);
-        @include roundedCorners(0);
-        &:hover {
-          @include background(null, $primary, null, null, null);
-          color: $white;
-        }
-        &:not(:last-child) {
-          @include border(bottom, 1, solid, $primary);
-        }
+  }
+  /****************************************************************************/
+  /*********************** List Action Dropdown section ***********************/
+  /****************************************************************************/
+  .list-action-dropdown {
+    @include border(all, 1, solid, $primary);
+    @include padding-value(0, 0, 0, 0);
+    button.btn.btn-primary {
+      @include background(null, transparent, null, null, null);
+      @include padding-value(8, 8, 8, 8);
+      @include roundedCorners(0);
+      color: $primary;
+      &:hover {
+        @include background(null, $primary, null, null, null);
+        color: $white;
+      }
+      &:not(:last-child) {
+        @include border(bottom, 1, solid, $primary);
       }
     }
   }
@@ -682,6 +690,7 @@
 /****************************************************************************/
 @media (max-width: map-get($grid-breakpoints, md)) {
   .smarttable-style {
+    @include flexbox(block, null, null, null, null, null);
     overflow-x: auto;
     white-space: nowrap;
   }