WordPress-C
/
WordPress
mirror of https://github.com/WordPress/WordPress.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Accessibility: Improve the differences between revisions. 

Color alone is not sufficient to visually communicate differences.

- adds `plus` and `minus` icons to the changed lines
- adds visually hidden text: `Added`, `Deleted`, and `Unchanged` to clarify the differences to assistive technologies users

Props birgire, audrasjb, kjellr, adamsilverstein.
Fixes #43532.

Built from https://develop.svn.wordpress.org/trunk@45729


git-svn-id: http://core.svn.wordpress.org/trunk@45540 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
Andrea Fercia 2019-08-03 15:46:54 +00:00
parent cbd6b7b5bc
commit b853e21bf9
6 changed files with 50 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
wp-admin/css/revisions-rtl.css
View File

@ -223,8 +223,8 @@ table.diff td,
table.diff th {
font-family: Consolas, Monaco, monospace;
font-size: 14px;
line-height: 1.618;
padding: .5em;
line-height: 1.57142857;
padding: 0.5em 2em 0.5em 0.5em;
vertical-align: top;
word-wrap: break-word;
}
@ -244,6 +244,7 @@ table.diff .diff-addedline ins {
}
table.diff .diff-deletedline {
position: relative;
background-color: #ffe9e9;
}
@ -252,9 +253,26 @@ table.diff .diff-deletedline del {
}
table.diff .diff-addedline {
position: relative;
background-color: #e9ffe9;
}
table.diff .diff-deletedline .dashicons,
table.diff .diff-addedline .dashicons {
position: absolute;
top: 0.85714286em;
right: 0.5em;
width: 1em;
height: 1em;
font-size: 1em;
line-height: 1;
}
table.diff .diff-addedline .dashicons {
/* Compensate the vertically non-centered plus glyph. */
top: 0.92857143em;
}
table.diff .diff-addedline ins {
background-color: #afa;
}
@ -521,7 +539,7 @@ div.revisions-controls > .wp-slider > .ui-slider-handle {
.wp-slider .ui-slider-range {
position: absolute;
font-size: .7em;
font-size: 0.7em;
display: block;
border: 0;
background-color: transparent;
@ -529,7 +547,7 @@ div.revisions-controls > .wp-slider > .ui-slider-handle {
}
.wp-slider.ui-slider-horizontal {
height: .7em;
height: 0.7em;
}
.wp-slider.ui-slider-horizontal .ui-slider-handle {

2
wp-admin/css/revisions-rtl.min.css vendored
View File

File diff suppressed because one or more lines are too long

26
wp-admin/css/revisions.css
View File

@ -223,8 +223,8 @@ table.diff td,
table.diff th {
font-family: Consolas, Monaco, monospace;
font-size: 14px;
line-height: 1.618;
padding: .5em;
line-height: 1.57142857;
padding: 0.5em 0.5em 0.5em 2em;
vertical-align: top;
word-wrap: break-word;
}
@ -244,6 +244,7 @@ table.diff .diff-addedline ins {
}
table.diff .diff-deletedline {
position: relative;
background-color: #ffe9e9;
}
@ -252,9 +253,26 @@ table.diff .diff-deletedline del {
}
table.diff .diff-addedline {
position: relative;
background-color: #e9ffe9;
}
table.diff .diff-deletedline .dashicons,
table.diff .diff-addedline .dashicons {
position: absolute;
top: 0.85714286em;
left: 0.5em;
width: 1em;
height: 1em;
font-size: 1em;
line-height: 1;
}
table.diff .diff-addedline .dashicons {
/* Compensate the vertically non-centered plus glyph. */
top: 0.92857143em;
}
table.diff .diff-addedline ins {
background-color: #afa;
}
@ -521,7 +539,7 @@ div.revisions-controls > .wp-slider > .ui-slider-handle {
.wp-slider .ui-slider-range {
position: absolute;
font-size: .7em;
font-size: 0.7em;
display: block;
border: 0;
background-color: transparent;
@ -529,7 +547,7 @@ div.revisions-controls > .wp-slider > .ui-slider-handle {
}
.wp-slider.ui-slider-horizontal {
height: .7em;
height: 0.7em;
}
.wp-slider.ui-slider-horizontal .ui-slider-handle {

2
wp-admin/css/revisions.min.css vendored
View File

File diff suppressed because one or more lines are too long

6
wp-includes/class-wp-text-diff-renderer-table.php
View File

@ -113,7 +113,7 @@ class WP_Text_Diff_Renderer_Table extends Text_Diff_Renderer {
* @return string
*/
public function addedLine( $line ) {
return "<td class='diff-addedline'>{$line}</td>";
return "<td class='diff-addedline'><span aria-hidden='true' class='dashicons dashicons-plus'></span><span class='screen-reader-text'>" . __( 'Added:' ) . " </span>{$line}</td>";
}
@ -124,7 +124,7 @@ class WP_Text_Diff_Renderer_Table extends Text_Diff_Renderer {
* @return string
*/
public function deletedLine( $line ) {
return "<td class='diff-deletedline'>{$line}</td>";
return "<td class='diff-deletedline'><span aria-hidden='true' class='dashicons dashicons-minus'></span><span class='screen-reader-text'>" . __( 'Deleted:' ) . " </span>{$line}</td>";
}
/**
@ -134,7 +134,7 @@ class WP_Text_Diff_Renderer_Table extends Text_Diff_Renderer {
* @return string
*/
public function contextLine( $line ) {
return "<td class='diff-context'>{$line}</td>";
return "<td class='diff-context'><span class='screen-reader-text'>" . __( 'Unchanged:' ) . " </span>{$line}</td>";
}
/**

2
wp-includes/version.php
View File

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