fix(colors): update success, info, warning, error colors

src/pybind/mgr/dashboard/frontend/src/app/core/navigation/breadcrumbs/breadcrumbs.component.scss

@@ -8,9 +8,9 @@
 
 .breadcrumb > li + li:before {
   padding: 0 5px 0 7px;
-  color: $color-breadcrumb;
+  color: $color-breadcrumb-divider;
   font-family: 'ForkAwesome';
-  content: '\f101';
+  content: '\f105';
 }
 
 .breadcrumb > li > span {

src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/table/table.component.scss

@@ -148,7 +148,14 @@
     filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fffafafa', endColorstr='#ffededed', GradientType=0);
     .sort-asc,
     .sort-desc {
-      color: $color-table-sort;
+      .datatable-header-cell-label {
+        color: $color-table-sort;
+
+        &:hover,
+        &:focus {
+          color: $color-table-sort-hover;
+        }
+      }
     }
     .datatable-header-cell {
       @include table-cell;

src/pybind/mgr/dashboard/frontend/src/app/shared/pipes/health-color.pipe.ts

@@ -6,11 +6,11 @@ import { Pipe, PipeTransform } from '@angular/core';
 export class HealthColorPipe implements PipeTransform {
   transform(value: any): any {
     if (value === 'HEALTH_OK') {
-      return { color: '#00bb00' };
+      return { color: '#92d400' };
     } else if (value === 'HEALTH_WARN') {
-      return { color: '#ffa500' };
+      return { color: '#f0ab00' };
     } else if (value === 'HEALTH_ERR') {
-      return { color: '#ff0000' };
+      return { color: '#c9190b' };
     } else {
       return null;
     }

src/pybind/mgr/dashboard/frontend/src/defaults.scss

@@ -10,21 +10,21 @@ $screen-xs-max: calc(#{$screen-sm-min} - 1px);
 $screen-sm-max: calc(#{$screen-md-min} - 1px);
 $screen-md-max: calc(#{$screen-lg-min} - 1px);
 
-$color-solid-red: #ff0000 !default;
-$color-pink: #a94442 !default;
+$color-solid-red: $pf-color-red-100 !default;
+$color-pink: $pf-color-red-200 !default;
 $color-light-red: #f2dede !default;
 
-$color-orange: #ff6600 !default;
+$color-orange: $pf-color-orange-200 !default;
 
-$color-bright-yellow: #ffc200 !default;
-$color-light-yellow: #fff3cd !default;
+$color-bright-yellow: $pf-color-gold-400 !default;
+$color-light-yellow: $pf-color-gold-100 !default;
 
-$color-bright-green: #00bb00 !default;
-$color-green: #71843f !default;
+$color-bright-green: $pf-color-green-400 !default;
+$color-green: $pf-color-green-600 !default;
 
-$color-blue: #288cea !default;
-$color-light-blue: #d9edf7 !default;
-$color-sky-blue: #afd9ee !default;
+$color-blue: $pf-color-blue-300 !default;
+$color-light-blue: $pf-color-blue-50 !default;
+$color-sky-blue: $pf-color-blue-100 !default;
 
 $color-black: #000 !default;
 $color-transparent-black: rgba(0, 0, 0, 0.7) !default;
@@ -53,12 +53,17 @@ $color-primary: $pf-global--primary-color--100 !default;
 $color-primary-2: $pf-global--primary-color--200 !default;
 $color-secondary: $color-brand-gray !default;
 $color-accent: $color-primary !default;
+$color-info: $pf-global--info-color--100 !default;
+$color-success: $pf-global--success-color--100 !default;
+$color-warning: $pf-global--warning-color--100 !default;
+$color-danger: $pf-global--danger-color--100 !default;
 
 $color-app-bg: $color-solid-white !default;
 $color-bg-darken: $color-dark-gray !default;
 $color-links: $pf-global--link--Color !default;
 $color-links-focus: $pf-global--link--Color--hover !default;
-$color-breadcrumb: $color-dark-gray !default;
+$color-breadcrumb: $color-text !default;
+$color-breadcrumb-divider: $pf-global--BorderColor--200 !default;
 $color-button-text: $color-solid-white !default;
 $color-button: $color-primary !default;
 $color-button-hover: darken($color-primary, 3) !default;
@@ -135,7 +140,8 @@ $color-table-progress-bar-bg: $color-sky-blue !default;
 $color-table-progress-bar-active: $color-primary !default;
 $color-table-gradient-1: $color-whitesmoke-gray !default;
 $color-table-gradient-2: $color-grad-gray !default;
-$color-table-sort: $color-primary !default;
+$color-table-sort: $color-links !default;
+$color-table-sort-hover: $color-links-focus !default;
 $color-table-empty-row: $color-light-yellow !default;
 $color-table-hover-row: $color-white-gray !default;
 $color-table-even-row-bg: $color-solid-white !default;

src/pybind/mgr/dashboard/frontend/src/vendor.overrides.scss

@@ -1,3 +1,36 @@
 /* Vendor specific scss */
 
 @import 'defaults';
+
+.toast-success {
+  background-color: $color-success;
+}
+.toast-error {
+  background-color: $color-danger;
+}
+.toast-info {
+  background-color: $color-success;
+}
+.toast-warning {
+  background-color: $color-warning;
+}
+
+.text-primary {
+  color: $color-primary;
+}
+
+.text-success {
+  color: $color-success;
+}
+
+.text-info {
+  color: $color-info;
+}
+
+.text-warning {
+  color: $color-warning;
+}
+
+.text-danger {
+  color: $color-danger;
+}