Make WordPress Core

Ticket #21516: 21516.3.diff

File 21516.3.diff, 12.4 KB (added by sabernhardt, 19 months ago)

proof of concept with labels that cover their entire cell

  • src/wp-admin/css/list-tables.css

     
    552552        content: "\f142";
    553553}
    554554
     555.check-column {
     556        position: relative;
     557}
     558
     559.check-column .label-covers-full-cell {
     560        width: 100%;
     561        height: 100%;
     562        display: block;
     563        position: absolute;
     564        top: 0;
     565        left: 0;
     566}
     567
     568.check-column .label-covers-full-cell input {
     569        position: relative;
     570        z-index: 1;
     571}
     572
     573.check-column .label-covers-full-cell:hover + input {
     574        box-shadow: 0 0 0 1px #2271b1;
     575}
     576
    555577.locked-indicator {
    556578        display: none;
    557579        margin-left: 6px;
  • src/wp-admin/includes/class-wp-comments-list-table.php

     
    884884
    885885                if ( $this->user_can ) {
    886886                        ?>
    887                 <label class="screen-reader-text" for="cb-select-<?php echo $comment->comment_ID; ?>">
     887                <label class="label-covers-full-cell" for="cb-select-<?php echo $comment->comment_ID; ?>">
     888                        <span class="screen-reader-text">
    888889                        <?php
    889890                        /* translators: Hidden accessibility text. */
    890891                        _e( 'Select comment' );
    891892                        ?>
     893                        </span>
    892894                </label>
    893895                <input id="cb-select-<?php echo $comment->comment_ID; ?>" type="checkbox" name="delete_comments[]" value="<?php echo $comment->comment_ID; ?>" />
    894896                        <?php
  • src/wp-admin/includes/class-wp-links-list-table.php

     
    174174                $link = $item;
    175175
    176176                ?>
    177                 <label class="screen-reader-text" for="cb-select-<?php echo $link->link_id; ?>">
     177                <label class="label-covers-full-cell" for="cb-select-<?php echo $link->link_id; ?>">
     178                        <span class="screen-reader-text">
    178179                        <?php
    179180                        /* translators: Hidden accessibility text. %s: Link name. */
    180181                        printf( __( 'Select %s' ), $link->link_name );
    181182                        ?>
     183                        </span>
    182184                </label>
    183185                <input type="checkbox" name="linkcheck[]" id="cb-select-<?php echo $link->link_id; ?>" value="<?php echo esc_attr( $link->link_id ); ?>" />
    184186                <?php
  • src/wp-admin/includes/class-wp-list-table.php

     
    13061306
    13071307                if ( ! empty( $columns['cb'] ) ) {
    13081308                        static $cb_counter = 1;
    1309                         $columns['cb']     = '<label class="screen-reader-text" for="cb-select-all-' . $cb_counter . '">' .
     1309                        $columns['cb']     = '<label class="label-covers-full-cell" for="cb-select-all-' . $cb_counter . '">' .
     1310                                '<span class="screen-reader-text">' .
    13101311                                        /* translators: Hidden accessibility text. */
    13111312                                        __( 'Select All' ) .
     1313                                '</span>' .
    13121314                                '</label>' .
    13131315                                '<input id="cb-select-all-' . $cb_counter . '" type="checkbox" />';
    13141316                        $cb_counter++;
  • src/wp-admin/includes/class-wp-media-list-table.php

     
    411411
    412412                if ( current_user_can( 'edit_post', $post->ID ) ) {
    413413                        ?>
    414                         <label class="screen-reader-text" for="cb-select-<?php echo $post->ID; ?>">
     414                        <label class="label-covers-full-cell" for="cb-select-<?php echo $post->ID; ?>">
     415                                <span class="screen-reader-text">
    415416                                <?php
    416417                                /* translators: Hidden accessibility text. %s: Attachment title. */
    417418                                printf( __( 'Select %s' ), _draft_or_post_title() );
    418419                                ?>
     420                                </span>
    419421                        </label>
    420422                        <input type="checkbox" name="media[]" id="cb-select-<?php echo $post->ID; ?>" value="<?php echo $post->ID; ?>" />
    421423                        <?php
  • src/wp-admin/includes/class-wp-ms-sites-list-table.php

     
    411411                if ( ! is_main_site( $blog['blog_id'] ) ) :
    412412                        $blogname = untrailingslashit( $blog['domain'] . $blog['path'] );
    413413                        ?>
    414                         <label class="screen-reader-text" for="blog_<?php echo $blog['blog_id']; ?>">
     414                        <label class="label-covers-full-cell" for="blog_<?php echo $blog['blog_id']; ?>">
     415                                <span class="screen-reader-text">
    415416                                <?php
    416417                                /* translators: %s: Site URL. */
    417418                                printf( __( 'Select %s' ), $blogname );
    418419                                ?>
     420                                </span>
    419421                        </label>
    420422                        <input type="checkbox" id="blog_<?php echo $blog['blog_id']; ?>" name="allblogs[]"
    421423                                value="<?php echo esc_attr( $blog['blog_id'] ); ?>" />
  • src/wp-admin/includes/class-wp-ms-themes-list-table.php

     
    512512                $theme       = $item;
    513513                $checkbox_id = 'checkbox_' . md5( $theme->get( 'Name' ) );
    514514                ?>
    515                 <input type="checkbox" name="checked[]" value="<?php echo esc_attr( $theme->get_stylesheet() ); ?>" id="<?php echo $checkbox_id; ?>" />
    516                 <label class="screen-reader-text" for="<?php echo $checkbox_id; ?>" >
     515                <label class="label-covers-full-cell" for="<?php echo $checkbox_id; ?>" >
     516                        <span class="screen-reader-text">
    517517                        <?php
    518518                        printf(
    519519                                /* translators: Hidden accessibility text. %s: Theme name */
     
    521521                                $theme->display( 'Name' )
    522522                        );
    523523                        ?>
     524                        </span>
    524525                </label>
     526                <input type="checkbox" name="checked[]" value="<?php echo esc_attr( $theme->get_stylesheet() ); ?>" id="<?php echo $checkbox_id; ?>" />
    525527                <?php
    526528        }
    527529
  • src/wp-admin/includes/class-wp-ms-users-list-table.php

     
    235235                        return;
    236236                }
    237237                ?>
    238                 <label class="screen-reader-text" for="blog_<?php echo $user->ID; ?>">
     238                <label class="label-covers-full-cell" for="blog_<?php echo $user->ID; ?>">
     239                        <span class="screen-reader-text">
    239240                        <?php
    240241                        /* translators: Hidden accessibility text. %s: User login. */
    241242                        printf( __( 'Select %s' ), $user->user_login );
    242243                        ?>
     244                        </span>
    243245                </label>
    244246                <input type="checkbox" id="blog_<?php echo $user->ID; ?>" name="allusers[]" value="<?php echo esc_attr( $user->ID ); ?>" />
    245247                <?php
  • src/wp-admin/includes/class-wp-plugins-list-table.php

     
    983983                        $checkbox = '';
    984984                } else {
    985985                        $checkbox = sprintf(
    986                                 '<label class="screen-reader-text" for="%1$s">%2$s</label>' .
     986                                '<label class="label-covers-full-cell" for="%1$s"><span class="screen-reader-text">%2$s</span></label>' .
    987987                                '<input type="checkbox" name="checked[]" value="%3$s" id="%1$s" />',
    988988                                $checkbox_id,
    989989                                /* translators: Hidden accessibility text. %s: Plugin name. */
  • src/wp-admin/includes/class-wp-posts-list-table.php

     
    10121012                 */
    10131013                if ( apply_filters( 'wp_list_table_show_post_checkbox', $show, $post ) ) :
    10141014                        ?>
    1015                         <label class="screen-reader-text" for="cb-select-<?php the_ID(); ?>">
     1015                        <label class="label-covers-full-cell" for="cb-select-<?php the_ID(); ?>">
     1016                                <span class="screen-reader-text">
    10161017                                <?php
    10171018                                        /* translators: %s: Post title. */
    10181019                                        printf( __( 'Select %s' ), _draft_or_post_title() );
    10191020                                ?>
     1021                                </span>
    10201022                        </label>
    10211023                        <input id="cb-select-<?php the_ID(); ?>" type="checkbox" name="post[]" value="<?php the_ID(); ?>" />
    10221024                        <div class="locked-indicator">
  • src/wp-admin/includes/class-wp-privacy-requests-table.php

     
    415415         * @return string Checkbox column markup.
    416416         */
    417417        public function column_cb( $item ) {
    418                 return sprintf( '<input type="checkbox" name="request_id[]" value="%1$s" /><span class="spinner"></span>', esc_attr( $item->ID ) );
     418                return sprintf(
     419                                '<label class="label-covers-full-cell" for="requester_%1$s"><span class="screen-reader-text">%2$s</span></label>' .
     420                                '<input type="checkbox" name="request_id[]" id="requester_%1$s" value="%1$s" /><span class="spinner"></span>',
     421                                esc_attr( $item->ID ),
     422                                /* translators: Hidden accessibility text. %s: Email address. */
     423                                sprintf( __( 'Select %s' ), $item->email )
     424                        );
    419425        }
    420426
    421427        /**
  • src/wp-admin/includes/class-wp-terms-list-table.php

     
    357357
    358358                if ( current_user_can( 'delete_term', $tag->term_id ) ) {
    359359                        return sprintf(
    360                                 '<label class="screen-reader-text" for="cb-select-%1$s">%2$s</label>' .
     360                                '<label class="label-covers-full-cell" for="cb-select-%1$s"><span class="screen-reader-text">%2$s</span></label>' .
    361361                                '<input type="checkbox" name="delete_tags[]" value="%1$s" id="cb-select-%1$s" />',
    362362                                $tag->term_id,
    363363                                /* translators: Hidden accessibility text. %s: Taxonomy term name. */
  • src/wp-admin/includes/class-wp-users-list-table.php

     
    523523
    524524                        // Set up the checkbox (because the user is editable, otherwise it's empty).
    525525                        $checkbox = sprintf(
    526                                 '<label class="screen-reader-text" for="user_%1$s">%2$s</label>' .
     526                                '<label class="label-covers-full-cell" for="user_%1$s"><span class="screen-reader-text">%2$s</span></label>' .
    527527                                '<input type="checkbox" name="users[]" id="user_%1$s" class="%3$s" value="%1$s" />',
    528528                                $user_object->ID,
    529529                                /* translators: Hidden accessibility text. %s: User login. */
  • src/wp-admin/update-core.php

     
    571571        <tr>
    572572                <td class="check-column">
    573573                        <?php if ( $compatible_php ) : ?>
    574                                 <input type="checkbox" name="checked[]" id="<?php echo $checkbox_id; ?>" value="<?php echo esc_attr( $plugin_file ); ?>" />
    575                                 <label for="<?php echo $checkbox_id; ?>" class="screen-reader-text">
     574                                <label for="<?php echo $checkbox_id; ?>" class="label-covers-full-cell">
     575                                        <span class="screen-reader-text">
    576576                                        <?php
    577577                                        /* translators: Hidden accessibility text. %s: Plugin name. */
    578578                                        printf( __( 'Select %s' ), $plugin_data->Name );
    579579                                        ?>
     580                                        </span>
    580581                                </label>
     582                                <input type="checkbox" name="checked[]" id="<?php echo $checkbox_id; ?>" value="<?php echo esc_attr( $plugin_file ); ?>" />
    581583                        <?php endif; ?>
    582584                </td>
    583585                <td class="plugin-title"><p>
     
    745747        <tr>
    746748                <td class="check-column">
    747749                        <?php if ( $compatible_wp && $compatible_php ) : ?>
    748                                 <input type="checkbox" name="checked[]" id="<?php echo $checkbox_id; ?>" value="<?php echo esc_attr( $stylesheet ); ?>" />
    749                                 <label for="<?php echo $checkbox_id; ?>" class="screen-reader-text">
     750                                <label for="<?php echo $checkbox_id; ?>" class="label-covers-full-cell">
     751                                        <span class="screen-reader-text">
    750752                                        <?php
    751753                                        /* translators: Hidden accessibility text. %s: Theme name. */
    752754                                        printf( __( 'Select %s' ), $theme->display( 'Name' ) );
    753755                                        ?>
     756                                        </span>
    754757                                </label>
     758                                <input type="checkbox" name="checked[]" id="<?php echo $checkbox_id; ?>" value="<?php echo esc_attr( $stylesheet ); ?>" />
    755759                        <?php endif; ?>
    756760                </td>
    757761                <td class="plugin-title"><p>