Make WordPress Core


Ignore:
Timestamp:
08/03/2019 03:45:06 PM (5 years ago)
Author:
afercia
Message:

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.

File:
1 edited

Legend:

Unmodified
Added
Removed
  • trunk/src/wp-includes/class-wp-text-diff-renderer-table.php

    r45590 r45729  
    114114     */
    115115    public function addedLine( $line ) {
    116         return "<td class='diff-addedline'>{$line}</td>";
     116        return "<td class='diff-addedline'><span aria-hidden='true' class='dashicons dashicons-plus'></span><span class='screen-reader-text'>" . __( 'Added:' ) . " </span>{$line}</td>";
    117117
    118118    }
     
    125125     */
    126126    public function deletedLine( $line ) {
    127         return "<td class='diff-deletedline'>{$line}</td>";
     127        return "<td class='diff-deletedline'><span aria-hidden='true' class='dashicons dashicons-minus'></span><span class='screen-reader-text'>" . __( 'Deleted:' ) . " </span>{$line}</td>";
    128128    }
    129129
     
    135135     */
    136136    public function contextLine( $line ) {
    137         return "<td class='diff-context'>{$line}</td>";
     137        return "<td class='diff-context'><span class='screen-reader-text'>" . __( 'Unchanged:' ) . " </span>{$line}</td>";
    138138    }
    139139
Note: See TracChangeset for help on using the changeset viewer.