change color scheme to new material design

Signed-off-by: Dennis Adjei-Baah <dennis@buoyant.io>
linkerd · Sep 11, 2018 · 465636b · 465636b
1 parent eec5857
commit 465636b
Show file tree

Hide file tree

Showing 4 changed files with 15 additions and 7 deletions.
diff --git a/web/app/css/breadcrumb-header.css b/web/app/css/breadcrumb-header.css
@@ -1,15 +1,15 @@
 @import 'styles.css';
 
 .ant-layout-header {
-  background-color: #26e99d;
+  background-color: var(--green);
   height: 60px;
   z-index: 100;
   position: fixed;
   width: 100vw;
   padding:16px 50px;
 
   & span.ant-breadcrumb-link, & span.ant-breadcrumb-separator, & :first-child {
-     color: black;
+     color: #404544;
      font-size: 22px;
      font-weight: 500;
   }

diff --git a/web/app/css/service-mesh.css b/web/app/css/service-mesh.css
@@ -56,10 +56,10 @@
           background-color: rgb(130,130,130, 0.8);;
         }
         &.poor{
-          background-color: rgb(235, 87, 87, 0.8);
+          background-color: rgba(255, 77, 43, 0.8);
         }
         &.good{
-          background-color: rgb(39, 174, 96, 0.8);
+          background-color: rgba(38, 233, 157, 0.8);
         }
       }
     }

diff --git a/web/app/css/sidebar.css b/web/app/css/sidebar.css
@@ -104,6 +104,14 @@ ul.ant-menu.ant-menu-sub {
     line-height: 2;
     min-height: 56px;
   }
+
+  & .ant-badge-status-success {
+    background-color: var(--green);
+  }
+
+  & .ant-badge-status-error {
+    background-color: var(--siennared);
+  }
 }
 
 .ant-layout-sider {

diff --git a/web/app/css/styles.css b/web/app/css/styles.css
@@ -12,9 +12,9 @@
   --coldgrey: #c9c9c9;
   --neutralgrey: #828282;
   --silver: #BDBDBD;
-  --green: #27AE60;
-  --siennared: #EB5757;
-  --orange: #FF8C00;
+  --green: #26E99D;
+  --siennared: #FF4D2B;
+  --orange: #ffae4b;
   --latency-p99: var(--royalblue);
   --latency-p95: var(--curiousblue);
   --latency-p50: var(--pictonblue);