WordPress.org
Get WordPress

Make WordPress Core

Ticket #23449: 23449.21.diff

File 23449.21.diff, 8.3 KB (added by helen, 11 years ago)

  • wp-admin/includes/template.php

     
    10001000                <ul class="outer-border">
    10011001        <?php
    10021002        $i = 0;
     1003        $first_open = false;
    10031004        do {
    10041005                if ( ! isset( $wp_meta_boxes ) || ! isset( $wp_meta_boxes[$page] ) || ! isset( $wp_meta_boxes[$page][$context] ) )
    10051006                        break;
    … …  
    10111012                                                continue;
    10121013                                        $i++;
    10131014                                        $hidden_class = in_array( $box['id'], $hidden ) ? 'hide-if-js' : '';
     1015
     1016                                        $open_class = '';
     1017                                        if ( ! $first_open && empty( $hidden_class ) ) {
     1018                                                $first_open = true;
     1019                                                $open_class = 'open';
     1020                                        }
    10141021                                        ?>
    1015                                         <li class="control-section accordion-section <?php echo $hidden_class; ?> <?php echo esc_attr( $box['id'] ); ?>" id="<?php echo esc_attr( $box['id'] ); ?>">
     1022                                        <li class="control-section accordion-section <?php echo $hidden_class; ?> <?php echo $open_class; ?> <?php echo esc_attr( $box['id'] ); ?>" id="<?php echo esc_attr( $box['id'] ); ?>">
    10161023                                                <h3 class="accordion-section-title hndle" tabindex="0" title="<?php echo esc_attr( $box['title'] ); ?>"><?php echo esc_html( $box['title'] ); ?></h3>
    10171024                                                <div class="accordion-section-content <?php postbox_classes( $box['id'], $page ); ?>">
    10181025                                                        <div class="inside">

  • wp-admin/customize.php

     
    4646wp_user_settings();
    4747_wp_admin_html_begin();
    4848
    49 $body_class = 'wp-core-ui';
     49$body_class = 'wp-core-ui js';
    5050
    5151if ( wp_is_mobile() ) :
    5252        $body_class .= ' mobile';
    … …  
    9090                        $cannot_expand = ! ( $screenshot || $wp_customize->theme()->get('Description') );
    9191                ?>
    9292
    93                 <div class="wp-full-overlay-sidebar-content" tabindex="-1">
    94                         <div id="customize-info" class="accordion-section<?php if ( $cannot_expand ) echo ' cannot-expand'; ?>">
     93                <div class="wp-full-overlay-sidebar-content accordion-container" tabindex="-1">
     94                        <div id="customize-info" class="accordion-section closable<?php if ( $cannot_expand ) echo ' cannot-expand'; ?>">
    9595                                <div class="accordion-section-title" aria-label="<?php esc_attr_e( 'Theme Customizer Options' ); ?>" tabindex="0">
    9696                                        <span class="preview-notice"><?php
    9797                                                /* translators: %s is the theme name in the Customize/Live Preview pane */
    … …  
    111111                                <?php endif; ?>
    112112                        </div>
    113113
    114                         <div id="customize-theme-controls" class="accordion-container"><ul>
     114                        <div id="customize-theme-controls"><ul>
    115115                                <?php
    116116                                foreach ( $wp_customize->sections() as $section )
    117117                                        $section->maybe_render();

  • wp-admin/js/accordion.js

     
    99                        e.preventDefault(); // Keep this AFTER the key filter above
    1010
    1111                        accordionSwitch( $( this ) );
    12                         accordionCorners();
    1312                });
    1413
    1514                // Refresh selected accordion option when screen options are toggled
    … …  
    2625        function accordionCorners () {
    2726                accordionOptions.removeClass( 'top bottom' );
    2827                accordionOptions.filter( ':visible' ).first().addClass( 'top' );
    29                 accordionOptions.filter( ':visible' ).last().addClass( 'bottom' ).find( sectionContent ).addClass('bottom');
    30         };
     28                accordionOptions.filter( ':visible' ).last().addClass( 'bottom' ).find( sectionContent ).addClass( 'bottom' );
     29        }
    3130
    3231        function accordionInit () {
    3332                accordionSwitch( accordionOptions.filter( ':visible' ).first() );
    … …  
    3635
    3736        function accordionSwitch ( el ) {
    3837                var section = el.closest( '.accordion-section' ),
    39                     siblings = section.parent().find( '.open' ),
    40                     content = section.find( sectionContent );
     38                        siblings = section.closest( '.accordion-container' ).find( '.open' ),
     39                        content = section.find( sectionContent );
    4140
    4241                if ( section.hasClass( 'cannot-expand' ) )
    4342                        return;
    4443
    45                 siblings.removeClass( 'open' );
    46                 siblings.find( sectionContent ).show().slideUp( 150 );
    47                 content.toggle( section.hasClass( 'open' ) ).slideToggle( 150 );
    48                 section.toggleClass( 'open' );
     44                if ( section.hasClass( 'open' ) && ! section.hasClass( 'closable' ) ) {
     45                        return;
     46                } else if ( section.hasClass( 'open' ) && section.hasClass( 'closable' ) ) {
     47                        section.toggleClass( 'open' );
     48                        content.toggle( true ).slideToggle( 150 );
     49                } else {
     50                        siblings.removeClass( 'open' );
     51                        siblings.find( sectionContent ).show().slideUp( 150 );
     52                        content.toggle( false ).slideToggle( 150 );
     53                        section.toggleClass( 'open' );
     54                }
     55
     56                accordionCorners();
    4957        }
    5058
    5159        // Show the first accordion option by default

  • wp-admin/css/wp-admin.css

     
    89978997        cursor: pointer;
    89988998}
    89998999
     9000.js .open .accordion-section-title {
     9001        cursor: default;
     9002}
     9003
    90009004.js .accordion-section-title:after {
    90019005        content: '';
    90029006        width: 0;
    … …  
    90299033
    90309034.control-section .accordion-section-title {
    90319035        padding: 10px 20px;
     9036        color: #464646;
    90329037        font-size: 15px;
    90339038        font-family: Georgia, "Times New Roman", "Bitstream Charter", Times, serif;
    90349039        font-weight: normal;
    … …  
    90459050        top: 15px;
    90469051}
    90479052
    9048 .control-section .accordion-section-title:hover:after,
    9049 .control-section .accordion-section-title:focus:after {
    9050         border-color: #eee transparent;
    9051 }
    9052 
    90539053.js .control-section:hover .accordion-section-title,
    90549054.js .control-section .accordion-section-title:hover,
    90559055.js .control-section.open .accordion-section-title,
    90569056.js .control-section .accordion-section-title:focus {
    9057         color: #fff;
    9058         text-shadow: 0 -1px 0 #333;
    9059         background: #808080;
    9060         background-image: -webkit-gradient(linear, left bottom, left top, from(#6d6d6d), to(#808080));
    9061         background-image: -webkit-linear-gradient(bottom, #6d6d6d, #808080);
    9062         background-image:    -moz-linear-gradient(bottom, #6d6d6d, #808080);
    9063         background-image:      -o-linear-gradient(bottom, #6d6d6d, #808080);
    9064         background-image: linear-gradient(to top, #6d6d6d, #808080);
    9065         border-left: 1px solid #808080;
    9066         border-right: 1px solid #808080;
     9057        color: #000;
     9058        background: #f9f9f9;
     9059        background-image: -webkit-gradient(linear, left bottom, left top, from(#ececec), to(#f9f9f9));
     9060        background-image: -webkit-linear-gradient(bottom, #ececec, #f9f9f9);
     9061        background-image:    -moz-linear-gradient(bottom, #ececec, #f9f9f9);
     9062        background-image:      -o-linear-gradient(bottom, #ececec, #f9f9f9);
     9063        background-image: linear-gradient(to top, #ececec, #f9f9f9);
    90679064}
    90689065
    9069 .js .control-section.accordion-section:hover,
    9070 .control-section.accordion-section.open {
    9071         border-top-color: #808080;
    9072 }
    9073 
    90749066.control-section.open .accordion-section-title {
    9075         border-bottom: 1px solid #6d6d6d;
     9067        border-bottom: 1px solid #dfdfdf;
    90769068}
    90779069
    90789070/* =Media Queries

  • wp-admin/css/customize-controls.css

     
    121121        height: 100%;
    122122}
    123123
     124#customize-theme-controls .accordion-section-title:hover:after,
     125#customize-theme-controls .accordion-section-title:focus:after {
     126        border-color: #eee transparent;
     127}
     128
     129#customize-theme-controls .control-section:hover .accordion-section-title,
     130#customize-theme-controls .control-section .accordion-section-title:hover,
     131#customize-theme-controls .control-section.open .accordion-section-title,
     132#customize-theme-controls .control-section .accordion-section-title:focus {
     133        color: #fff;
     134        text-shadow: 0 -1px 0 #333;
     135        background: #808080;
     136        background-image: -webkit-gradient(linear, left bottom, left top, from(#6d6d6d), to(#808080));
     137        background-image: -webkit-linear-gradient(bottom, #6d6d6d, #808080);
     138        background-image:    -moz-linear-gradient(bottom, #6d6d6d, #808080);
     139        background-image:      -o-linear-gradient(bottom, #6d6d6d, #808080);
     140        background-image: linear-gradient(to top, #6d6d6d, #808080);
     141        border-left: 1px solid #808080;
     142        border-right: 1px solid #808080;
     143}
     144
     145#customize-theme-controls .control-section.accordion-section:hover,
     146#customize-theme-controls .control-section.accordion-section.open {
     147        border-top-color: #808080;
     148}
     149
     150#customize-theme-controls .control-section.open .accordion-section-title {
     151        border-bottom: 1px solid #6d6d6d;
     152}
     153
    124154/*
    125155 * Style for custom settings
    126156 */