Make WordPress Core

Ticket #40331: 40331.4.diff

File 40331.4.diff, 28.4 KB (added by joedolson, 12 months ago)

Updated patch

  • src/js/_enqueues/vendor/tinymce/plugins/wplink/plugin.js

     
    5656                renderHtml: function() {
    5757                        return (
    5858                                '<div id="' + this._id + '" class="wp-link-input">' +
    59                                         '<input type="text" value="" placeholder="' + tinymce.translate( 'Paste URL or type to search' ) + '" />' +
     59                                        '<label for="' + this._id + '_label">' + tinymce.translate( 'Paste URL or type to search' ) + '</label><input id="' + this._id + '_label" type="text" value="" />' +
    6060                                        '<input type="text" style="display:none" value="" />' +
    6161                                '</div>'
    6262                        );
    6363                },
    6464                setURL: function( url ) {
    65                         this.getEl().firstChild.value = url;
     65                        this.getEl().firstChild.nextSibling.value = url;
    6666                },
    6767                getURL: function() {
    68                         return tinymce.trim( this.getEl().firstChild.value );
     68                        return tinymce.trim( this.getEl().firstChild.nextSibling.value );
    6969                },
    7070                getLinkText: function() {
    71                         var text = this.getEl().firstChild.nextSibling.value;
     71                        var text = this.getEl().firstChild.nextSibling.nextSibling.value;
    7272
    7373                        if ( ! tinymce.trim( text ) ) {
    7474                                return '';
     
    7777                        return text.replace( /[\r\n\t ]+/g, ' ' );
    7878                },
    7979                reset: function() {
    80                         var urlInput = this.getEl().firstChild;
     80                        var urlInput = this.getEl().firstChild.nextSibling;
    8181
    8282                        urlInput.value = '';
    8383                        urlInput.nextSibling.value = '';
     
    394394                        type: 'WPLinkInput',
    395395                        onPostRender: function() {
    396396                                var element = this.getEl(),
    397                                         input = element.firstChild,
     397                                        input = element.firstChild.nextSibling,
    398398                                        $input, cache, last;
    399399
    400400                                inputInstance = this;
     
    438438                                                },
    439439                                                select: function( event, ui ) {
    440440                                                        $input.val( ui.item.permalink );
    441                                                         $( element.firstChild.nextSibling ).val( ui.item.title );
     441                                                        $( element.firstChild.nextSibling.nextSibling ).val( ui.item.title );
    442442
    443443                                                        if ( 9 === event.keyCode && typeof window.wpLinkL10n !== 'undefined' ) {
    444444                                                                // Audible confirmation message when a link has been selected.
  • src/js/_enqueues/wp/customize/controls.js

     
    19171917                        section.contentContainer.on( 'click', '.feature-filter-toggle', function( e ) {
    19181918                                var $themeContainer = $( '.customize-themes-full-container' ),
    19191919                                        $filterToggle = $( e.currentTarget );
    1920                                 section.filtersHeight = $filterToggle.parent().next( '.filter-drawer' ).height();
     1920                                section.filtersHeight = $filterToggle.parents( '.themes-filter-bar' ).next( '.filter-drawer' ).height();
    19211921
    19221922                                if ( 0 < $themeContainer.scrollTop() ) {
    19231923                                        $themeContainer.animate( { scrollTop: 0 }, 400 );
     
    19321932                                        .attr( 'aria-expanded', function( i, attr ) {
    19331933                                                return 'true' === attr ? 'false' : 'true';
    19341934                                        })
    1935                                         .parent().next( '.filter-drawer' ).slideToggle( 180, 'linear' );
     1935                                        .parents( '.themes-filter-bar' ).next( '.filter-drawer' ).slideToggle( 180, 'linear' );
    19361936
    19371937                                if ( $filterToggle.hasClass( 'open' ) ) {
    19381938                                        var marginOffset = 1018 < window.innerWidth ? 50 : 76;
     
    37393739                ready: function() {
    37403740                        var control = this, newItem;
    37413741                        if ( 'dropdown-pages' === control.params.type && control.params.allow_addition ) {
    3742                                 newItem = control.container.find( '.new-content-item' );
     3742                                newItem = control.container.find( '.new-content-item-wrapper' );
    37433743                                newItem.hide(); // Hide in JS to preserve flex display when showing.
    37443744                                control.container.on( 'click', '.add-new-toggle', function( e ) {
    37453745                                        $( e.currentTarget ).slideUp( 180 );
     
    40854085                        }
    40864086
    40874087                        toggle = control.container.find( '.add-new-toggle' );
    4088                         container = control.container.find( '.new-content-item' );
     4088                        container = control.container.find( '.new-content-item-wrapper' );
    40894089                        input = control.container.find( '.create-item-input' );
    40904090                        title = input.val();
    40914091                        select = control.container.find( 'select' );
  • src/js/media/views/attachments/browser.js

     
    378378                }
    379379
    380380                if ( this.options.search ) {
    381                         // Search is an input, a visually hidden label element needs to be rendered before.
     381                        // Search is an input, a label element needs to be rendered before.
    382382                        this.toolbar.set( 'searchLabel', new wp.media.view.Label({
    383383                                value: l10n.searchLabel,
    384384                                className: 'media-search-input-label',
  • src/wp-admin/css/common.css

     
    10901090
    10911091.wp-filter .search-form {
    10921092        float: right;
    1093         margin: 10px 0;
     1093        display: flex;
     1094        align-items: center;
     1095        column-gap: .5rem;
    10941096}
    10951097
    10961098.wp-filter .search-form input[type="search"] {
     
    11191121.wp-filter .search-form.search-plugins .wp-filter-search,
    11201122.no-js .wp-filter .search-form.search-plugins .button {
    11211123        display: inline-block;
    1122         margin-top: 10px;
    11231124        vertical-align: top;
    11241125}
    11251126
     
    13601361                position: relative;
    13611362                max-width: 100%;
    13621363        }
     1364        .wp-filter .search-form {
     1365                margin: 11px 0;
     1366                flex-wrap: wrap;
     1367                row-gap: 10px;
     1368        }
    13631369}
    13641370
    13651371@media only screen and (max-width: 782px) {
     
    41514157        }
    41524158
    41534159        .wp-filter .search-form input[type="search"] {
    4154                 width: 100%;
    41554160                font-size: 1rem;
    41564161        }
    41574162
     
    42054210        .nav-tab-active:focus:active {
    42064211                border-bottom: 1px solid #c3c4c7;
    42074212        }
     4213
     4214        .wp-filter .search-form.search-plugins label {
     4215                width: 100%;
     4216        }
    42084217}
    42094218
    42104219@media screen and (max-width: 480px) {
  • src/wp-admin/css/customize-controls.css

     
    10821082        float: left;
    10831083}
    10841084
    1085 #available-menu-items .accordion-section-content .new-content-item,
    1086 .customize-control-dropdown-pages .new-content-item {
     1085#available-menu-items .accordion-section-content .new-content-item-wrapper,
     1086.customize-control-dropdown-pages .new-content-item-wrapper {
    10871087        width: calc(100% - 30px);
    10881088        padding: 8px 15px;
    10891089        position: absolute;
     
    10901090        bottom: 0;
    10911091        z-index: 10;
    10921092        background: #f0f0f1;
     1093}
     1094
     1095.customize-control-dropdown-pages .new-content-item-wrapper {
     1096        width: 100%;
     1097        padding: 0;
     1098        position: static;
     1099}
     1100
     1101#available-menu-items .accordion-section-content .new-content-item,
     1102.customize-control-dropdown-pages .new-content-item {
    10931103        display: flex;
    10941104}
    10951105
     
    10991109        position: relative;
    11001110}
    11011111
     1112.customize-control-dropdown-pages .new-content-item-wrapper .new-content-item {
     1113        padding: 0;
     1114}
     1115
     1116.customize-control-dropdown-pages .new-content-item-wrapper .new-content-item label {
     1117        line-height: 1.6;
     1118}
     1119
    11021120#available-menu-items .new-content-item .create-item-input,
    11031121.customize-control-dropdown-pages .new-content-item .create-item-input {
    11041122        flex-grow: 10;
     
    18151833        bottom: 0;
    18161834}
    18171835
    1818 .themes-filter-bar .feature-filter-toggle {
    1819         float: right;
    1820         margin: 3px 0 3px 25px;
    1821 }
    1822 
    18231836.themes-filter-bar .feature-filter-toggle:before {
    18241837        content: "\f111";
    18251838        margin: 0 5px 0 0;
     
    18801893        animation: .6s themes-fade-in 1;
    18811894}
    18821895
    1883 .control-panel-themes .filter-themes-count {
    1884         position: relative;
    1885         float: right;
    1886         line-height: 2.6;
    1887 }
    1888 
    18891896.control-panel-themes .filter-themes-count .themes-displayed {
    18901897        font-weight: 600;
    18911898        color: #50575e;
     
    20972104        box-sizing: border-box;
    20982105        border-bottom: 1px solid #dcdcde;
    20992106}
     2107.customize-preview-header.themes-filter-bar,
     2108.customize-preview-header.themes-filter-bar .search-form {
     2109        display: flex;
     2110        align-items: center;
     2111        gap: 10px;
     2112        flex-wrap: wrap;
     2113}
    21002114
     2115.customize-preview-header.themes-filter-bar .search-form-input {
     2116        position: relative;
     2117}
     2118
     2119.customize-preview-header .filter-themes-wrapper {
     2120        display: grid;
     2121        align-items: center;
     2122        gap: 10px;
     2123        grid-template-columns: auto 1fr;
     2124}
     2125
     2126.customize-preview-header .filter-themes-wrapper .filter-themes-count {
     2127        justify-self: end;
     2128}
     2129
    21012130@media screen and (min-width: 1670px) {
    21022131        .customize-preview-header.themes-filter-bar {
    21032132                width: 82%;
     
    21092138.themes-filter-bar .themes-filter-container {
    21102139        margin: 0;
    21112140        padding: 0;
     2141        display: flex;
     2142        align-items: center;
     2143        gap: 10px;
    21122144}
    21132145
    21142146.themes-filter-bar .wp-filter-search {
     
    21172149        max-width: 100%;
    21182150        width: 40%;
    21192151        min-width: 300px;
    2120         position: absolute;
    2121         top: 6px;
    2122         left: 25px;
    21232152        height: 32px;
    21242153        margin: 1px 0;
     2154        top: 0;
     2155        left: 0;
    21252156}
    21262157
    21272158/* Unstick the filter bar on short windows/screens. This breakpoint is based on the
     
    21552186        }
    21562187}
    21572188
    2158 @media screen and (max-width: 900px) {
     2189@media screen and (max-width: 960px) {
    21592190        .customize-preview-header.themes-filter-bar {
    2160                 height: 86px;
    2161                 padding-top: 46px;
     2191                height: 96px;
    21622192        }
     2193}
    21632194
     2195@media screen and (max-width: 900px) {
    21642196        .themes-filter-bar .wp-filter-search {
    2165                 width: calc(100% - 50px);
     2197                width: 100%;
    21662198                margin: 0;
    21672199                min-width: 200px;
    21682200        }
    21692201
     2202        .customize-preview-header.themes-filter-bar,
     2203        .customize-preview-header.themes-filter-bar .search-form
     2204        .themes-filter-bar .themes-filter-container {
     2205                display: grid;
     2206                gap: 4px;
     2207        }
     2208
     2209        .customize-preview-header.themes-filter-bar .search-form-input {
     2210                display: flex;
     2211                flex-grow: 1;
     2212        }
     2213
    21702214        .filter-drawer {
    21712215                top: 86px;
    21722216        }
     
    25802624}
    25812625
    25822626#available-widgets-list {
    2583         top: 60px;
     2627        top: 82px;
    25842628        position: absolute;
    25852629        overflow: auto;
    25862630        bottom: 0;
     
    26242668#available-widgets-filter .search-icon {
    26252669        display: block;
    26262670        position: absolute;
    2627         top: 15px; /* 13 container padding +1 input margin +1 input border */
     2671        bottom: 15px; /* 13 container padding +1 input margin +1 input border */
    26282672        left: 16px;
    26292673        width: 30px;
    26302674        height: 30px;
     
    26342678}
    26352679
    26362680#available-widgets-filter .clear-results,
    2637 #available-menu-items-search .clear-results {
     2681#available-menu-items-search .accordion-section-title .clear-results {
    26382682        position: absolute;
    2639         top: 15px; /* 13 container padding +1 input margin +1 input border */
     2683        top: 36px; /* 13 container padding +1 input margin +1 input border */
    26402684        right: 16px;
    26412685        width: 30px;
    26422686        height: 30px;
     
    26952739
    26962740.themes-filter-bar .search-icon {
    26972741        position: absolute;
    2698         top: 7px;
    2699         left: 26px;
     2742        top: 2px;
     2743        left: 2px;
    27002744        z-index: 1;
    27012745        color: #646970;
    27022746        height: 30px;
     
    28142858                margin-top: 12px;
    28152859        }
    28162860
    2817         .wp-core-ui .themes-filter-bar .feature-filter-toggle {
    2818                 margin: 3px 0 3px 25px;
     2861        .customize-preview-header.themes-filter-bar .search-icon {
     2862                top: 6px;
    28192863        }
    28202864}
    28212865
     
    29522996        }
    29532997
    29542998        #available-widgets-list {
    2955                 top: 130px;
     2999                top: 152px;
    29563000        }
    29573001
    2958         #available-menu-items-search .clear-results,
    2959         #available-menu-items-search .search-icon {
    2960                 top: 85px; /* 70 section title height + 13 container padding +1 input margin +1 input border */
     3002        #available-menu-items-search .clear-results {
     3003                top: 36px;
     3004                right: 16px;
    29613005        }
    29623006
    29633007        .reorder,
     
    29643008        .reordering .reorder-done {
    29653009                padding: 8px;
    29663010        }
    2967 
    2968         .wp-core-ui .themes-filter-bar .feature-filter-toggle {
    2969                 margin: 0;
    2970         }
    29713011}
    29723012
    29733013@media screen and (max-width: 600px) {
  • src/wp-admin/css/customize-nav-menus.css

     
    557557
    558558#available-menu-items .accordion-section-title .no-items,
    559559#available-menu-items .cannot-expand .accordion-section-title .spinner,
    560 #available-menu-items .cannot-expand .accordion-section-title > button {
     560#available-menu-items .cannot-expand .accordion-section-title > button:not(#available-menu-items-search button.is-visible) {
    561561        display: none;
    562562}
    563563
     
    581581}
    582582
    583583#available-menu-items .accordion-section-content .available-menu-items-list {
    584         margin: 0 0 45px;
     584        margin: 0 0 64px;
    585585        padding: 1px 15px 15px;
    586586}
    587587
     
    680680
    681681#available-menu-items-search .spinner {
    682682        position: absolute;
    683         top: 20px; /* 13 container padding +1 input margin +6 ( ( 32 input height - 20 spinner height ) / 2 ) */
     683        bottom: 20px; /* 13 container padding +1 input margin +6 ( ( 32 input height - 20 spinner height ) / 2 ) */
    684684        right: 21px;
    685685        margin: 0 !important;
    686686}
     
    689689#available-menu-items #available-menu-items-search .accordion-section-content {
    690690        position: absolute;
    691691        left: 0;
    692         top: 60px; /* below title div / search input */
     692        top: 75px; /* below title div / search input */
    693693        bottom: 0; /* 100% height that still triggers lazy load */
    694694        max-height: none;
    695695        width: 100%;
     
    878878
    879879@media screen and (max-width: 640px) {
    880880        #available-menu-items #available-menu-items-search .accordion-section-content {
    881                 top: 130px;
     881                top: 146px;
    882882        }
    883883}
  • src/wp-admin/css/forms.css

     
    720720}
    721721
    722722p.search-box {
     723        display: flex;
     724        flex-wrap: wrap;
     725        align-items: center;
     726        column-gap: 0.5rem;
     727        position: relative;
    723728        float: right;
    724         margin: 0;
     729        margin: 11px 0;
    725730}
    726731
    727732.network-admin.themes-php p.search-box {
  • src/wp-admin/css/media.css

     
    585585}
    586586
    587587.media-frame-content .media-search-input-label {
    588         margin: 0 .2em 0 0;
    589588        vertical-align: baseline;
    590589}
    591590
    592 .media-frame.mode-grid .media-search-input-label {
    593         position: static;
    594         margin: 0 .5em 0 0;
    595 }
    596 
    597591.attachments-browser .media-toolbar-secondary > .media-button {
    598592        margin-right: 10px;
    599593}
     
    13731367                width: 100%;
    13741368                margin-bottom: 20px;
    13751369                display: flex;
     1370                flex-wrap: nowrap;
     1371                column-gap: 0;
    13761372        }
    13771373
     1374        .wp-filter p.search-box #media-search-input {
     1375                width: 100%;
     1376        }
     1377
    13781378}
    13791379
    13801380@media only screen and (max-width: 782px) {
  • src/wp-admin/includes/class-wp-plugins-list-table.php

     
    453453                }
    454454                ?>
    455455                <p class="search-box">
    456                         <label class="screen-reader-text" for="<?php echo esc_attr( $input_id ); ?>"><?php echo $text; ?>:</label>
    457                         <input type="search" id="<?php echo esc_attr( $input_id ); ?>" class="wp-filter-search" name="s" value="<?php _admin_search_query(); ?>" placeholder="<?php esc_attr_e( 'Search installed plugins...' ); ?>" />
     456                        <label for="<?php echo esc_attr( $input_id ); ?>"><?php echo $text; ?></label>
     457                        <input type="search" id="<?php echo esc_attr( $input_id ); ?>" class="wp-filter-search" name="s" value="<?php _admin_search_query(); ?>" />
    458458                        <?php submit_button( $text, 'hide-if-js', '', false, array( 'id' => 'search-submit' ) ); ?>
    459459                </p>
    460460                <?php
  • src/wp-admin/includes/plugin-install.php

     
    320320        ?>
    321321        <form class="search-form search-plugins" method="get">
    322322                <input type="hidden" name="tab" value="search" />
     323                <label for="search-plugins"><?php _e( 'Search Plugins' ); ?></label>
     324                <input type="search" name="s" id="search-plugins" value="<?php echo esc_attr( $term ); ?>" class="wp-filter-search" />
    323325                <label class="screen-reader-text" for="typeselector">
    324326                        <?php
    325327                        /* translators: Hidden accessibility text. */
     
    331333                        <option value="author"<?php selected( 'author', $type ); ?>><?php _e( 'Author' ); ?></option>
    332334                        <option value="tag"<?php selected( 'tag', $type ); ?>><?php _ex( 'Tag', 'Plugin Installer' ); ?></option>
    333335                </select>
    334                 <label class="screen-reader-text" for="search-plugins">
    335                         <?php
    336                         /* translators: Hidden accessibility text. */
    337                         _e( 'Search Plugins' );
    338                         ?>
    339                 </label>
    340                 <input type="search" name="s" id="search-plugins" value="<?php echo esc_attr( $term ); ?>" class="wp-filter-search" placeholder="<?php esc_attr_e( 'Search plugins...' ); ?>" />
    341336                <?php submit_button( __( 'Search Plugins' ), 'hide-if-js', false, false, array( 'id' => 'search-submit' ) ); ?>
    342337        </form>
    343338        <?php
  • src/wp-admin/plugins.php

     
    790790<?php $wp_list_table->views(); ?>
    791791
    792792<form class="search-form search-plugins" method="get">
    793 <?php $wp_list_table->search_box( __( 'Search Installed Plugins' ), 'plugin' ); ?>
     793<?php $wp_list_table->search_box( __( 'Search installed plugins' ), 'plugin' ); ?>
    794794</form>
    795795
    796796<form method="post" id="bulk-action-form">
  • src/wp-includes/class-wp-customize-control.php

     
    635635                                                printf( __( '+ %s' ), get_post_type_object( 'page' )->labels->add_new_item );
    636636                                                ?>
    637637                                        </button>
    638                                         <div class="new-content-item">
    639                                                 <label for="create-input-<?php echo esc_attr( $this->id ); ?>"><span class="screen-reader-text">
    640                                                         <?php
    641                                                         /* translators: Hidden accessibility text. */
    642                                                         _e( 'New page title' );
    643                                                         ?>
    644                                                 </span></label>
    645                                                 <input type="text" id="create-input-<?php echo esc_attr( $this->id ); ?>" class="create-item-input" placeholder="<?php esc_attr_e( 'New page title&hellip;' ); ?>">
    646                                                 <button type="button" class="button add-content"><?php _e( 'Add' ); ?></button>
     638                                        <div class="new-content-item-wrapper">
     639                                                <label for="create-input-<?php echo esc_attr( $this->id ); ?>"><?php _e( 'New page title' ); ?></label>
     640                                                <div class="new-content-item">
     641                                                        <input type="text" id="create-input-<?php echo esc_attr( $this->id ); ?>" class="create-item-input" >
     642                                                        <button type="button" class="button add-content"><?php _e( 'Add' ); ?></button>
     643                                                </div>
    647644                                        </div>
    648645                                <?php endif; ?>
    649646                                <?php
  • src/wp-includes/class-wp-customize-nav-menus.php

     
    11631163                        </div>
    11641164                        <div id="available-menu-items-search" class="accordion-section cannot-expand">
    11651165                                <div class="accordion-section-title">
    1166                                         <label class="screen-reader-text" for="menu-items-search">
    1167                                                 <?php
    1168                                                 /* translators: Hidden accessibility text. */
    1169                                                 _e( 'Search Menu Items' );
    1170                                                 ?>
    1171                                         </label>
    1172                                         <input type="text" id="menu-items-search" placeholder="<?php esc_attr_e( 'Search menu items&hellip;' ); ?>" aria-describedby="menu-items-search-desc" />
     1166                                        <label for="menu-items-search"><?php _e( 'Search Menu Items' ); ?></label>
     1167                                        <input type="text" id="menu-items-search" aria-describedby="menu-items-search-desc" />
    11731168                                        <p class="screen-reader-text" id="menu-items-search-desc">
    11741169                                                <?php
    11751170                                                /* translators: Hidden accessibility text. */
     
    11771172                                                ?>
    11781173                                        </p>
    11791174                                        <span class="spinner"></span>
     1175                                        <div class="search-icon" aria-hidden="true"></div>
     1176                                        <button type="button" class="clear-results"><span class="screen-reader-text">
     1177                                                <?php
     1178                                                /* translators: Hidden accessibility text. */
     1179                                                _e( 'Clear Results' );
     1180                                                ?>
     1181                                        </span></button>
    11801182                                </div>
    1181                                 <div class="search-icon" aria-hidden="true"></div>
    1182                                 <button type="button" class="clear-results"><span class="screen-reader-text">
    1183                                         <?php
    1184                                         /* translators: Hidden accessibility text. */
    1185                                         _e( 'Clear Results' );
    1186                                         ?>
    1187                                 </span></button>
    11881183                                <ul class="accordion-section-content available-menu-items-list" data-type="search"></ul>
    11891184                        </div>
    11901185                        <?php
     
    12431238                                <?php if ( 'post_type' === $available_item_type['type'] ) : ?>
    12441239                                        <?php $post_type_obj = get_post_type_object( $available_item_type['object'] ); ?>
    12451240                                        <?php if ( current_user_can( $post_type_obj->cap->create_posts ) && current_user_can( $post_type_obj->cap->publish_posts ) ) : ?>
    1246                                                 <div class="new-content-item">
    1247                                                         <label for="<?php echo esc_attr( 'create-item-input-' . $available_item_type['object'] ); ?>" class="screen-reader-text"><?php echo esc_html( $post_type_obj->labels->add_new_item ); ?></label>
    1248                                                         <input type="text" id="<?php echo esc_attr( 'create-item-input-' . $available_item_type['object'] ); ?>" class="create-item-input" placeholder="<?php echo esc_attr( $post_type_obj->labels->add_new_item ); ?>">
    1249                                                         <button type="button" class="button add-content"><?php _e( 'Add' ); ?></button>
     1241                                                <div class="new-content-item-wrapper">
     1242                                                        <label for="<?php echo esc_attr( 'create-item-input-' . $available_item_type['object'] ); ?>"><?php echo esc_html( $post_type_obj->labels->add_new_item ); ?></label>
     1243                                                        <div class="new-content-item">
     1244                                                                <input type="text" id="<?php echo esc_attr( 'create-item-input-' . $available_item_type['object'] ); ?>" class="create-item-input">
     1245                                                                <button type="button" class="button add-content"><?php _e( 'Add' ); ?></button>
     1246                                                        </div>
    12501247                                                </div>
    12511248                                        <?php endif; ?>
    12521249                                <?php endif; ?>
  • src/wp-includes/class-wp-customize-widgets.php

     
    909909                                </h3>
    910910                        </div>
    911911                        <div id="available-widgets-filter">
    912                                 <label class="screen-reader-text" for="widgets-search">
     912                                <label for="widgets-search">
    913913                                        <?php
    914914                                        /* translators: Hidden accessibility text. */
    915915                                        _e( 'Search Widgets' );
    916916                                        ?>
    917917                                </label>
    918                                 <input type="text" id="widgets-search" placeholder="<?php esc_attr_e( 'Search widgets&hellip;' ); ?>" aria-describedby="widgets-search-desc" />
     918                                <input type="text" id="widgets-search" aria-describedby="widgets-search-desc" />
    919919                                <div class="search-icon" aria-hidden="true"></div>
    920920                                <button type="button" class="clear-results"><span class="screen-reader-text">
    921921                                        <?php
  • src/wp-includes/css/editor.css

     
    17371737        color: #d63638;
    17381738}
    17391739
     1740.mce-inline-toolbar-grp div.mce-flow-layout-item > div {
     1741        display: flex;
     1742        align-items: flex-end;
     1743}
     1744
    17401745div.wp-link-input {
    17411746        float: left;
    17421747        margin: 2px;
     
    17431748        max-width: 694px;
    17441749}
    17451750
     1751div.wp-link-input label {
     1752        margin-bottom: 4px;
     1753        display: block;
     1754}
     1755
    17461756div.wp-link-input input {
    17471757        width: 300px;
    17481758        padding: 3px;
  • src/wp-includes/css/media-views.css

     
    12091209        display: flex;
    12101210        align-items: center;
    12111211        column-gap: .5rem;
     1212        margin: 11px 0;
    12121213}
    12131214
    12141215.mode-grid .attachments-browser .media-toolbar-mode-select .media-toolbar-primary {
     
    28022803        }
    28032804
    28042805        .mode-grid .attachments-browser .media-toolbar-primary {
    2805                 display: flex;
     2806                display: grid;
     2807                grid-template-columns: auto 1fr;
    28062808        }
    28072809
    28082810        .mode-grid .attachments-browser .media-toolbar-primary input[type="search"] {
  • src/wp-includes/customize/class-wp-customize-themes-section.php

     
    124124                <button type="button" class="button button-primary customize-section-back customize-themes-mobile-back"><?php _e( 'Go to theme sources' ); ?></button>
    125125                <# if ( 'wporg' === data.action ) { #>
    126126                        <div class="search-form">
    127                                 <label for="wp-filter-search-input-{{ data.id }}" class="screen-reader-text">
    128                                         <?php
    129                                         /* translators: Hidden accessibility text. */
    130                                         _e( 'Search themes&hellip;' );
    131                                         ?>
    132                                 </label>
    133                                 <input type="search" id="wp-filter-search-input-{{ data.id }}" placeholder="<?php esc_attr_e( 'Search themes&hellip;' ); ?>" aria-describedby="{{ data.id }}-live-search-desc" class="wp-filter-search">
    134                                 <div class="search-icon" aria-hidden="true"></div>
    135                                 <span id="{{ data.id }}-live-search-desc" class="screen-reader-text">
    136                                         <?php
    137                                         /* translators: Hidden accessibility text. */
    138                                         _e( 'The search results will be updated as you type.' );
    139                                         ?>
    140                                 </span>
     127                                <label for="wp-filter-search-input-{{ data.id }}"><?php _e( 'Search themes' ); ?></label>
     128                                <div class="search-form-input">
     129                                        <input type="search" id="wp-filter-search-input-{{ data.id }}" aria-describedby="{{ data.id }}-live-search-desc" class="wp-filter-search">
     130                                        <div class="search-icon" aria-hidden="true"></div>
     131                                        <span id="{{ data.id }}-live-search-desc" class="screen-reader-text">
     132                                                <?php
     133                                                /* translators: Hidden accessibility text. */
     134                                                _e( 'The search results will be updated as you type.' );
     135                                                ?>
     136                                        </span>
     137                                </div>
    141138                        </div>
     139                <# } else { #>
     140                        <div class="themes-filter-container">
     141                                <label for="{{ data.id }}-themes-filter"><?php _e( 'Search themes' ); ?></label>
     142                                <div class="search-form-input">
     143                                        <input type="search" id="{{ data.id }}-themes-filter" aria-describedby="{{ data.id }}-live-search-desc" class="wp-filter-search wp-filter-search-themes" />
     144                                        <div class="search-icon" aria-hidden="true"></div>
     145                                        <span id="{{ data.id }}-live-search-desc" class="screen-reader-text">
     146                                                <?php
     147                                                /* translators: Hidden accessibility text. */
     148                                                _e( 'The search results will be updated as you type.' );
     149                                                ?>
     150                                        </span>
     151                                </div>
     152                        </div>
     153                <# } #>
     154                <div class="filter-themes-wrapper">
     155                        <# if ( 'wporg' === data.action ) { #>
    142156                        <button type="button" class="button feature-filter-toggle">
    143157                                <span class="filter-count-0"><?php _e( 'Filter themes' ); ?></span><span class="filter-count-filters">
    144158                                        <?php
     
    147161                                        ?>
    148162                                </span>
    149163                        </button>
    150                 <# } else { #>
    151                         <div class="themes-filter-container">
    152                                 <label for="{{ data.id }}-themes-filter" class="screen-reader-text">
     164                        <# } #>
     165                        <div class="filter-themes-count">
     166                                <span class="themes-displayed">
    153167                                        <?php
    154                                         /* translators: Hidden accessibility text. */
    155                                         _e( 'Search themes&hellip;' );
     168                                        /* translators: %s: Number of themes displayed. */
     169                                        printf( __( '%s themes' ), '<span class="theme-count">0</span>' );
    156170                                        ?>
    157                                 </label>
    158                                 <input type="search" id="{{ data.id }}-themes-filter" placeholder="<?php esc_attr_e( 'Search themes&hellip;' ); ?>" aria-describedby="{{ data.id }}-live-search-desc" class="wp-filter-search wp-filter-search-themes" />
    159                                 <div class="search-icon" aria-hidden="true"></div>
    160                                 <span id="{{ data.id }}-live-search-desc" class="screen-reader-text">
    161                                         <?php
    162                                         /* translators: Hidden accessibility text. */
    163                                         _e( 'The search results will be updated as you type.' );
    164                                         ?>
    165171                                </span>
    166172                        </div>
    167                 <# } #>
    168                 <div class="filter-themes-count">
    169                         <span class="themes-displayed">
    170                                 <?php
    171                                 /* translators: %s: Number of themes displayed. */
    172                                 printf( __( '%s themes' ), '<span class="theme-count">0</span>' );
    173                                 ?>
    174                         </span>
    175173                </div>
    176174                <?php
    177175        }
  • src/wp-includes/media.php

     
    48334833                'apply'                       => __( 'Apply' ),
    48344834                'filterByDate'                => __( 'Filter by date' ),
    48354835                'filterByType'                => __( 'Filter by type' ),
    4836                 'searchLabel'                 => __( 'Search' ),
     4836                'searchLabel'                 => __( 'Search media' ),
    48374837                'searchMediaLabel'            => __( 'Search media' ),          // Backward compatibility pre-5.3.
    48384838                'searchMediaPlaceholder'      => __( 'Search media items...' ), // Placeholder (no ellipsis), backward compatibility pre-5.3.
    48394839                /* translators: %d: Number of attachments found in a search. */