darkhelm/notifications-admin
1
0
Fork 0
mirror of https://github.com/GSA/notifications-admin.git synced 2026-07-23 09:29:14 -04:00
Code Issues Packages Projects Releases Wiki Activity

Make proposition image meet colour contrast

Browse Source 
The message text in our previous illustration was white on light blue,
which didn’t meet WCAG AA colour contrast. WCAG AA requires a contrast
ratio of 4.5:1. The text in our image was only 3.8:1.

The text in this new image has a contrast ratio of 19.8:1, so easily
passes WCAG AAA.

Required a slight tweak to the positioning of the image because it’s
dimensions weren’t exactly the same as the previous one.
This commit is contained in:
Chris Hill-Scott
2017-02-20 09:25:12 +00:00
parent 1f679a95be
commit e3dd8fd018
2 changed files with 1 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
app/assets/images/product/proposition-illustration.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 28 KiB

After

Width:  |  Height:  |  Size: 28 KiB

2
app/assets/stylesheets/views/product-page.scss
View File

@@ -16,7 +16,7 @@
background-image: file-url('product/proposition-illustration.png');
background-size: 320px;
background-repeat: no-repeat;
background-position: right -14px top 85px;
background-position: right -6px top 85px;
@include ie-lte(8) {
background-image: none;