Upstream
/
WordPress
mirror of https://github.com/WordPress/WordPress.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

Administration: A11y: Add visible labels in theme UI. 

Finish task to replace placeholders used for labels with visible label elements. Add label elements in theme browser and theme installation screen. Change position of search input to match other user interfaces in WordPress.

Also crediting all contributors to ticket #61389, which this also closes.

Props joedolson, rcreators, sabernhardt, balub, rejaulalomkhan, syamraj24, nazmul111, krupajnanda, huzaifaalmesbah, hmbashar, mdnesarmridha, colorful-tones, printsachen1.
Fixes #40331, #61389.
Built from https://develop.svn.wordpress.org/trunk@58405


git-svn-id: http://core.svn.wordpress.org/trunk@57854 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
joedolson 2024-06-13 13:57:10 +00:00
parent c60358fdb2
commit 4d68eaaa45
11 changed files with 50 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
wp-admin/css/themes-rtl.css
View File

@ -20,23 +20,23 @@ body.js .theme-browser.search-loading {
clear: both;
}
.themes-php:not(.network-admin) .wrap h1 {
margin-bottom: 15px;
}
.themes-php .wrap h1 .button {
margin-right: 20px;
}
/* Search form */
.themes-php .search-form {
display: inline;
display: inline-flex;
align-items: center;
position: relative;
top: 0;
gap: .5rem;
width: 100%;
justify-content: end;
}
.themes-php .wp-filter-search {
position: relative;
top: -2px;
right: 20px;
margin: 0;
width: 280px;
}
@ -956,11 +956,15 @@ body.folded .theme-browser ~ .theme-overlay .theme-wrap {
clear: both;
right: 0;
left: 0;
margin: -5px 0 20px;
width: 100%;
max-width: 280px;
}
.theme-install-php .wp-filter p.search-box {
display: grid;
row-gap: .5rem;
}
.theme-browser .theme.add-new-theme span:after {
font: normal 60px/90px dashicons;
width: 80px;
@ -1030,6 +1034,13 @@ body.folded .theme-browser ~ .theme-overlay .theme-wrap {
padding-right: 20px;
}
/* Override column gap adjustment in media library. */
@media only screen and (max-width: 1000px) {
.theme-install-php .wp-filter p.search-box {
column-gap: .5rem;
}
}
.theme-install-php a.upload,
.theme-install-php a.browse-themes {
cursor: pointer;

2
wp-admin/css/themes-rtl.min.css vendored
View File

File diff suppressed because one or more lines are too long

27
wp-admin/css/themes.css
View File

@ -19,23 +19,23 @@ body.js .theme-browser.search-loading {
clear: both;
}
.themes-php:not(.network-admin) .wrap h1 {
margin-bottom: 15px;
}
.themes-php .wrap h1 .button {
margin-left: 20px;
}
/* Search form */
.themes-php .search-form {
display: inline;
display: inline-flex;
align-items: center;
position: relative;
top: 0;
gap: .5rem;
width: 100%;
justify-content: end;
}
.themes-php .wp-filter-search {
position: relative;
top: -2px;
left: 20px;
margin: 0;
width: 280px;
}
@ -955,11 +955,15 @@ body.folded .theme-browser ~ .theme-overlay .theme-wrap {
clear: both;
left: 0;
right: 0;
margin: -5px 0 20px;
width: 100%;
max-width: 280px;
}
.theme-install-php .wp-filter p.search-box {
display: grid;
row-gap: .5rem;
}
.theme-browser .theme.add-new-theme span:after {
font: normal 60px/90px dashicons;
width: 80px;
@ -1029,6 +1033,13 @@ body.folded .theme-browser ~ .theme-overlay .theme-wrap {
padding-left: 20px;
}
/* Override column gap adjustment in media library. */
@media only screen and (max-width: 1000px) {
.theme-install-php .wp-filter p.search-box {
column-gap: .5rem;
}
}
.theme-install-php a.upload,
.theme-install-php a.browse-themes {
cursor: pointer;

2
wp-admin/css/themes.min.css vendored
View File

File diff suppressed because one or more lines are too long

5
wp-admin/js/theme.js
View File

@ -96,7 +96,7 @@ themes.view.Appearance = wp.Backbone.View.extend({
},
// Defines search element container.
searchContainer: $( '.search-form' ),
searchContainer: $( '.search-form .search-box' ),
// Search input and view
// for current theme collection.
@ -118,7 +118,7 @@ themes.view.Appearance = wp.Backbone.View.extend({
// Render and append after screen title.
view.render();
this.searchContainer
.append( $.parseHTML( '<label class="screen-reader-text" for="wp-filter-search-input">' + l10n.search + '</label>' ) )
.append( $.parseHTML( '<label for="wp-filter-search-input">' + l10n.search + '</label>' ) )
.append( view.el )
.on( 'submit', function( event ) {
event.preventDefault();
@ -1359,7 +1359,6 @@ themes.view.Search = wp.Backbone.View.extend({
searching: false,
attributes: {
placeholder: l10n.searchPlaceholder,
type: 'search',
'aria-describedby': 'live-search-desc'
},

2
wp-admin/js/theme.min.js vendored
View File

File diff suppressed because one or more lines are too long

2
wp-admin/network/site-themes.php
View File

@ -237,7 +237,7 @@ if ( isset( $_GET['enabled'] ) ) {
<p><?php _e( 'Network enabled themes are not shown on this screen.' ); ?></p>
<form method="get">
<?php $wp_list_table->search_box( __( 'Search Installed Themes' ), 'theme' ); ?>
<?php $wp_list_table->search_box( __( 'Search installed themes' ), 'theme' ); ?>
<input type="hidden" name="id" value="<?php echo esc_attr( $id ); ?>" />
</form>

2
wp-admin/network/themes.php
View File

@ -460,7 +460,7 @@ if ( '' !== $message ) {
?>
<form method="get">
<?php $wp_list_table->search_box( __( 'Search Installed Themes' ), 'theme' ); ?>
<?php $wp_list_table->search_box( __( 'Search installed themes' ), 'theme' ); ?>
</form>
<?php

3
wp-admin/theme-install.php
View File

@ -56,7 +56,6 @@ wp_localize_script(
'l10n' => array(
'addNew' => __( 'Add New Theme' ),
'search' => __( 'Search Themes' ),
'searchPlaceholder' => __( 'Search themes...' ), // Placeholder (no ellipsis).
'upload' => __( 'Upload Theme' ),
'back' => __( 'Back' ),
'error' => sprintf(
@ -217,7 +216,7 @@ require_once ABSPATH . 'wp-admin/admin-header.php';
<button type="button" class="button drawer-toggle" aria-expanded="false"><?php _e( 'Feature Filter' ); ?></button>
<form class="search-form"></form>
<form class="search-form"><p class="search-box"></p></form>
<div class="favorites-form">
<?php

9
wp-admin/themes.php
View File

@ -232,8 +232,7 @@ wp_localize_script(
),
'l10n' => array(
'addNew' => __( 'Add New Theme' ),
'search' => __( 'Search Installed Themes' ),
'searchPlaceholder' => __( 'Search installed themes...' ), // Placeholder (no ellipsis).
'search' => __( 'Search installed themes' ),
/* translators: %d: Number of themes. */
'themesFound' => __( 'Number of Themes found: %d' ),
'noThemesFound' => __( 'No themes found. Try a different search.' ),
@ -252,14 +251,12 @@ require_once ABSPATH . 'wp-admin/admin-header.php';
<h1 class="wp-heading-inline"><?php esc_html_e( 'Themes' ); ?>
<span class="title-count theme-count"><?php echo ! empty( $_GET['search'] ) ? __( '&hellip;' ) : count( $themes ); ?></span>
</h1>
<?php if ( ! is_multisite() && current_user_can( 'install_themes' ) ) : ?>
<a href="<?php echo esc_url( admin_url( 'theme-install.php' ) ); ?>" class="hide-if-no-js page-title-action"><?php echo esc_html__( 'Add New Theme' ); ?></a>
<?php endif; ?>
<form class="search-form"></form>
<hr class="wp-header-end">
<form class="search-form search-themes"><p class="search-box"></p></form>
<?php
if ( ! validate_current_theme() || isset( $_GET['broken'] ) ) {
wp_admin_notice(

2
wp-includes/version.php
View File

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