Administration: A11y: Replace placeholders with visible labels.

Add visible labels to inputs that are using placeholder attributes as a substitute for visible labeling.

Labels added or made visible on the customizer theme search, customizer widget search, customizer menu item search, customizer new page UI, the search plugins screens, the media search screens, and the classic editor link inserter.

Props afercia, joedolson, rcreators, sabernhardt.
See #40331.
Built from https://develop.svn.wordpress.org/trunk@58146


git-svn-id: http://core.svn.wordpress.org/trunk@57611 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
joedolson 2024-05-14 16:49:09 +00:00
parent f57368d7ed
commit 79045fa10e
43 changed files with 330 additions and 211 deletions

View File

@ -1091,7 +1091,9 @@ th.action-links {
.wp-filter .search-form {
float: left;
margin: 10px 0;
display: flex;
align-items: center;
column-gap: .5rem;
}
.wp-filter .search-form input[type="search"] {
@ -1120,7 +1122,6 @@ th.action-links {
.wp-filter .search-form.search-plugins .wp-filter-search,
.no-js .wp-filter .search-form.search-plugins .button {
display: inline-block;
margin-top: 10px;
vertical-align: top;
}
@ -1361,6 +1362,11 @@ th.action-links {
position: relative;
max-width: 100%;
}
.wp-filter .search-form {
margin: 11px 0;
flex-wrap: wrap;
row-gap: 10px;
}
}
@media only screen and (max-width: 782px) {
@ -4152,7 +4158,6 @@ img {
}
.wp-filter .search-form input[type="search"] {
width: 100%;
font-size: 1rem;
}
@ -4206,6 +4211,10 @@ img {
.nav-tab-active:focus:active {
border-bottom: 1px solid #c3c4c7;
}
.wp-filter .search-form.search-plugins label {
width: 100%;
}
}
@media screen and (max-width: 480px) {

File diff suppressed because one or more lines are too long

View File

@ -1090,7 +1090,9 @@ th.action-links {
.wp-filter .search-form {
float: right;
margin: 10px 0;
display: flex;
align-items: center;
column-gap: .5rem;
}
.wp-filter .search-form input[type="search"] {
@ -1119,7 +1121,6 @@ th.action-links {
.wp-filter .search-form.search-plugins .wp-filter-search,
.no-js .wp-filter .search-form.search-plugins .button {
display: inline-block;
margin-top: 10px;
vertical-align: top;
}
@ -1360,6 +1361,11 @@ th.action-links {
position: relative;
max-width: 100%;
}
.wp-filter .search-form {
margin: 11px 0;
flex-wrap: wrap;
row-gap: 10px;
}
}
@media only screen and (max-width: 782px) {
@ -4151,7 +4157,6 @@ img {
}
.wp-filter .search-form input[type="search"] {
width: 100%;
font-size: 1rem;
}
@ -4205,6 +4210,10 @@ img {
.nav-tab-active:focus:active {
border-bottom: 1px solid #c3c4c7;
}
.wp-filter .search-form.search-plugins label {
width: 100%;
}
}
@media screen and (max-width: 480px) {

File diff suppressed because one or more lines are too long

View File

@ -1083,14 +1083,24 @@ p.customize-section-description {
float: right;
}
#available-menu-items .accordion-section-content .new-content-item,
.customize-control-dropdown-pages .new-content-item {
#available-menu-items .accordion-section-content .new-content-item-wrapper,
.customize-control-dropdown-pages .new-content-item-wrapper {
width: calc(100% - 30px);
padding: 8px 15px;
position: absolute;
bottom: 0;
z-index: 10;
background: #f0f0f1;
}
.customize-control-dropdown-pages .new-content-item-wrapper {
width: 100%;
padding: 0;
position: static;
}
#available-menu-items .accordion-section-content .new-content-item,
.customize-control-dropdown-pages .new-content-item {
display: flex;
}
@ -1100,6 +1110,14 @@ p.customize-section-description {
position: relative;
}
.customize-control-dropdown-pages .new-content-item-wrapper .new-content-item {
padding: 0;
}
.customize-control-dropdown-pages .new-content-item-wrapper .new-content-item label {
line-height: 1.6;
}
#available-menu-items .new-content-item .create-item-input,
.customize-control-dropdown-pages .new-content-item .create-item-input {
flex-grow: 10;
@ -1816,11 +1834,6 @@ p.customize-section-description {
bottom: 0;
}
.themes-filter-bar .feature-filter-toggle {
float: left;
margin: 3px 25px 3px 0;
}
.themes-filter-bar .feature-filter-toggle:before {
content: "\f111";
margin: 0 0 0 5px;
@ -1881,12 +1894,6 @@ p.customize-section-description {
animation: .6s themes-fade-in 1;
}
.control-panel-themes .filter-themes-count {
position: relative;
float: left;
line-height: 2.6;
}
.control-panel-themes .filter-themes-count .themes-displayed {
font-weight: 600;
color: #50575e;
@ -2098,6 +2105,28 @@ p.customize-section-description {
box-sizing: border-box;
border-bottom: 1px solid #dcdcde;
}
.customize-preview-header.themes-filter-bar,
.customize-preview-header.themes-filter-bar .search-form {
display: flex;
align-items: center;
gap: 10px;
flex-wrap: wrap;
}
.customize-preview-header.themes-filter-bar .search-form-input {
position: relative;
}
.customize-preview-header .filter-themes-wrapper {
display: grid;
align-items: center;
gap: 10px;
grid-template-columns: auto 1fr;
}
.customize-preview-header .filter-themes-wrapper .filter-themes-count {
justify-self: end;
}
@media screen and (min-width: 1670px) {
.customize-preview-header.themes-filter-bar {
@ -2110,6 +2139,9 @@ p.customize-section-description {
.themes-filter-bar .themes-filter-container {
margin: 0;
padding: 0;
display: flex;
align-items: center;
gap: 10px;
}
.themes-filter-bar .wp-filter-search {
@ -2118,11 +2150,10 @@ p.customize-section-description {
max-width: 100%;
width: 40%;
min-width: 300px;
position: absolute;
top: 6px;
right: 25px;
height: 32px;
margin: 1px 0;
top: 0;
right: 0;
}
/* Unstick the filter bar on short windows/screens. This breakpoint is based on the
@ -2156,18 +2187,31 @@ p.customize-section-description {
}
}
@media screen and (max-width: 900px) {
@media screen and (max-width: 960px) {
.customize-preview-header.themes-filter-bar {
height: 86px;
padding-top: 46px;
height: 96px;
}
}
@media screen and (max-width: 900px) {
.themes-filter-bar .wp-filter-search {
width: calc(100% - 50px);
width: 100%;
margin: 0;
min-width: 200px;
}
.customize-preview-header.themes-filter-bar,
.customize-preview-header.themes-filter-bar .search-form
.themes-filter-bar .themes-filter-container {
display: grid;
gap: 4px;
}
.customize-preview-header.themes-filter-bar .search-form-input {
display: flex;
flex-grow: 1;
}
.filter-drawer {
top: 86px;
}
@ -2581,7 +2625,7 @@ body.adding-widget .add-new-widget:before,
}
#available-widgets-list {
top: 60px;
top: 82px;
position: absolute;
overflow: auto;
bottom: 0;
@ -2625,7 +2669,7 @@ body.adding-widget .add-new-widget:before,
#available-widgets-filter .search-icon {
display: block;
position: absolute;
top: 15px; /* 13 container padding +1 input margin +1 input border */
bottom: 15px; /* 13 container padding +1 input margin +1 input border */
right: 16px;
width: 30px;
height: 30px;
@ -2635,9 +2679,9 @@ body.adding-widget .add-new-widget:before,
}
#available-widgets-filter .clear-results,
#available-menu-items-search .clear-results {
#available-menu-items-search .accordion-section-title .clear-results {
position: absolute;
top: 15px; /* 13 container padding +1 input margin +1 input border */
top: 36px; /* 13 container padding +1 input margin +1 input border */
left: 16px;
width: 30px;
height: 30px;
@ -2696,8 +2740,8 @@ body.adding-widget .add-new-widget:before,
.themes-filter-bar .search-icon {
position: absolute;
top: 7px;
right: 26px;
top: 2px;
right: 2px;
z-index: 1;
color: #646970;
height: 30px;
@ -2815,8 +2859,8 @@ body.adding-widget .add-new-widget:before,
margin-top: 12px;
}
.wp-core-ui .themes-filter-bar .feature-filter-toggle {
margin: 3px 25px 3px 0;
.customize-preview-header.themes-filter-bar .search-icon {
top: 6px;
}
}
@ -2953,22 +2997,18 @@ body.adding-widget .add-new-widget:before,
}
#available-widgets-list {
top: 130px;
top: 152px;
}
#available-menu-items-search .clear-results,
#available-menu-items-search .search-icon {
top: 85px; /* 70 section title height + 13 container padding +1 input margin +1 input border */
#available-menu-items-search .clear-results {
top: 36px;
left: 16px;
}
.reorder,
.reordering .reorder-done {
padding: 8px;
}
.wp-core-ui .themes-filter-bar .feature-filter-toggle {
margin: 0;
}
}
@media screen and (max-width: 600px) {

File diff suppressed because one or more lines are too long

View File

@ -1082,14 +1082,24 @@ p.customize-section-description {
float: left;
}
#available-menu-items .accordion-section-content .new-content-item,
.customize-control-dropdown-pages .new-content-item {
#available-menu-items .accordion-section-content .new-content-item-wrapper,
.customize-control-dropdown-pages .new-content-item-wrapper {
width: calc(100% - 30px);
padding: 8px 15px;
position: absolute;
bottom: 0;
z-index: 10;
background: #f0f0f1;
}
.customize-control-dropdown-pages .new-content-item-wrapper {
width: 100%;
padding: 0;
position: static;
}
#available-menu-items .accordion-section-content .new-content-item,
.customize-control-dropdown-pages .new-content-item {
display: flex;
}
@ -1099,6 +1109,14 @@ p.customize-section-description {
position: relative;
}
.customize-control-dropdown-pages .new-content-item-wrapper .new-content-item {
padding: 0;
}
.customize-control-dropdown-pages .new-content-item-wrapper .new-content-item label {
line-height: 1.6;
}
#available-menu-items .new-content-item .create-item-input,
.customize-control-dropdown-pages .new-content-item .create-item-input {
flex-grow: 10;
@ -1815,11 +1833,6 @@ p.customize-section-description {
bottom: 0;
}
.themes-filter-bar .feature-filter-toggle {
float: right;
margin: 3px 0 3px 25px;
}
.themes-filter-bar .feature-filter-toggle:before {
content: "\f111";
margin: 0 5px 0 0;
@ -1880,12 +1893,6 @@ p.customize-section-description {
animation: .6s themes-fade-in 1;
}
.control-panel-themes .filter-themes-count {
position: relative;
float: right;
line-height: 2.6;
}
.control-panel-themes .filter-themes-count .themes-displayed {
font-weight: 600;
color: #50575e;
@ -2097,6 +2104,28 @@ p.customize-section-description {
box-sizing: border-box;
border-bottom: 1px solid #dcdcde;
}
.customize-preview-header.themes-filter-bar,
.customize-preview-header.themes-filter-bar .search-form {
display: flex;
align-items: center;
gap: 10px;
flex-wrap: wrap;
}
.customize-preview-header.themes-filter-bar .search-form-input {
position: relative;
}
.customize-preview-header .filter-themes-wrapper {
display: grid;
align-items: center;
gap: 10px;
grid-template-columns: auto 1fr;
}
.customize-preview-header .filter-themes-wrapper .filter-themes-count {
justify-self: end;
}
@media screen and (min-width: 1670px) {
.customize-preview-header.themes-filter-bar {
@ -2109,6 +2138,9 @@ p.customize-section-description {
.themes-filter-bar .themes-filter-container {
margin: 0;
padding: 0;
display: flex;
align-items: center;
gap: 10px;
}
.themes-filter-bar .wp-filter-search {
@ -2117,11 +2149,10 @@ p.customize-section-description {
max-width: 100%;
width: 40%;
min-width: 300px;
position: absolute;
top: 6px;
left: 25px;
height: 32px;
margin: 1px 0;
top: 0;
left: 0;
}
/* Unstick the filter bar on short windows/screens. This breakpoint is based on the
@ -2155,18 +2186,31 @@ p.customize-section-description {
}
}
@media screen and (max-width: 900px) {
@media screen and (max-width: 960px) {
.customize-preview-header.themes-filter-bar {
height: 86px;
padding-top: 46px;
height: 96px;
}
}
@media screen and (max-width: 900px) {
.themes-filter-bar .wp-filter-search {
width: calc(100% - 50px);
width: 100%;
margin: 0;
min-width: 200px;
}
.customize-preview-header.themes-filter-bar,
.customize-preview-header.themes-filter-bar .search-form
.themes-filter-bar .themes-filter-container {
display: grid;
gap: 4px;
}
.customize-preview-header.themes-filter-bar .search-form-input {
display: flex;
flex-grow: 1;
}
.filter-drawer {
top: 86px;
}
@ -2580,7 +2624,7 @@ body.adding-widget .add-new-widget:before,
}
#available-widgets-list {
top: 60px;
top: 82px;
position: absolute;
overflow: auto;
bottom: 0;
@ -2624,7 +2668,7 @@ body.adding-widget .add-new-widget:before,
#available-widgets-filter .search-icon {
display: block;
position: absolute;
top: 15px; /* 13 container padding +1 input margin +1 input border */
bottom: 15px; /* 13 container padding +1 input margin +1 input border */
left: 16px;
width: 30px;
height: 30px;
@ -2634,9 +2678,9 @@ body.adding-widget .add-new-widget:before,
}
#available-widgets-filter .clear-results,
#available-menu-items-search .clear-results {
#available-menu-items-search .accordion-section-title .clear-results {
position: absolute;
top: 15px; /* 13 container padding +1 input margin +1 input border */
top: 36px; /* 13 container padding +1 input margin +1 input border */
right: 16px;
width: 30px;
height: 30px;
@ -2695,8 +2739,8 @@ body.adding-widget .add-new-widget:before,
.themes-filter-bar .search-icon {
position: absolute;
top: 7px;
left: 26px;
top: 2px;
left: 2px;
z-index: 1;
color: #646970;
height: 30px;
@ -2814,8 +2858,8 @@ body.adding-widget .add-new-widget:before,
margin-top: 12px;
}
.wp-core-ui .themes-filter-bar .feature-filter-toggle {
margin: 3px 0 3px 25px;
.customize-preview-header.themes-filter-bar .search-icon {
top: 6px;
}
}
@ -2952,22 +2996,18 @@ body.adding-widget .add-new-widget:before,
}
#available-widgets-list {
top: 130px;
top: 152px;
}
#available-menu-items-search .clear-results,
#available-menu-items-search .search-icon {
top: 85px; /* 70 section title height + 13 container padding +1 input margin +1 input border */
#available-menu-items-search .clear-results {
top: 36px;
right: 16px;
}
.reorder,
.reordering .reorder-done {
padding: 8px;
}
.wp-core-ui .themes-filter-bar .feature-filter-toggle {
margin: 0;
}
}
@media screen and (max-width: 600px) {

File diff suppressed because one or more lines are too long

View File

@ -558,7 +558,7 @@
#available-menu-items .accordion-section-title .no-items,
#available-menu-items .cannot-expand .accordion-section-title .spinner,
#available-menu-items .cannot-expand .accordion-section-title > button {
#available-menu-items .cannot-expand .accordion-section-title > button:not(#available-menu-items-search button.is-visible) {
display: none;
}
@ -582,7 +582,7 @@
}
#available-menu-items .accordion-section-content .available-menu-items-list {
margin: 0 0 45px;
margin: 0 0 64px;
padding: 1px 15px 15px;
}
@ -681,7 +681,7 @@
#available-menu-items-search .spinner {
position: absolute;
top: 20px; /* 13 container padding +1 input margin +6 ( ( 32 input height - 20 spinner height ) / 2 ) */
bottom: 20px; /* 13 container padding +1 input margin +6 ( ( 32 input height - 20 spinner height ) / 2 ) */
left: 21px;
margin: 0 !important;
}
@ -690,7 +690,7 @@
#available-menu-items #available-menu-items-search .accordion-section-content {
position: absolute;
right: 0;
top: 60px; /* below title div / search input */
top: 75px; /* below title div / search input */
bottom: 0; /* 100% height that still triggers lazy load */
max-height: none;
width: 100%;
@ -879,6 +879,6 @@ li.assigned-to-menu-location .add-new-menu-item {
@media screen and (max-width: 640px) {
#available-menu-items #available-menu-items-search .accordion-section-content {
top: 130px;
top: 146px;
}
}

File diff suppressed because one or more lines are too long

View File

@ -557,7 +557,7 @@
#available-menu-items .accordion-section-title .no-items,
#available-menu-items .cannot-expand .accordion-section-title .spinner,
#available-menu-items .cannot-expand .accordion-section-title > button {
#available-menu-items .cannot-expand .accordion-section-title > button:not(#available-menu-items-search button.is-visible) {
display: none;
}
@ -581,7 +581,7 @@
}
#available-menu-items .accordion-section-content .available-menu-items-list {
margin: 0 0 45px;
margin: 0 0 64px;
padding: 1px 15px 15px;
}
@ -680,7 +680,7 @@
#available-menu-items-search .spinner {
position: absolute;
top: 20px; /* 13 container padding +1 input margin +6 ( ( 32 input height - 20 spinner height ) / 2 ) */
bottom: 20px; /* 13 container padding +1 input margin +6 ( ( 32 input height - 20 spinner height ) / 2 ) */
right: 21px;
margin: 0 !important;
}
@ -689,7 +689,7 @@
#available-menu-items #available-menu-items-search .accordion-section-content {
position: absolute;
left: 0;
top: 60px; /* below title div / search input */
top: 75px; /* below title div / search input */
bottom: 0; /* 100% height that still triggers lazy load */
max-height: none;
width: 100%;
@ -878,6 +878,6 @@ li.assigned-to-menu-location .add-new-menu-item {
@media screen and (max-width: 640px) {
#available-menu-items #available-menu-items-search .accordion-section-content {
top: 130px;
top: 146px;
}
}

File diff suppressed because one or more lines are too long

View File

@ -721,8 +721,13 @@ fieldset label,
}
p.search-box {
display: flex;
flex-wrap: wrap;
align-items: center;
column-gap: 0.5rem;
position: relative;
float: left;
margin: 0;
margin: 11px 0;
}
.network-admin.themes-php p.search-box {

File diff suppressed because one or more lines are too long

View File

@ -720,8 +720,13 @@ fieldset label,
}
p.search-box {
display: flex;
flex-wrap: wrap;
align-items: center;
column-gap: 0.5rem;
position: relative;
float: right;
margin: 0;
margin: 11px 0;
}
.network-admin.themes-php p.search-box {

File diff suppressed because one or more lines are too long

View File

@ -586,15 +586,9 @@ border color while dragging a file over the uploader drop area */
}
.media-frame-content .media-search-input-label {
margin: 0 0 0 .2em;
vertical-align: baseline;
}
.media-frame.mode-grid .media-search-input-label {
position: static;
margin: 0 0 0 .5em;
}
.attachments-browser .media-toolbar-secondary > .media-button {
margin-left: 10px;
}
@ -1374,6 +1368,12 @@ audio, video {
width: 100%;
margin-bottom: 20px;
display: flex;
flex-wrap: nowrap;
column-gap: 0;
}
.wp-filter p.search-box #media-search-input {
width: 100%;
}
}

File diff suppressed because one or more lines are too long

View File

@ -585,15 +585,9 @@ border color while dragging a file over the uploader drop area */
}
.media-frame-content .media-search-input-label {
margin: 0 .2em 0 0;
vertical-align: baseline;
}
.media-frame.mode-grid .media-search-input-label {
position: static;
margin: 0 .5em 0 0;
}
.attachments-browser .media-toolbar-secondary > .media-button {
margin-right: 10px;
}
@ -1373,6 +1367,12 @@ audio, video {
width: 100%;
margin-bottom: 20px;
display: flex;
flex-wrap: nowrap;
column-gap: 0;
}
.wp-filter p.search-box #media-search-input {
width: 100%;
}
}

File diff suppressed because one or more lines are too long

View File

@ -453,8 +453,8 @@ class WP_Plugins_List_Table extends WP_List_Table {
}
?>
<p class="search-box">
<label class="screen-reader-text" for="<?php echo esc_attr( $input_id ); ?>"><?php echo $text; ?>:</label>
<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...' ); ?>" />
<label for="<?php echo esc_attr( $input_id ); ?>"><?php echo $text; ?></label>
<input type="search" id="<?php echo esc_attr( $input_id ); ?>" class="wp-filter-search" name="s" value="<?php _admin_search_query(); ?>" />
<?php submit_button( $text, 'hide-if-js', '', false, array( 'id' => 'search-submit' ) ); ?>
</p>
<?php

View File

@ -320,6 +320,8 @@ function install_search_form( $deprecated = true ) {
?>
<form class="search-form search-plugins" method="get">
<input type="hidden" name="tab" value="search" />
<label for="search-plugins"><?php _e( 'Search Plugins' ); ?></label>
<input type="search" name="s" id="search-plugins" value="<?php echo esc_attr( $term ); ?>" class="wp-filter-search" />
<label class="screen-reader-text" for="typeselector">
<?php
/* translators: Hidden accessibility text. */
@ -331,13 +333,6 @@ function install_search_form( $deprecated = true ) {
<option value="author"<?php selected( 'author', $type ); ?>><?php _e( 'Author' ); ?></option>
<option value="tag"<?php selected( 'tag', $type ); ?>><?php _ex( 'Tag', 'Plugin Installer' ); ?></option>
</select>
<label class="screen-reader-text" for="search-plugins">
<?php
/* translators: Hidden accessibility text. */
_e( 'Search Plugins' );
?>
</label>
<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...' ); ?>" />
<?php submit_button( __( 'Search Plugins' ), 'hide-if-js', false, false, array( 'id' => 'search-submit' ) ); ?>
</form>
<?php

View File

@ -1917,7 +1917,7 @@
section.contentContainer.on( 'click', '.feature-filter-toggle', function( e ) {
var $themeContainer = $( '.customize-themes-full-container' ),
$filterToggle = $( e.currentTarget );
section.filtersHeight = $filterToggle.parent().next( '.filter-drawer' ).height();
section.filtersHeight = $filterToggle.parents( '.themes-filter-bar' ).next( '.filter-drawer' ).height();
if ( 0 < $themeContainer.scrollTop() ) {
$themeContainer.animate( { scrollTop: 0 }, 400 );
@ -1932,7 +1932,7 @@
.attr( 'aria-expanded', function( i, attr ) {
return 'true' === attr ? 'false' : 'true';
})
.parent().next( '.filter-drawer' ).slideToggle( 180, 'linear' );
.parents( '.themes-filter-bar' ).next( '.filter-drawer' ).slideToggle( 180, 'linear' );
if ( $filterToggle.hasClass( 'open' ) ) {
var marginOffset = 1018 < window.innerWidth ? 50 : 76;
@ -3739,7 +3739,7 @@
ready: function() {
var control = this, newItem;
if ( 'dropdown-pages' === control.params.type && control.params.allow_addition ) {
newItem = control.container.find( '.new-content-item' );
newItem = control.container.find( '.new-content-item-wrapper' );
newItem.hide(); // Hide in JS to preserve flex display when showing.
control.container.on( 'click', '.add-new-toggle', function( e ) {
$( e.currentTarget ).slideUp( 180 );
@ -4085,7 +4085,7 @@
}
toggle = control.container.find( '.add-new-toggle' );
container = control.container.find( '.new-content-item' );
container = control.container.find( '.new-content-item-wrapper' );
input = control.container.find( '.create-item-input' );
title = input.val();
select = control.container.find( 'select' );

File diff suppressed because one or more lines are too long

View File

@ -790,7 +790,7 @@ do_action( 'pre_current_active_plugins', $plugins['all'] );
<?php $wp_list_table->views(); ?>
<form class="search-form search-plugins" method="get">
<?php $wp_list_table->search_box( __( 'Search Installed Plugins' ), 'plugin' ); ?>
<?php $wp_list_table->search_box( __( 'Search installed plugins' ), 'plugin' ); ?>
</form>
<form method="post" id="bulk-action-form">

View File

@ -635,15 +635,12 @@ class WP_Customize_Control {
printf( __( '+ %s' ), get_post_type_object( 'page' )->labels->add_new_item );
?>
</button>
<div class="new-content-item">
<label for="create-input-<?php echo esc_attr( $this->id ); ?>"><span class="screen-reader-text">
<?php
/* translators: Hidden accessibility text. */
_e( 'New page title' );
?>
</span></label>
<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;' ); ?>">
<button type="button" class="button add-content"><?php _e( 'Add' ); ?></button>
<div class="new-content-item-wrapper">
<label for="create-input-<?php echo esc_attr( $this->id ); ?>"><?php _e( 'New page title' ); ?></label>
<div class="new-content-item">
<input type="text" id="create-input-<?php echo esc_attr( $this->id ); ?>" class="create-item-input" >
<button type="button" class="button add-content"><?php _e( 'Add' ); ?></button>
</div>
</div>
<?php endif; ?>
<?php

View File

@ -1163,13 +1163,8 @@ final class WP_Customize_Nav_Menus {
</div>
<div id="available-menu-items-search" class="accordion-section cannot-expand">
<div class="accordion-section-title">
<label class="screen-reader-text" for="menu-items-search">
<?php
/* translators: Hidden accessibility text. */
_e( 'Search Menu Items' );
?>
</label>
<input type="text" id="menu-items-search" placeholder="<?php esc_attr_e( 'Search menu items&hellip;' ); ?>" aria-describedby="menu-items-search-desc" />
<label for="menu-items-search"><?php _e( 'Search Menu Items' ); ?></label>
<input type="text" id="menu-items-search" aria-describedby="menu-items-search-desc" />
<p class="screen-reader-text" id="menu-items-search-desc">
<?php
/* translators: Hidden accessibility text. */
@ -1177,14 +1172,14 @@ final class WP_Customize_Nav_Menus {
?>
</p>
<span class="spinner"></span>
<div class="search-icon" aria-hidden="true"></div>
<button type="button" class="clear-results"><span class="screen-reader-text">
<?php
/* translators: Hidden accessibility text. */
_e( 'Clear Results' );
?>
</span></button>
</div>
<div class="search-icon" aria-hidden="true"></div>
<button type="button" class="clear-results"><span class="screen-reader-text">
<?php
/* translators: Hidden accessibility text. */
_e( 'Clear Results' );
?>
</span></button>
<ul class="accordion-section-content available-menu-items-list" data-type="search"></ul>
</div>
<?php
@ -1243,10 +1238,12 @@ final class WP_Customize_Nav_Menus {
<?php if ( 'post_type' === $available_item_type['type'] ) : ?>
<?php $post_type_obj = get_post_type_object( $available_item_type['object'] ); ?>
<?php if ( current_user_can( $post_type_obj->cap->create_posts ) && current_user_can( $post_type_obj->cap->publish_posts ) ) : ?>
<div class="new-content-item">
<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>
<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 ); ?>">
<button type="button" class="button add-content"><?php _e( 'Add' ); ?></button>
<div class="new-content-item-wrapper">
<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>
<div class="new-content-item">
<input type="text" id="<?php echo esc_attr( 'create-item-input-' . $available_item_type['object'] ); ?>" class="create-item-input">
<button type="button" class="button add-content"><?php _e( 'Add' ); ?></button>
</div>
</div>
<?php endif; ?>
<?php endif; ?>

View File

@ -909,13 +909,13 @@ final class WP_Customize_Widgets {
</h3>
</div>
<div id="available-widgets-filter">
<label class="screen-reader-text" for="widgets-search">
<label for="widgets-search">
<?php
/* translators: Hidden accessibility text. */
_e( 'Search Widgets' );
?>
</label>
<input type="text" id="widgets-search" placeholder="<?php esc_attr_e( 'Search widgets&hellip;' ); ?>" aria-describedby="widgets-search-desc" />
<input type="text" id="widgets-search" aria-describedby="widgets-search-desc" />
<div class="search-icon" aria-hidden="true"></div>
<button type="button" class="clear-results"><span class="screen-reader-text">
<?php

View File

@ -1738,12 +1738,22 @@ div.wp-link-preview a.wplink-url-error {
color: #d63638;
}
.mce-inline-toolbar-grp div.mce-flow-layout-item > div {
display: flex;
align-items: flex-end;
}
div.wp-link-input {
float: right;
margin: 2px;
max-width: 694px;
}
div.wp-link-input label {
margin-bottom: 4px;
display: block;
}
div.wp-link-input input {
width: 300px;
padding: 3px;

File diff suppressed because one or more lines are too long

View File

@ -1737,12 +1737,22 @@ div.wp-link-preview a.wplink-url-error {
color: #d63638;
}
.mce-inline-toolbar-grp div.mce-flow-layout-item > div {
display: flex;
align-items: flex-end;
}
div.wp-link-input {
float: left;
margin: 2px;
max-width: 694px;
}
div.wp-link-input label {
margin-bottom: 4px;
display: block;
}
div.wp-link-input input {
width: 300px;
padding: 3px;

File diff suppressed because one or more lines are too long

View File

@ -1210,6 +1210,7 @@
display: flex;
align-items: center;
column-gap: .5rem;
margin: 11px 0;
}
.mode-grid .attachments-browser .media-toolbar-mode-select .media-toolbar-primary {
@ -2803,7 +2804,8 @@
}
.mode-grid .attachments-browser .media-toolbar-primary {
display: flex;
display: grid;
grid-template-columns: auto 1fr;
}
.mode-grid .attachments-browser .media-toolbar-primary input[type="search"] {

File diff suppressed because one or more lines are too long

View File

@ -1209,6 +1209,7 @@
display: flex;
align-items: center;
column-gap: .5rem;
margin: 11px 0;
}
.mode-grid .attachments-browser .media-toolbar-mode-select .media-toolbar-primary {
@ -2802,7 +2803,8 @@
}
.mode-grid .attachments-browser .media-toolbar-primary {
display: flex;
display: grid;
grid-template-columns: auto 1fr;
}
.mode-grid .attachments-browser .media-toolbar-primary input[type="search"] {

File diff suppressed because one or more lines are too long

View File

@ -124,21 +124,35 @@ class WP_Customize_Themes_Section extends WP_Customize_Section {
<button type="button" class="button button-primary customize-section-back customize-themes-mobile-back"><?php _e( 'Go to theme sources' ); ?></button>
<# if ( 'wporg' === data.action ) { #>
<div class="search-form">
<label for="wp-filter-search-input-{{ data.id }}" class="screen-reader-text">
<?php
/* translators: Hidden accessibility text. */
_e( 'Search themes&hellip;' );
?>
</label>
<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">
<div class="search-icon" aria-hidden="true"></div>
<span id="{{ data.id }}-live-search-desc" class="screen-reader-text">
<?php
/* translators: Hidden accessibility text. */
_e( 'The search results will be updated as you type.' );
?>
</span>
<label for="wp-filter-search-input-{{ data.id }}"><?php _e( 'Search themes' ); ?></label>
<div class="search-form-input">
<input type="search" id="wp-filter-search-input-{{ data.id }}" aria-describedby="{{ data.id }}-live-search-desc" class="wp-filter-search">
<div class="search-icon" aria-hidden="true"></div>
<span id="{{ data.id }}-live-search-desc" class="screen-reader-text">
<?php
/* translators: Hidden accessibility text. */
_e( 'The search results will be updated as you type.' );
?>
</span>
</div>
</div>
<# } else { #>
<div class="themes-filter-container">
<label for="{{ data.id }}-themes-filter"><?php _e( 'Search themes' ); ?></label>
<div class="search-form-input">
<input type="search" id="{{ data.id }}-themes-filter" aria-describedby="{{ data.id }}-live-search-desc" class="wp-filter-search wp-filter-search-themes" />
<div class="search-icon" aria-hidden="true"></div>
<span id="{{ data.id }}-live-search-desc" class="screen-reader-text">
<?php
/* translators: Hidden accessibility text. */
_e( 'The search results will be updated as you type.' );
?>
</span>
</div>
</div>
<# } #>
<div class="filter-themes-wrapper">
<# if ( 'wporg' === data.action ) { #>
<button type="button" class="button feature-filter-toggle">
<span class="filter-count-0"><?php _e( 'Filter themes' ); ?></span><span class="filter-count-filters">
<?php
@ -147,31 +161,15 @@ class WP_Customize_Themes_Section extends WP_Customize_Section {
?>
</span>
</button>
<# } else { #>
<div class="themes-filter-container">
<label for="{{ data.id }}-themes-filter" class="screen-reader-text">
<# } #>
<div class="filter-themes-count">
<span class="themes-displayed">
<?php
/* translators: Hidden accessibility text. */
_e( 'Search themes&hellip;' );
?>
</label>
<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" />
<div class="search-icon" aria-hidden="true"></div>
<span id="{{ data.id }}-live-search-desc" class="screen-reader-text">
<?php
/* translators: Hidden accessibility text. */
_e( 'The search results will be updated as you type.' );
/* translators: %s: Number of themes displayed. */
printf( __( '%s themes' ), '<span class="theme-count">0</span>' );
?>
</span>
</div>
<# } #>
<div class="filter-themes-count">
<span class="themes-displayed">
<?php
/* translators: %s: Number of themes displayed. */
printf( __( '%s themes' ), '<span class="theme-count">0</span>' );
?>
</span>
</div>
<?php
}

View File

@ -4708,7 +4708,7 @@ AttachmentsBrowser = View.extend(/** @lends wp.media.view.AttachmentsBrowser.pro
}
if ( this.options.search ) {
// Search is an input, a visually hidden label element needs to be rendered before.
// Search is an input, a label element needs to be rendered before.
this.toolbar.set( 'searchLabel', new wp.media.view.Label({
value: l10n.searchLabel,
className: 'media-search-input-label',

View File

@ -56,19 +56,19 @@
renderHtml: function() {
return (
'<div id="' + this._id + '" class="wp-link-input">' +
'<input type="text" value="" placeholder="' + tinymce.translate( 'Paste URL or type to search' ) + '" />' +
'<label for="' + this._id + '_label">' + tinymce.translate( 'Paste URL or type to search' ) + '</label><input id="' + this._id + '_label" type="text" value="" />' +
'<input type="text" style="display:none" value="" />' +
'</div>'
);
},
setURL: function( url ) {
this.getEl().firstChild.value = url;
this.getEl().firstChild.nextSibling.value = url;
},
getURL: function() {
return tinymce.trim( this.getEl().firstChild.value );
return tinymce.trim( this.getEl().firstChild.nextSibling.value );
},
getLinkText: function() {
var text = this.getEl().firstChild.nextSibling.value;
var text = this.getEl().firstChild.nextSibling.nextSibling.value;
if ( ! tinymce.trim( text ) ) {
return '';
@ -77,7 +77,7 @@
return text.replace( /[\r\n\t ]+/g, ' ' );
},
reset: function() {
var urlInput = this.getEl().firstChild;
var urlInput = this.getEl().firstChild.nextSibling;
urlInput.value = '';
urlInput.nextSibling.value = '';
@ -394,7 +394,7 @@
type: 'WPLinkInput',
onPostRender: function() {
var element = this.getEl(),
input = element.firstChild,
input = element.firstChild.nextSibling,
$input, cache, last;
inputInstance = this;
@ -438,7 +438,7 @@
},
select: function( event, ui ) {
$input.val( ui.item.permalink );
$( element.firstChild.nextSibling ).val( ui.item.title );
$( element.firstChild.nextSibling.nextSibling ).val( ui.item.title );
if ( 9 === event.keyCode && typeof window.wpLinkL10n !== 'undefined' ) {
// Audible confirmation message when a link has been selected.

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -4825,7 +4825,7 @@ function wp_enqueue_media( $args = array() ) {
'apply' => __( 'Apply' ),
'filterByDate' => __( 'Filter by date' ),
'filterByType' => __( 'Filter by type' ),
'searchLabel' => __( 'Search' ),
'searchLabel' => __( 'Search media' ),
'searchMediaLabel' => __( 'Search media' ), // Backward compatibility pre-5.3.
'searchMediaPlaceholder' => __( 'Search media items...' ), // Placeholder (no ellipsis), backward compatibility pre-5.3.
/* translators: %d: Number of attachments found in a search. */

View File

@ -16,7 +16,7 @@
*
* @global string $wp_version
*/
$wp_version = '6.6-alpha-58145';
$wp_version = '6.6-alpha-58146';
/**
* Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema.