Skip to content

Commit 674d952

Browse files
committed
Fix text contrast for guide header and footer [ci-skip]
Links in the header and footer of the guides currently have a contrast ratio of 4.1:1 which is below the 4.5:1 ratio required to pass the minimum Web Content Accessibility Guidelines (WCAG) 2.1 standard. WCAG 2.1 Understanding Success Criterion 1.4.3: Contrast (Minimum) https://www.w3.org/WAI/WCAG21/Understanding/contrast-minimum.html Red text on a dark grey background (rails#22222) is generally considered hard to read so the links were changed to the pink color from the Rails Guides logo. Using pink avoids adding yet another shade of red to the guideline color palette and as an added bonus has a contrast ratio of 7.04:1 which meets the 7:1 ratio of the enhanced contrast success criterion. Understanding Success Criterion 1.4.6: Contrast (Enhanced) https://www.w3.org/WAI/WCAG21/Understanding/contrast-enhanced
1 parent 359efef commit 674d952

File tree

1 file changed

+5
-0
lines changed

1 file changed

+5
-0
lines changed

guides/assets/stylesheets/main.css

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -185,11 +185,16 @@ body {
185185
}
186186
.more-info:after {
187187
content: " |";
188+
color: #8a8a8a;
188189
}
189190

190191
.more-info:last-child:after {
191192
content: "";
192193
}
194+
195+
#topNav a, #footer a {
196+
color: #F1938C;
197+
}
193198
}
194199

195200
@media screen and (max-width: 1024px) {

0 commit comments

Comments
 (0)