WordPress.org

Make WordPress Core

Changeset 49283


Ignore:
Timestamp:
10/23/2020 03:03:37 PM (4 months ago)
Author:
helen
Message:

Administration: Better targeting for required form field highlighting.

Previously, any input or select inside of a .form-invalid wrapper would get the red border highlighting, including submit buttons which was not visually correct. This now only applies to form elements with a class of .form-required inside of the .form-invalid wrapper. It also continues to apply the border to elements with both classes (.form-invalid.form-required) as that is how some of the admin markup is structured.

Plugin authors may need to do the same sort of class application seen in this commit, i.e. add .form-required to certain form elements.

Props sabernhardt, dilipbheda, helen.
Fixes #50686.

Location:
trunk/src/wp-admin
Files:
4 edited

Legend:

Unmodified
Added
Removed
  • trunk/src/wp-admin/css/forms.css

    r49248 r49283  
    239239}
    240240
    241 .form-invalid input,
    242 .form-invalid input:focus,
    243 .form-invalid select,
    244 .form-invalid select:focus {
     241.form-invalid .form-required,
     242.form-invalid .form-required:focus,
     243.form-invalid.form-required input,
     244.form-invalid.form-required input:focus,
     245.form-invalid.form-required select,
     246.form-invalid.form-required select:focus {
    245247    border-color: #dc3232 !important;
    246248    box-shadow: 0 0 2px rgba(204, 0, 0, 0.8);
  • trunk/src/wp-admin/includes/nav-menu.php

    r49108 r49283  
    300300        <p id="menu-item-url-wrap" class="wp-clearfix">
    301301            <label class="howto" for="custom-menu-item-url"><?php _e( 'URL' ); ?></label>
    302             <input id="custom-menu-item-url" name="menu-item[<?php echo $_nav_menu_placeholder; ?>][menu-item-url]" type="text"<?php wp_nav_menu_disabled_check( $nav_menu_selected_id ); ?> class="code menu-item-textbox" placeholder="https://" />
     302            <input id="custom-menu-item-url" name="menu-item[<?php echo $_nav_menu_placeholder; ?>][menu-item-url]" type="text"<?php wp_nav_menu_disabled_check( $nav_menu_selected_id ); ?> class="code menu-item-textbox form-required" placeholder="https://" />
    303303        </p>
    304304
  • trunk/src/wp-admin/includes/template.php

    r49231 r49283  
    814814    $cur_mn = current_time( 'i' );
    815815
    816     $month = '<label><span class="screen-reader-text">' . __( 'Month' ) . '</span><select ' . ( $multi ? '' : 'id="mm" ' ) . 'name="mm"' . $tab_index_attribute . ">\n";
     816    $month = '<label><span class="screen-reader-text">' . __( 'Month' ) . '</span><select class="form-required" ' . ( $multi ? '' : 'id="mm" ' ) . 'name="mm"' . $tab_index_attribute . ">\n";
    817817    for ( $i = 1; $i < 13; $i = $i + 1 ) {
    818818        $monthnum  = zeroise( $i, 2 );
     
    824824    $month .= '</select></label>';
    825825
    826     $day    = '<label><span class="screen-reader-text">' . __( 'Day' ) . '</span><input type="text" ' . ( $multi ? '' : 'id="jj" ' ) . 'name="jj" value="' . $jj . '" size="2" maxlength="2"' . $tab_index_attribute . ' autocomplete="off" /></label>';
    827     $year   = '<label><span class="screen-reader-text">' . __( 'Year' ) . '</span><input type="text" ' . ( $multi ? '' : 'id="aa" ' ) . 'name="aa" value="' . $aa . '" size="4" maxlength="4"' . $tab_index_attribute . ' autocomplete="off" /></label>';
    828     $hour   = '<label><span class="screen-reader-text">' . __( 'Hour' ) . '</span><input type="text" ' . ( $multi ? '' : 'id="hh" ' ) . 'name="hh" value="' . $hh . '" size="2" maxlength="2"' . $tab_index_attribute . ' autocomplete="off" /></label>';
    829     $minute = '<label><span class="screen-reader-text">' . __( 'Minute' ) . '</span><input type="text" ' . ( $multi ? '' : 'id="mn" ' ) . 'name="mn" value="' . $mn . '" size="2" maxlength="2"' . $tab_index_attribute . ' autocomplete="off" /></label>';
     826    $day    = '<label><span class="screen-reader-text">' . __( 'Day' ) . '</span><input type="text" ' . ( $multi ? '' : 'id="jj" ' ) . 'name="jj" value="' . $jj . '" size="2" maxlength="2"' . $tab_index_attribute . ' autocomplete="off" class="form-required" /></label>';
     827    $year   = '<label><span class="screen-reader-text">' . __( 'Year' ) . '</span><input type="text" ' . ( $multi ? '' : 'id="aa" ' ) . 'name="aa" value="' . $aa . '" size="4" maxlength="4"' . $tab_index_attribute . ' autocomplete="off" class="form-required" /></label>';
     828    $hour   = '<label><span class="screen-reader-text">' . __( 'Hour' ) . '</span><input type="text" ' . ( $multi ? '' : 'id="hh" ' ) . 'name="hh" value="' . $hh . '" size="2" maxlength="2"' . $tab_index_attribute . ' autocomplete="off" class="form-required" /></label>';
     829    $minute = '<label><span class="screen-reader-text">' . __( 'Minute' ) . '</span><input type="text" ' . ( $multi ? '' : 'id="mn" ' ) . 'name="mn" value="' . $mn . '" size="2" maxlength="2"' . $tab_index_attribute . ' autocomplete="off" class="form-required" /></label>';
    830830
    831831    echo '<div class="timestamp-wrap">';
  • trunk/src/wp-admin/nav-menus.php

    r49220 r49283  
    962962                        <div class="major-publishing-actions wp-clearfix">
    963963                            <label class="menu-name-label" for="menu-name"><?php _e( 'Menu Name' ); ?></label>
    964                             <input name="menu-name" id="menu-name" type="text" class="menu-name regular-text menu-item-textbox" <?php echo $menu_name_val . $menu_name_aria_desc; ?> />
     964                            <input name="menu-name" id="menu-name" type="text" class="menu-name regular-text menu-item-textbox form-required" required="required" <?php echo $menu_name_val . $menu_name_aria_desc; ?> />
    965965                            <div class="publishing-action">
    966966                                <?php submit_button( empty( $nav_menu_selected_id ) ? __( 'Create Menu' ) : __( 'Save Menu' ), 'primary large menu-save', 'save_menu', false, array( 'id' => 'save_menu_header' ) ); ?>
Note: See TracChangeset for help on using the changeset viewer.