summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorDerick Montague <derick.montague@ibm.com>2019-03-28 21:55:38 -0500
committerDerick Montague <derick.montague@ibm.com>2019-03-28 21:55:38 -0500
commitf41ca4e67bdacc5af174c67c8ff047894ea777be (patch)
tree892e90e38d8b51eba49d61d7f601edfddd636717
parentb1e7c86360f3f9bb05264a3cdbc5a587aa8f1175 (diff)
downloadphosphor-webui-f41ca4e67bdacc5af174c67c8ff047894ea777be.tar.gz
phosphor-webui-f41ca4e67bdacc5af174c67c8ff047894ea777be.zip
Update hex values to meet WCAG AA Guidelines for color contrast
- Change #3C6DF0 to #2D60E5 - Change #E62325 to #DA1416 Tested: I spot tested the Server Overview, the Event log and System logs pages to verify color changes and overall validate the update does not negatively impact the visual integrity of the app. Resolves openbmc/phosphor-webui#70 Signed-off-by: Derick Montague <derick.montague@ibm.com> Change-Id: I2315527a98937176b3e3a2a2118e1798fa4c9e5d
-rw-r--r--app/assets/images/icon-arrow-blue.svg2
-rw-r--r--app/assets/images/icon-critical.svg6
-rw-r--r--app/assets/images/icon-plus.svg2
-rw-r--r--app/assets/images/icon-power.svg4
-rw-r--r--app/common/styles/base/colors.scss8
-rw-r--r--app/common/styles/base/mixins.scss2
6 files changed, 12 insertions, 12 deletions
diff --git a/app/assets/images/icon-arrow-blue.svg b/app/assets/images/icon-arrow-blue.svg
index a246701..3b222a6 100644
--- a/app/assets/images/icon-arrow-blue.svg
+++ b/app/assets/images/icon-arrow-blue.svg
@@ -3,7 +3,7 @@
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 30 30" style="enable-background:new 0 0 30 30;" xml:space="preserve">
<style type="text/css">
- .st0{fill:#3C6DF0;}
+ .st0{fill:#2d60e5;}
</style>
<g>
<path class="st0" d="M15,2c7.2,0,13,5.8,13,13s-5.8,13-13,13S2,22.2,2,15S7.8,2,15,2 M15,0C6.7,0,0,6.7,0,15s6.7,15,15,15
diff --git a/app/assets/images/icon-critical.svg b/app/assets/images/icon-critical.svg
index 5b0b28c..345196c 100644
--- a/app/assets/images/icon-critical.svg
+++ b/app/assets/images/icon-critical.svg
@@ -2,9 +2,9 @@
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 20 20" style="enable-background:new 0 0 20 20;" xml:space="preserve">
<style type="text/css">
- .st0{fill:#E62325;}
- .st1{opacity:0.4;fill:#E62325;enable-background:new ;}
- .st2{fill:none;stroke:#E62325;stroke-width:2;stroke-miterlimit:10;}
+ .st0{fill:#da1416;}
+ .st1{opacity:0.4;fill:#da1416;enable-background:new ;}
+ .st2{fill:none;stroke:#da1416;stroke-width:2;stroke-miterlimit:10;}
</style>
<path class="st0" d="M10,2.3c4.3,0,7.7,3.5,7.7,7.7s-3.5,7.7-7.7,7.7S2.3,14.3,2.3,10S5.8,2.3,10,2.3 M10,0.4
c-5.3,0-9.7,4.3-9.7,9.7s4.3,9.7,9.7,9.7s9.7-4.3,9.7-9.7S15.3,0.4,10,0.4L10,0.4z"/>
diff --git a/app/assets/images/icon-plus.svg b/app/assets/images/icon-plus.svg
index 0f36497..21566bc 100644
--- a/app/assets/images/icon-plus.svg
+++ b/app/assets/images/icon-plus.svg
@@ -2,7 +2,7 @@
viewBox="0 0 16 16" style="enable-background:new 0 0 16 16;" xml:space="preserve">
<style type="text/css">
.st0{fill:#FFFFFF;}
- .st1{fill:#3C6DF0;}
+ .st1{fill:#2d60e5;}
</style>
<g id="Layer_2">
<rect x="3.7" y="4" class="st0" width="8.4" height="8.1"/>
diff --git a/app/assets/images/icon-power.svg b/app/assets/images/icon-power.svg
index 8844297..8040698 100644
--- a/app/assets/images/icon-power.svg
+++ b/app/assets/images/icon-power.svg
@@ -2,8 +2,8 @@
<!-- Generator: Adobe Illustrator 19.2.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" baseProfile="tiny" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
x="0px" y="0px" viewBox="0 0 75 75" xml:space="preserve">
-<path fill="#3C6DF0" d="M17,14.6L17,14.6c1.2-1,1.3-2.7,0.3-3.9c-1-1.1-2.7-1.3-3.9-0.2C1.8,20.6-2.3,36.8,3.1,51.2
+<path fill="#2d60e5" d="M17,14.6L17,14.6c1.2-1,1.3-2.7,0.3-3.9c-1-1.1-2.7-1.3-3.9-0.2C1.8,20.6-2.3,36.8,3.1,51.2
S22.3,75.1,37.6,75C53,74.9,66.7,65.3,72,50.9c5.3-14.4,1-30.6-10.6-40.6c-2.8-2.4-6.3,1.8-3.5,4.1c7,5.9,11,14.7,11,23.8
c0,17.3-14,31.3-31.3,31.3S6.2,55.5,6.2,38.2C6.2,29.2,10.1,20.5,17,14.6z"/>
-<path fill="#3C6DF0" d="M40.2,40.8V2.7c0-3.6-5.4-3.6-5.4,0v38.1c0,1.5,1.2,2.8,2.7,2.8C39,43.6,40.3,42.3,40.2,40.8z"/>
+<path fill="#2d60e5" d="M40.2,40.8V2.7c0-3.6-5.4-3.6-5.4,0v38.1c0,1.5,1.2,2.8,2.7,2.8C39,43.6,40.3,42.3,40.2,40.8z"/>
</svg>
diff --git a/app/common/styles/base/colors.scss b/app/common/styles/base/colors.scss
index 405dad4..6761967 100644
--- a/app/common/styles/base/colors.scss
+++ b/app/common/styles/base/colors.scss
@@ -28,10 +28,10 @@ $input-border: #a7a7a7;
// Light Background
$lightbg__grey: #b8c1c1;
$lightbg__accent: #d8e2fc;
-$lightbg__primary: #3c6df0;
+$lightbg__primary: #2d60e5;
// Primary Button colors
-$primebtn__bg: #3c6df0;
+$primebtn__bg: #2d60e5;
$primebtn__text: $white;
// Secondary Button colors
@@ -55,7 +55,7 @@ $alert__message: rgb(203, 221, 235);
$alert__danger: #fad3D3;
// Severity
-$critical-lightbg: #e62325;
+$critical-lightbg: #da1416;
$critical-darkbg: #ff5c49;
$severity-medium-lightbg: #dc267f;
$medium-darkbg: #FF509E;
@@ -85,7 +85,7 @@ $active: #c6b6f5;
$inactive: $severity-medium-lightbg;
// Links
-$links: #3c6df0;
+$links: #2d60e5;
$links__hover: $lightbg__primary;
$links__visited: #8ea7ea;
$links__disabled: rgba(27, 40, 52, 0.70);
diff --git a/app/common/styles/base/mixins.scss b/app/common/styles/base/mixins.scss
index 6067a0e..c29936d 100644
--- a/app/common/styles/base/mixins.scss
+++ b/app/common/styles/base/mixins.scss
@@ -56,7 +56,7 @@
}
@mixin bgImage__arrowDown-accent {
- background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' version='1.1' width='32' height='24' viewBox='0 0 32 24'><polygon points='0,0 32,0 16,24' style='fill: #3c6df0'></polygon></svg>");
+ background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' version='1.1' width='32' height='24' viewBox='0 0 32 24'><polygon points='0,0 32,0 16,24' style='fill: #2d60e5'></polygon></svg>");
}
@mixin bgImage__arrowDown-grey {
OpenPOWER on IntegriCloud