WordPress.org

Make WordPress Core

Changeset 28983


Ignore:
Timestamp:
07/03/2014 10:53:01 PM (4 years ago)
Author:
johnbillion
Message:

First pass at switching to radio inputs for the install screen language selector. Needs some more work. See #28577. Props jorbin

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

Legend:

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

    r28850 r28983  
    317317}
    318318
    319 .language-chooser select {
     319.language-chooser fieldset {
    320320    margin: 1px;
    321321    padding: 8px;
    322     width: 100%;
    323322    display: block;
    324323    border: 1px solid #ddd;
     
    335334    font-family: inherit;
    336335    font-weight: inherit;
    337 }
    338 
    339 .language-chooser select:focus {
     336    overflow-y: scroll;
     337    height: 250px;
     338}
     339
     340/* TODO:add focus style via JS */
     341.language-chooser fieldset.focus {
    340342    border-color: #5b9dd9;
    341343    -webkit-box-shadow: 0 0 2px rgba(30,140,190,0.8);
     
    351353    text-align: right;
    352354}
     355
     356.language-chooser input:checked + label{
     357      color:white;
     358      background: #0074A2;
     359}
     360
     361.language-chooser label{
     362    display:block;
     363}
     364
     365.screen-reader-input,
     366.screen-reader-text {
     367    position: absolute;
     368    margin: -1px;
     369    padding: 0;
     370    height: 1px;
     371    width: 1px;
     372    overflow: hidden;
     373    clip: rect(0 0 0 0);
     374    border: 0;
     375}
  • trunk/src/wp-admin/install.php

    r28982 r28983  
    204204        if ( $body ) {
    205205            display_header( 'language-chooser' );
    206 
    207206            echo '<form id="setup" method="post" action="install.php?step=1">';
    208             echo '<select name="language" id="language-chooser" size="15">';
    209             echo '<option selected="selected" value="">English (United States)</option>';
     207            echo "<fieldset>\n";
     208            echo "<legend class='screen-reader-text'>Select a default language</legend>\n";
     209            echo '<input type="radio" checked="checked" class="screen-reader-input" name="language" id="language_default" value="">';
     210            echo '<label for="language_default">English (United States)</label>';
     211            echo "\n";
     212
    210213            foreach ( $body['languages'] as $language ) {
    211                 echo '<option value="' . esc_attr( $language['language'] ) . '">' . esc_html( $language['native_name'] ) . "</option>\n";
     214                echo '<input type="radio" name="language" class="' . esc_attr( $language['language'] ) . ' screen-reader-input" id="language_'. esc_attr( $language['language'] ) .'" value="' . esc_attr( $language['language'] ) . '">';
     215                echo '<label for="language_' . esc_attr( $language['language'] ) . '">' . esc_html( $language['native_name'] ) . "</label>\n";
    212216            }
    213             echo "</select>\n";
     217
     218            echo "</fieldset>\n";
    214219            echo '<p class="step"><input type="submit" class="button button-primary button-hero" value="&raquo;" /></p>';
    215220            echo '</form>';
     
    335340if ( !wp_is_mobile() ) {
    336341?>
    337 <script type="text/javascript">var t = document.getElementById('weblog_title') || document.getElementById('language-chooser'); if (t){ t.focus(); }</script>
     342<script type="text/javascript">var t = document.getElementById('weblog_title'); if (t){ t.focus(); }</script>
    338343<?php } ?>
    339344<?php wp_print_scripts( 'user-profile' ); ?>
Note: See TracChangeset for help on using the changeset viewer.