Template:Ensure AAA contrast ratio: Difference between revisions
From Zoophilia Wiki
Jump to navigationJump to search
meta>Pigsonthewing example |
meta>Izkala Comment cat out of source |
||
| Line 2: | Line 2: | ||
| {{#ifexpr:{{#invoke:Color contrast|ratio|{{{1}}}|black}} > 7|1}} | | {{#ifexpr:{{#invoke:Color contrast|ratio|{{{1}}}|black}} > 7|1}} | ||
| {{#ifexpr:{{#invoke:Color contrast|ratio|{{{1}}}|white}} > 7|1}} = background-color: {{{1}}}; color: {{#invoke:Color contrast|greatercontrast|{{{1}}}|black|white}}; | | {{#ifexpr:{{#invoke:Color contrast|ratio|{{{1}}}|white}} > 7|1}} = background-color: {{{1}}}; color: {{#invoke:Color contrast|greatercontrast|{{{1}}}|black|white}}; | ||
| #default = {{{cat|}}}}}<noinclude> | | #default = /* {{{cat|}}} */}}<noinclude> | ||
{{Documentation|content= | {{Documentation|content= | ||
This template ensures compliance with [http://www.w3.org/TR/2014/NOTE-WCAG20-TECHS-20140916/G17 WCAG G17]. It will reject any background–foreground colour combination with a contrast ratio less than 7:1. {{tl|Ensure AAA contrast ratio}} takes one argument, the background colour. | This template ensures compliance with [http://www.w3.org/TR/2014/NOTE-WCAG20-TECHS-20140916/G17 WCAG G17]. It will reject any background–foreground colour combination with a contrast ratio less than 7:1. {{tl|Ensure AAA contrast ratio}} takes one argument, the background colour. | ||
Revision as of 13:43, 19 July 2015
/* */
Template documentationThis template ensures compliance with WCAG G17. It will reject any background–foreground colour combination with a contrast ratio less than 7:1. {{Ensure AAA contrast ratio}} takes one argument, the background colour.
Here is an example of how to use it.
Examples
{{Ensure AAA contrast ratio|navy}}→ background-color: navy; color: white;{{Ensure AAA contrast ratio|red}}→ /* */{{Ensure AAA contrast ratio|white}}→ background-color: white; color: black;{{Ensure AAA contrast ratio|black}}→ background-color: black; color: white;{{Ensure AAA contrast ratio|#005500}}→ background-color: #005500; color: white;{{Ensure AAA contrast ratio|#CC5500}}→ /* */
