From d666574f66f40dbac78cfc85ad1cbf6fb8d6c443 Mon Sep 17 00:00:00 2001
From: pengpengshui <srqh1120@sina.com>
Date: Mon, 31 Jul 2017 17:20:27 +0800
Subject: [PATCH] fix #2903 #2908 about icons color and statistics style

---
 src/ui_ng/lib/src/tag/tag-detail.component.css.ts  |  3 +++
 src/ui_ng/lib/src/tag/tag-detail.component.html.ts |  4 ++--
 .../lib/src/vulnerability-scanning/scanning.css.ts | 14 ++++++++++----
 .../src/vulnerability-scanning/scanning.html.ts    | 10 +++++-----
 src/ui_ng/src/app/shared/gauge/gauge.component.css |  2 +-
 .../app/shared/statictics/statistics.component.css |  4 ++--
 6 files changed, 23 insertions(+), 14 deletions(-)

diff --git a/src/ui_ng/lib/src/tag/tag-detail.component.css.ts b/src/ui_ng/lib/src/tag/tag-detail.component.css.ts
index 32bf839ba..2db7fb4c4 100644
--- a/src/ui_ng/lib/src/tag/tag-detail.component.css.ts
+++ b/src/ui_ng/lib/src/tag/tag-detail.component.css.ts
@@ -106,4 +106,7 @@ export const TAG_DETAIL_STYLES: string = `
     margin-left: 6px;
     font-weight: 500;
 }
+.tip-icon-medium {
+    color: orange;
+}
 `;
\ No newline at end of file
diff --git a/src/ui_ng/lib/src/tag/tag-detail.component.html.ts b/src/ui_ng/lib/src/tag/tag-detail.component.html.ts
index 0767ecb65..3833c8ef8 100644
--- a/src/ui_ng/lib/src/tag/tag-detail.component.html.ts
+++ b/src/ui_ng/lib/src/tag/tag-detail.component.html.ts
@@ -44,7 +44,7 @@ export const TAG_DETAIL_HTML: string = `
                             <clr-icon shape="error" size="24" class="is-error"></clr-icon>
                         </div>
                         <div class="second-row">
-                            <clr-icon shape="exclamation-triangle" size="24" class="is-warning"></clr-icon>
+                            <clr-icon shape="exclamation-triangle" size="24" class="tip-icon-medium"></clr-icon>
                         </div>
                     </div>
                     <div class="second-column">
@@ -56,7 +56,7 @@ export const TAG_DETAIL_HTML: string = `
                             <clr-icon shape="play" size="20" class="is-warning rotate-90"></clr-icon>
                         </div>
                         <div class="second-row">
-                            <clr-icon shape="help" size="20"></clr-icon>
+                            <clr-icon shape="help" size="18" style="margin-left: 2px;"></clr-icon>
                         </div>
                     </div>
                     <div class="fourth-column">
diff --git a/src/ui_ng/lib/src/vulnerability-scanning/scanning.css.ts b/src/ui_ng/lib/src/vulnerability-scanning/scanning.css.ts
index 2d0a87492..f81ba13a3 100644
--- a/src/ui_ng/lib/src/vulnerability-scanning/scanning.css.ts
+++ b/src/ui_ng/lib/src/vulnerability-scanning/scanning.css.ts
@@ -43,13 +43,13 @@ export const SCANNING_STYLES: string = `
     margin-left: -4px;
 }
 .bar-block-high {
-    background-color: red;
+    background-color: #e62700;
 }
 .bar-block-medium {
-    background-color: yellow;
+    background-color: orange;
 }
 .bar-block-low {
-    background-color: orange;
+    background-color: #fac400;
 }
 .bar-block-none {
     background-color: green;
@@ -84,7 +84,13 @@ export const SCANNING_STYLES: string = `
 .refresh-btn:hover {
     color: #007CBB;
 }
-.tip-icon-low {
+
+.label.label-medium{
+      background-color: #ffe4a9;
+    border: 1px solid orange;
+    color: orange;
+}
+.tip-icon-medium {
     color: orange;
 }
 `; 
\ No newline at end of file
diff --git a/src/ui_ng/lib/src/vulnerability-scanning/scanning.html.ts b/src/ui_ng/lib/src/vulnerability-scanning/scanning.html.ts
index d1cb9c9c4..373b87283 100644
--- a/src/ui_ng/lib/src/vulnerability-scanning/scanning.html.ts
+++ b/src/ui_ng/lib/src/vulnerability-scanning/scanning.html.ts
@@ -16,15 +16,15 @@ export const TIP_COMPONENT_HTML: string = `
                     <span>{{highCount}} {{'VULNERABILITY.SEVERITY.HIGH' | translate }}</span>
                 </div>
                 <div *ngIf="hasMedium" class="bar-summary-item">
-                    <clr-icon *ngIf="hasMedium" shape="exclamation-triangle" class="is-warning" size="22"></clr-icon>
+                    <clr-icon *ngIf="hasMedium" shape="exclamation-triangle" class="tip-icon-medium" size="22"></clr-icon>
                     <span>{{mediumCount}} {{'VULNERABILITY.SEVERITY.MEDIUM' | translate }}</span>
                 </div>
                 <div *ngIf="hasLow" class="bar-summary-item">
-                    <clr-icon shape="info-circle" class="tip-icon-low" size="24"></clr-icon>
+                    <clr-icon shape="play" class="is-warning rotate-90" size="20"></clr-icon>
                     <span>{{lowCount}} {{'VULNERABILITY.SEVERITY.LOW' | translate }}</span>
                 </div>
                 <div *ngIf="hasUnknown" class="bar-summary-item">
-                    <clr-icon shape="help" size="20"></clr-icon>
+                    <clr-icon shape="help" size="18" style="margin-left: 3px;"></clr-icon>
                     <span>{{unknownCount}} {{'VULNERABILITY.SEVERITY.UNKNOWN' | translate }}</span>
                 </div>
                 <div *ngIf="hasNone" class="bar-summary-item">
@@ -64,8 +64,8 @@ export const GRID_COMPONENT_HTML: string = `
             <clr-dg-cell>{{res.id}}</clr-dg-cell>
             <clr-dg-cell [ngSwitch]="res.severity">
               <span *ngSwitchCase="5" class="label label-danger">{{severityText(res.severity) | translate}}</span>
-              <span *ngSwitchCase="4" class="label label-warning">{{severityText(res.severity) | translate}}</span>
-              <span *ngSwitchCase="3" class="label label-success">{{severityText(res.severity) | translate}}</span>
+              <span *ngSwitchCase="4" class="label label-medium">{{severityText(res.severity) | translate}}</span>
+              <span *ngSwitchCase="3" class="label label-warning">{{severityText(res.severity) | translate}}</span>
               <span *ngSwitchCase="1" class="label label-info">{{severityText(res.severity) | translate}}</span>
               <span *ngSwitchDefault>{{severityText(res.severity) | translate}}</span>
             </clr-dg-cell>
diff --git a/src/ui_ng/src/app/shared/gauge/gauge.component.css b/src/ui_ng/src/app/shared/gauge/gauge.component.css
index ab2bfc2ab..f38eab1b3 100644
--- a/src/ui_ng/src/app/shared/gauge/gauge.component.css
+++ b/src/ui_ng/src/app/shared/gauge/gauge.component.css
@@ -167,7 +167,7 @@
     text-align: center;
     margin-top: 3px;
     position: relative;
-    bottom: -2px;
+    bottom: 12px;
 }
 
 .esxc-gauge-small .esxc-title .esxc-bar-title {
diff --git a/src/ui_ng/src/app/shared/statictics/statistics.component.css b/src/ui_ng/src/app/shared/statictics/statistics.component.css
index 6b03edac3..854cd1096 100644
--- a/src/ui_ng/src/app/shared/statictics/statistics.component.css
+++ b/src/ui_ng/src/app/shared/statictics/statistics.component.css
@@ -44,8 +44,8 @@
 .statistic-item-divider {
     height: 54px;
     display: inline-block;
-    width: 1px;
-    background-color: #ccc;
+    width: 2px;
+    background-color: #bdbdbd;
     opacity: 0.55;
     margin-left: 4px;
     margin-right: 12px;