WordPress.org
Get WordPress

Make WordPress Core

Ticket #35483: 35483.3.diff

File 35483.3.diff, 12.4 KB (added by joedolson, 4 years ago)

Patch refreshed; escaping of theTitle removed

  • src/js/_enqueues/admin/inline-edit-post.js

     
    131131                $('#bulk-edit').find('fieldset:first').after(
    132132                        $('#inline-edit fieldset.inline-edit-categories').clone()
    133133                ).siblings( 'fieldset:last' ).prepend(
    134                         $('#inline-edit label.inline-edit-tags').clone()
     134                        $( '#inline-edit .inline-edit-tags-wrap' ).clone()
    135135                );
    136136
    137137                $('select[name="_status"] option[value="future"]', bulkRow).remove();
    … …  
    197197                        // If the checkbox for a post is selected, add the post to the edit list.
    198198                        if ( $(this).prop('checked') ) {
    199199                                c = false;
    200                                 var id = $(this).val(), theTitle;
    201                                 theTitle = $('#inline_'+id+' .post_title').html() || wp.i18n.__( '(no title)' );
    202                                 te += '<div id="ttle'+id+'"><a id="_'+id+'" class="ntdelbutton" title="'+ wp.i18n.__( 'Remove From Bulk Edit' ) +'">X</a>'+theTitle+'</div>';
     200                                var id = $( this ).val(),
     201                                        theTitle = $( '#inline_' + id + ' .post_title' ).html() || wp.i18n.__( '(no title)' ),
     202                                        buttonVisuallyHiddenText = wp.i18n.sprintf(
     203                                                /* translators: %s: Post title. */
     204                                                wp.i18n.__( 'Remove &#8220;%s&#8221; from Bulk Edit' ),
     205                                                theTitle
     206                                        );
     207
     208                                te += '<li class="ntdelitem"><button type="button" id="_' + id + '" class="button-link ntdelbutton"><span class="screen-reader-text">' + buttonVisuallyHiddenText + '</span></button><span class="ntdeltitle" aria-hidden="true">' + theTitle + '</span></li>';
    203209                        }
    204210                });
    205211
    … …  
    208214                        return this.revert();
    209215                }
    210216
    211                 // Add onclick events to the delete-icons in the bulk editors the post title list.
    212                 $('#bulk-titles').html(te);
     217                // Populate the list of items to bulk edit.
     218                $( '#bulk-titles' ).html( '<ul id="bulk-titles-list" role="list">' + te + '</ul>' );
     219
    213220                /**
    214                  * Binds on click events to the checkboxes before the posts in the table.
     221                 * Binds on click events to handle the list of items to bulk edit.
    215222                 *
    216223                 * @listens click
    217224                 */
    218                 $('#bulk-titles a').on( 'click', function(){
    219                         var id = $(this).attr('id').substr(1);
     225                $( '#bulk-titles .ntdelbutton' ).click( function() {
     226                        var $this = $( this ),
     227                                id = $this.attr( 'id' ).substr( 1 ),
     228                                $prev = $this.parent().prev().children( '.ntdelbutton' ),
     229                                $next = $this.parent().next().children( '.ntdelbutton' );
    220230
    221                         $('table.widefat input[value="' + id + '"]').prop('checked', false);
    222                         $('#ttle'+id).remove();
     231                        $( 'table.widefat input[value="' + id + '"]' ).prop( 'checked', false );
     232                        $( '#_' + id ).parent().remove();
     233                        wp.a11y.speak( wp.i18n.__( 'Item removed.' ), 'assertive' );
     234
     235                        // Move focus to a proper place when items are removed.
     236                        if ( $next.length ) {
     237                                $next.focus();
     238                        } else if ( $prev.length ) {
     239                                $prev.focus();
     240                        } else {
     241                                $( '#bulk-titles-list' ).remove();
     242                                inlineEditPost.revert();
     243                                wp.a11y.speak( wp.i18n.__( 'All selected items have been removed. Select new items to use Bulk Actions.' ) );
     244                        }
    223245                });
    224246
    225247                // Enable auto-complete for tags when editing posts.
    … …  
    238260                        } );
    239261                }
    240262
     263                // Set initial focus on the Bulk Edit region.
     264                $( '#bulk-edit .inline-edit-wrapper' ).attr( 'tabindex', '-1' ).focus();
    241265                // Scrolls to the top of the table where the editor is rendered.
    242266                $('html, body').animate( { scrollTop: 0 }, 'fast' );
    243267        },

  • src/wp-admin/css/common.css

     
    789789/* @todo can we combine these into a class or use an existing dashicon one? */
    790790.welcome-panel .welcome-panel-close:before,
    791791.tagchecklist .ntdelbutton .remove-tag-icon:before,
    792 #bulk-titles div a:before,
     792#bulk-titles .ntdelbutton:before,
    793793.notice-dismiss:before {
    794794        background: none;
    795795        color: #787c82;
    … …  
    808808        margin: 0;
    809809}
    810810
    811 #bulk-titles div a:before {
    812         margin: 1px 0;
    813 }
    814 
    815811.tagchecklist .ntdelbutton .remove-tag-icon:before {
    816812        margin-left: 2px;
    817813        border-radius: 50%;
    … …  
    826822
    827823.tagchecklist .ntdelbutton:hover .remove-tag-icon:before,
    828824.tagchecklist .ntdelbutton:focus .remove-tag-icon:before,
    829 #bulk-titles div a:hover:before,
    830 #bulk-titles div a:focus:before {
     825#bulk-titles .ntdelbutton:hover:before,
     826#bulk-titles .ntdelbutton:focus:before {
    831827        color: #d63638;
    832828}
    833829

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

     
    858858/*      Layout */
    859859
    860860#wpbody-content .inline-edit-row fieldset {
    861         font-size: 12px;
    862861        float: left;
    863862        margin: 0;
    864         padding: 0;
     863        padding: 0 12px 0 0;
    865864        width: 100%;
     865        box-sizing: border-box;
    866866}
    867867
    868 tr.inline-edit-row td,
    869 #wpbody-content .inline-edit-row fieldset .inline-edit-col {
    870         padding: 0 0.5em;
     868#wpbody-content .inline-edit-row td fieldset:last-of-type {
     869        padding-right: 0;
    871870}
    872871
     872tr.inline-edit-row td {
     873        padding: 0;
     874        /* Prevents the focus style on .inline-edit-wrapper from being cutted-off */
     875        position: relative;
     876}
     877
     878.inline-edit-wrapper {
     879        display: flow-root;
     880        padding: 0 12px;
     881        border: 1px solid transparent;
     882        border-radius: 4px;
     883}
     884
     885.inline-edit-wrapper:focus {
     886        border-color: #2271b1;
     887        box-shadow: 0 0 0 1px #2271b1;
     888        /* Only visible in Windows High Contrast mode */
     889        outline: 2px solid transparent;
     890}
     891
    873892#wpbody-content .quick-edit-row-post .inline-edit-col-left {
    874893        width: 40%;
    875894}
    … …  
    888907
    889908#wpbody-content .quick-edit-row-page .inline-edit-col-right,
    890909#wpbody-content .bulk-edit-row-post .inline-edit-col-right {
    891         width: 49%;
     910        width: 50%;
    892911}
    893912
    894913#wpbody-content .bulk-edit-row .inline-edit-col-left {
    … …  
    918937        flex-wrap: wrap;
    919938        align-items: center;
    920939        clear: both;
    921         padding: 0.5em;
    922         margin: 0.5em 0 0;
     940        margin: 0;
     941        padding: 0.5em 0 1em;
    923942}
    924943
    925944.inline-edit-save.submit .button {
    … …  
    947966/* Needs higher specificity for the padding */
    948967#the-list .inline-edit-row .inline-edit-legend {
    949968        margin: 0;
    950         padding: 0.2em 0.5em 0;
     969        padding: 0.2em 0;
    951970        line-height: 2.5;
    952971        font-weight: 600;
    953972}
    954973
    955 #the-list #bulk-edit.inline-edit-row .inline-edit-legend {
    956         padding: 0.2em 0.5em;
    957 }
    958 
    959974.inline-edit-row fieldset span.title,
    960975.inline-edit-row fieldset span.checkbox-title {
    961976        margin: 0;
    … …  
    10621077        width: 8em;
    10631078}
    10641079
    1065 ul.cat-checklist {
    1066         height: 12em;
    1067         border: solid 1px #dcdcde;
    1068         overflow-y: scroll;
    1069         padding: 0 5px;
    1070         margin: 0;
    1071         background-color: #fff;
    1072 }
    1073 
    1074 #bulk-titles {
    1075         display: block;
    1076         height: 12em;
    1077         border: 1px solid #dcdcde;
    1078         overflow-y: scroll;
    1079         padding: 0 5px;
    1080         margin: 0 0 5px;
    1081 }
    1082 
     1080#bulk-titles-list,
     1081#bulk-titles-list li,
    10831082.inline-edit-row fieldset ul.cat-checklist li,
    10841083.inline-edit-row fieldset ul.cat-checklist input {
    10851084        margin: 0;
    … …  
    10861085        position: relative; /* RTL fix, #WP27629 */
    10871086}
    10881087
    1089 .inline-edit-row fieldset ul.cat-checklist label,
    1090 .inline-edit-row #bulk-titles div {
    1091         font-style: normal;
    1092         font-size: 11px;
     1088.inline-edit-row fieldset ul.cat-checklist input {
     1089        margin-top: -1px;
     1090        margin-left: 3px;
    10931091}
    10941092
    10951093.inline-edit-row fieldset label input.inline-edit-menu-order-input {
    … …  
    11091107        float: left;
    11101108}
    11111109
    1112 #bulk-titles {
    1113         line-height: 140%;
     1110#bulk-titles,
     1111ul.cat-checklist {
     1112        height: 14em;
     1113        border: 1px solid #ddd;
     1114        margin: 0 0 5px;
     1115        padding: 0.2em 5px;
     1116        overflow-y: scroll;
    11141117}
    1115 #bulk-titles div {
    1116         margin: 0.2em 0.3em;
     1118
     1119#bulk-titles .ntdelbutton,
     1120#bulk-titles .ntdeltitle,
     1121.inline-edit-row fieldset ul.cat-checklist label {
     1122        display: inline-block;
     1123        margin: 0;
     1124        padding: 3px 0;
     1125        line-height: 20px;
     1126        vertical-align: top;
    11171127}
    11181128
    1119 #bulk-titles div a {
    1120         cursor: pointer;
    1121         display: block;
    1122         float: left;
    1123         height: 18px;
    1124         margin: 0 3px 0 -2px;
    1125         overflow: hidden;
    1126         position: relative;
    1127         width: 20px;
     1129#bulk-titles .ntdelitem {
     1130        padding-left: 23px;
    11281131}
    11291132
    1130 #bulk-titles div a:before {
    1131         position: relative;
    1132         top: -3px;
     1133#bulk-titles .ntdelbutton {
     1134        width: 26px;
     1135        height: 26px;
     1136        margin: 0 0 0 -26px;
     1137        text-align: center;
     1138        border-radius: 3px;
    11331139}
    11341140
     1141#bulk-titles .ntdelbutton:before {
     1142        display: inline-block;
     1143        vertical-align: top;
     1144}
     1145
     1146#bulk-titles .ntdelbutton:focus {
     1147        box-shadow: 0 0 0 2px #3582c4;
     1148        /* Only visible in Windows High Contrast mode */
     1149        outline: 2px solid transparent;
     1150        /* Reset inherited offset from Gutenberg */
     1151        outline-offset: 0;
     1152}
     1153
    11351154/*------------------------------------------------------------------------------
    11361155  17.0 - Plugins
    11371156------------------------------------------------------------------------------*/
    … …  
    19451964        #wpbody-content .bulk-edit-row .inline-edit-col-bottom {
    19461965                float: none;
    19471966                width: 100%;
     1967                padding: 0;
    19481968        }
    19491969
     1970        #the-list .inline-edit-row .inline-edit-legend,
     1971        .inline-edit-row span.title {
     1972                font-size: 16px;
     1973        }
     1974
     1975        .inline-edit-row p.howto {
     1976                font-size: 14px;
     1977        }
     1978
     1979        #wpbody-content .inline-edit-row-page .inline-edit-col-right {
     1980                margin-top: 0;
     1981        }
     1982
    19501983        #wpbody-content .quick-edit-row fieldset .inline-edit-col label,
    19511984        #wpbody-content .quick-edit-row fieldset .inline-edit-group label,
    19521985        #wpbody-content .bulk-edit-row fieldset .inline-edit-col label,
    … …  
    19722005                padding: 3px 4px;
    19732006        }
    19742007
    1975         .inline-edit-row fieldset ul.cat-checklist label,
    1976         .inline-edit-row #bulk-titles div {
     2008        #bulk-titles .ntdelbutton,
     2009        #bulk-titles .ntdeltitle,
     2010        .inline-edit-row fieldset ul.cat-checklist label {
     2011                padding: 6px 0;
    19772012                font-size: 16px;
     2013                line-height: 28px;
    19782014        }
    19792015
     2016        #bulk-titles .ntdelitem {
     2017                padding-left: 37px;
     2018        }
     2019
     2020        #bulk-titles .ntdelbutton {
     2021                width: 40px;
     2022                height: 40px;
     2023                margin: 0 0 0 -40px;
     2024                overflow: hidden;
     2025        }
     2026
     2027        #bulk-titles .ntdelbutton:before {
     2028                font-size: 20px;
     2029                line-height: 28px;
     2030        }
     2031
    19802032        .inline-edit-row fieldset label span.title,
    19812033        .inline-edit-row fieldset.inline-edit-date legend {
    19822034                float: none;
    19832035        }
    19842036
    1985         .inline-edit-row fieldset label.inline-edit-tags {
    1986                 padding: 0 0.5em;
    1987         }
    1988 
    19892037        .inline-edit-row fieldset .inline-edit-col label.inline-edit-tags {
    19902038                padding: 0;
    19912039        }
    … …  
    20152063                display: block;
    20162064        }
    20172065
    2018         #bulk-titles div {
    2019                 margin: 0.8em 0.3em;
    2020         }
    2021 
    2022         #bulk-titles div a {
    2023                 height: 22px;
    2024         }
    2025 
    20262066        /* Updates */
    20272067        #wpbody-content .updates-table .plugin-title {
    20282068                width: auto;

  • src/wp-admin/includes/class-wp-posts-list-table.php

     
    16111611                        ?>
    16121612                        <tr id="<?php echo $bulk ? 'bulk-edit' : 'inline-edit'; ?>" class="<?php echo $classes; ?>" style="display: none">
    16131613                        <td colspan="<?php echo $this->get_column_count(); ?>" class="colspanchange">
    1614 
     1614                        <div class="inline-edit-wrapper" role="region" aria-labelledby="inline-edit-legend">
    16151615                        <fieldset class="inline-edit-col-left">
    1616                                 <legend class="inline-edit-legend"><?php echo $bulk ? __( 'Bulk Edit' ) : __( 'Quick Edit' ); ?></legend>
     1616                                <legend class="inline-edit-legend" id="inline-edit-legend"><?php echo $bulk ? __( 'Bulk Edit' ) : __( 'Quick Edit' ); ?></legend>
    16171617                                <div class="inline-edit-col">
    16181618
    16191619                                <?php if ( post_type_supports( $screen->post_type, 'title' ) ) : ?>
    … …  
    18281828
    18291829                                                <?php if ( current_user_can( $taxonomy->cap->assign_terms ) ) : ?>
    18301830                                                        <?php $taxonomy_name = esc_attr( $taxonomy->name ); ?>
    1831 
     1831                                                        <div class="inline-edit-tags-wrap">
    18321832                                                        <label class="inline-edit-tags">
    18331833                                                                <span class="title"><?php echo esc_html( $taxonomy->labels->name ); ?></span>
    1834                                                                 <textarea data-wp-taxonomy="<?php echo $taxonomy_name; ?>" cols="22" rows="1" name="tax_input[<?php echo $taxonomy_name; ?>]" class="tax_input_<?php echo $taxonomy_name; ?>"></textarea>
     1834                                                                <textarea data-wp-taxonomy="<?php echo $taxonomy_name; ?>" cols="22" rows="1" name="tax_input[<?php echo esc_attr( $taxonomy->name )?>]" class="tax_input_<?php echo esc_attr( $taxonomy->name )?>" aria-describedby="inline-edit-<?php echo esc_attr( $taxonomy->name )?>-desc"></textarea>
    18351835                                                        </label>
    1836 
     1836                                                        <p class="howto" id="inline-edit-<?php echo esc_attr( $taxonomy->name ); ?>-desc"><?php echo esc_html( $taxonomy->labels->separate_items_with_commas ); ?></p>
     1837                                                        </div>
    18371838                                                <?php endif; // current_user_can( 'assign_terms' ) ?>
    18381839
    18391840                                        <?php endforeach; // $flat_taxonomies as $taxonomy ?>
    … …  
    20302031                                        <p class="error"></p>
    20312032                                </div>
    20322033                        </div>
     2034                </div> <!-- end of .inline-edit-wrapper -->
    20332035
    20342036                        </td></tr>
    20352037