Accessibility: Administration: Respect the `prefers-reduced-motion` media query for update icon spinner animations.

The update icon rotation should not occur when the user has opted to reduce motion, for example by selecting the "Reduce motion" option in macOS' preferences or unselecting "Show animations in Windows" in Windows' preferences.

Follow-up to [47813], [50027].

Props xkon, audrasjb, johnbillion.
Fixes #52263. See #51476.
Built from https://develop.svn.wordpress.org/trunk@50028


git-svn-id: http://core.svn.wordpress.org/trunk@49729 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
Sergey Biryukov 2021-01-27 11:40:59 +00:00
parent 3a695a7be2
commit 401b0bbe8c
9 changed files with 39 additions and 5 deletions

View File

@ -1540,6 +1540,17 @@ div.error {
animation: rotation 2s infinite linear; animation: rotation 2s infinite linear;
} }
@media (prefers-reduced-motion: reduce) {
.updating-message p:before,
.import-php .updating-message:before,
.button.updating-message:before,
.button.installing:before,
.plugins .column-auto-updates .dashicons-update.spin,
.theme-overlay .theme-autoupdate .dashicons-update.spin {
animation: none;
}
}
.theme-overlay .theme-autoupdate .dashicons-update.spin { .theme-overlay .theme-autoupdate .dashicons-update.spin {
margin-left: 3px; margin-left: 3px;
} }

File diff suppressed because one or more lines are too long

View File

@ -1539,6 +1539,17 @@ div.error {
animation: rotation 2s infinite linear; animation: rotation 2s infinite linear;
} }
@media (prefers-reduced-motion: reduce) {
.updating-message p:before,
.import-php .updating-message:before,
.button.updating-message:before,
.button.installing:before,
.plugins .column-auto-updates .dashicons-update.spin,
.theme-overlay .theme-autoupdate .dashicons-update.spin {
animation: none;
}
}
.theme-overlay .theme-autoupdate .dashicons-update.spin { .theme-overlay .theme-autoupdate .dashicons-update.spin {
margin-right: 3px; margin-right: 3px;
} }

File diff suppressed because one or more lines are too long

View File

@ -594,6 +594,12 @@ html:lang(he-il) .rtl #wpadminbar * {
animation: rotation 2s infinite linear; animation: rotation 2s infinite linear;
} }
@media (prefers-reduced-motion: reduce) {
#wpadminbar #wp-admin-bar-updates.spin .ab-icon:before {
animation: none;
}
}
/** /**
* Search * Search
*/ */

File diff suppressed because one or more lines are too long

View File

@ -593,6 +593,12 @@ html:lang(he-il) .rtl #wpadminbar * {
animation: rotation 2s infinite linear; animation: rotation 2s infinite linear;
} }
@media (prefers-reduced-motion: reduce) {
#wpadminbar #wp-admin-bar-updates.spin .ab-icon:before {
animation: none;
}
}
/** /**
* Search * Search
*/ */

File diff suppressed because one or more lines are too long

View File

@ -13,7 +13,7 @@
* *
* @global string $wp_version * @global string $wp_version
*/ */
$wp_version = '5.7-alpha-50027'; $wp_version = '5.7-alpha-50028';
/** /**
* Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema. * Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema.