diff options
| author | Ferdinand Thiessen <opensource@fthiessen.de> | 2023-12-16 14:04:53 +0100 |
|---|---|---|
| committer | Eduardo Morales <emoral435@gmail.com> | 2023-12-19 10:20:33 -0600 |
| commit | 74f6995bdb6fa85426048ac87cea7ed94902686f (patch) | |
| tree | d5942987822f11324d1de2f93e13ff0c201ab8bf /apps/theming/tests/Themes/AccessibleThemeTestCase.php | |
| parent | 94a5e6c7b37765a4e8079ad945801a0a892dba04 (diff) | |
| download | nextcloud-server-74f6995bdb6fa85426048ac87cea7ed94902686f.tar.gz nextcloud-server-74f6995bdb6fa85426048ac87cea7ed94902686f.zip | |
fix(theming): Adjust dark high contrast to fulfill WCAG 2.1 AAA contrast
Signed-off-by: Ferdinand Thiessen <opensource@fthiessen.de>
Diffstat (limited to 'apps/theming/tests/Themes/AccessibleThemeTestCase.php')
| -rw-r--r-- | apps/theming/tests/Themes/AccessibleThemeTestCase.php | 35 |
1 files changed, 27 insertions, 8 deletions
diff --git a/apps/theming/tests/Themes/AccessibleThemeTestCase.php b/apps/theming/tests/Themes/AccessibleThemeTestCase.php index fbd0722552d..84121dd41b0 100644 --- a/apps/theming/tests/Themes/AccessibleThemeTestCase.php +++ b/apps/theming/tests/Themes/AccessibleThemeTestCase.php @@ -30,7 +30,15 @@ class AccessibleThemeTestCase extends TestCase { protected ITheme $theme; protected Util $util; + /** + * Set to true to check for WCAG AAA level accessibility + */ + protected bool $WCAGaaa = false; + public function dataAccessibilityPairs() { + $textContrast = $this->WCAGaaa ? 7.0 : 4.5; + $elementContrast = 3.0; + return [ 'primary-element on background' => [ [ @@ -44,7 +52,7 @@ class AccessibleThemeTestCase extends TestCase { '--color-background-darker', '--color-main-background-blur', ], - 3.0, + $elementContrast, ], 'status color elements on background' => [ [ @@ -64,7 +72,18 @@ class AccessibleThemeTestCase extends TestCase { '--color-background-darker', '--color-main-background-blur', ], - 3.0, + $elementContrast, + ], + // Those two colors are used for borders which will be `color-main-text` on focussed state, thus need 3:1 contrast to it + 'success-error-border-colors' => [ + [ + '--color-error', + '--color-success', + ], + [ + '--color-main-text', + ], + $elementContrast, ], 'primary-element-text' => [ [ @@ -75,7 +94,7 @@ class AccessibleThemeTestCase extends TestCase { '--color-primary-element', '--color-primary-element-hover', ], - 4.5, + $textContrast, ], 'primary-element-light-text' => [ ['--color-primary-element-light-text'], @@ -83,7 +102,7 @@ class AccessibleThemeTestCase extends TestCase { '--color-primary-element-light', '--color-primary-element-light-hover', ], - 4.5, + $textContrast, ], 'main-text' => [ ['--color-main-text'], @@ -94,7 +113,7 @@ class AccessibleThemeTestCase extends TestCase { '--color-background-darker', '--color-main-background-blur', ], - 4.5, + $textContrast, ], 'max-contrast-text' => [ ['--color-text-maxcontrast'], @@ -103,14 +122,14 @@ class AccessibleThemeTestCase extends TestCase { '--color-background-hover', '--color-background-dark', ], - 4.5, + $textContrast, ], 'max-contrast text-on blur' => [ ['--color-text-maxcontrast-background-blur'], [ '--color-main-background-blur', ], - 4.5, + $textContrast, ], 'status-text' => [ [ @@ -125,7 +144,7 @@ class AccessibleThemeTestCase extends TestCase { '--color-background-dark', '--color-main-background-blur', ], - 4.5, + $textContrast, ], ]; } |