Accessibility: Widgets: Further improve spacing between Widgets checkboxes and radio buttons in the admin interface.

Follow-up to [47598]:
- further improves the spacing after [47598] by better scoping the CSS to avoid layout glitches for custom widgets
- changes the RSS widget form to wrap the checkboxes in one single paragraph

Ideally, multiple related checkboxes and radio buttons should be grouped within a fieldset element with a legend. This will be addressed in a new Trac ticket.

Props mukesh27, SergeyBiryukov, sabernhardt.
Fixes #49228.


git-svn-id: https://develop.svn.wordpress.org/trunk@48389 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Andrea Fercia 2020-07-07 17:27:38 +00:00
parent 233dc322bf
commit 2bdd712204
2 changed files with 23 additions and 15 deletions

View File

@ -48,11 +48,6 @@
line-height: 1.23076923;
}
.widgets-holder-wrap .widget-inside label {
margin: 0.25em 0 0.5em;
display: inline-block;
}
.widget.widget-dirty .widget-control-close-wrapper {
display: none;
}
@ -796,6 +791,15 @@ ul.CodeMirror-hints {
/* =Media Queries
-------------------------------------------------------------- */
@media screen and (max-width: 782px) {
.widgets-holder-wrap .widget-inside input[type="checkbox"],
.widgets-holder-wrap .widget-inside input[type="radio"],
.editwidget .widget-inside input[type="checkbox"], /* Selectors for the "accessibility mode" page. */
.editwidget .widget-inside input[type="radio"] {
margin: 0.25rem 0.25rem 0.25rem 0;
}
}
@media screen and (max-width: 480px) {
div.widget-liquid-left {
width: 100%;

View File

@ -1642,17 +1642,21 @@ function wp_widget_rss_form( $args, $inputs = null ) {
}
?>
</select></p>
<?php endif; if ( $inputs['show_summary'] ) : ?>
<p><input id="rss-show-summary-<?php echo $esc_number; ?>" name="widget-rss[<?php echo $esc_number; ?>][show_summary]" type="checkbox" value="1" <?php checked( $args['show_summary'] ); ?> />
<label for="rss-show-summary-<?php echo $esc_number; ?>"><?php _e( 'Display item content?' ); ?></label></p>
<?php endif; if ( $inputs['show_author'] ) : ?>
<p><input id="rss-show-author-<?php echo $esc_number; ?>" name="widget-rss[<?php echo $esc_number; ?>][show_author]" type="checkbox" value="1" <?php checked( $args['show_author'] ); ?> />
<label for="rss-show-author-<?php echo $esc_number; ?>"><?php _e( 'Display item author if available?' ); ?></label></p>
<?php endif; if ( $inputs['show_date'] ) : ?>
<p><input id="rss-show-date-<?php echo $esc_number; ?>" name="widget-rss[<?php echo $esc_number; ?>][show_date]" type="checkbox" value="1" <?php checked( $args['show_date'] ); ?>/>
<label for="rss-show-date-<?php echo $esc_number; ?>"><?php _e( 'Display item date?' ); ?></label></p>
<?php endif; if ( $inputs['show_summary'] || $inputs['show_author'] || $inputs['show_date'] ) : ?>
<p>
<?php if ( $inputs['show_summary'] ) : ?>
<input id="rss-show-summary-<?php echo $esc_number; ?>" name="widget-rss[<?php echo $esc_number; ?>][show_summary]" type="checkbox" value="1" <?php checked( $args['show_summary'] ); ?> />
<label for="rss-show-summary-<?php echo $esc_number; ?>"><?php _e( 'Display item content?' ); ?></label><br />
<?php endif; if ( $inputs['show_author'] ) : ?>
<input id="rss-show-author-<?php echo $esc_number; ?>" name="widget-rss[<?php echo $esc_number; ?>][show_author]" type="checkbox" value="1" <?php checked( $args['show_author'] ); ?> />
<label for="rss-show-author-<?php echo $esc_number; ?>"><?php _e( 'Display item author if available?' ); ?></label><br />
<?php endif; if ( $inputs['show_date'] ) : ?>
<input id="rss-show-date-<?php echo $esc_number; ?>" name="widget-rss[<?php echo $esc_number; ?>][show_date]" type="checkbox" value="1" <?php checked( $args['show_date'] ); ?>/>
<label for="rss-show-date-<?php echo $esc_number; ?>"><?php _e( 'Display item date?' ); ?></label><br />
<?php endif; ?>
</p>
<?php
endif;
endif; // end of display options
foreach ( array_keys( $default_inputs ) as $input ) :
if ( 'hidden' === $inputs[ $input ] ) :
$id = str_replace( '_', '-', $input );