WordPress.org
Get WordPress

Make WordPress Core

Ticket #23449: 23449.1.diff

File 23449.1.diff, 18.3 KB (added by lessbloat, 12 years ago)

  • wp-includes/class-wp-customize-section.php

     
    7979         */
    8080        protected function render() {
    8181                ?>
    82                 <li id="customize-section-<?php echo esc_attr( $this->id ); ?>" class="control-section customize-section">
    83                         <h3 class="customize-section-title" tabindex="0" title="<?php echo esc_attr( $this->description ); ?>"><?php echo esc_html( $this->title ); ?></h3>
    84                         <ul class="customize-section-content">
     82                <li id="accordion-section-<?php echo esc_attr( $this->id ); ?>" class="control-section accordion-section">
     83                        <h3 class="accordion-section-title" tabindex="0" title="<?php echo esc_attr( $this->description ); ?>"><?php echo esc_html( $this->title ); ?></h3>
     84                        <ul class="accordion-section-content">
    8585                                <?php
    8686                                foreach ( $this->controls as $control )
    8787                                        $control->maybe_render();

  • wp-includes/script-loader.php

     
    107107        ) );
    108108
    109109        $scripts->add( 'autosave', "/wp-includes/js/autosave$suffix.js", array('schedule', 'wp-ajax-response'), false, 1 );
    110        
     110
    111111        $scripts->add( 'heartbeat', "/wp-includes/js/heartbeat$suffix.js", array('jquery'), false, 1 );
    112112        did_action( 'init' ) && $scripts->localize( 'heartbeat', 'heartbeatSettings',
    113113                apply_filters( 'heartbeat_settings', array() )
    … …  
    331331                'allowedFiles' => __( 'Allowed Files' ),
    332332        ) );
    333333
     334        $scripts->add( 'accordion', "/wp-admin/js/accordion$suffix.js", array( 'jquery' ), false, 1 );
     335
    334336        $scripts->add( 'shortcode', "/wp-includes/js/shortcode$suffix.js", array( 'underscore' ), false, 1 );
    335337        $scripts->add( 'media-models', "/wp-includes/js/media-models$suffix.js", array( 'backbone', 'jquery' ), false, 1 );
    336338        did_action( 'init' ) && $scripts->localize( 'media-models', '_wpMediaModelsL10n', array(

  • wp-admin/customize.php

     
    3636wp_enqueue_script( 'customize-controls' );
    3737wp_enqueue_style( 'customize-controls' );
    3838
     39wp_enqueue_script( 'accordion' );
     40
    3941do_action( 'customize_controls_enqueue_scripts' );
    4042
    4143// Let's roll.
    … …  
    8991                ?>
    9092
    9193                <div class="wp-full-overlay-sidebar-content" tabindex="-1">
    92                         <div id="customize-info" class="customize-section<?php if ( $cannot_expand ) echo ' cannot-expand'; ?>">
    93                                 <div class="customize-section-title" aria-label="<?php esc_attr_e( 'Theme Customizer Options' ); ?>" tabindex="0">
     94                        <div id="customize-info" class="accordion-section<?php if ( $cannot_expand ) echo ' cannot-expand'; ?>">
     95                                <div class="accordion-section-title" aria-label="<?php esc_attr_e( 'Theme Customizer Options' ); ?>" tabindex="0">
    9496                                        <span class="preview-notice"><?php
    9597                                                /* translators: %s is the theme name in the Customize/Live Preview pane */
    9698                                                echo sprintf( __( 'You are previewing %s' ), '<strong class="theme-name">' . $wp_customize->theme()->display('Name') . '</strong>' );
    9799                                        ?></span>
    98100                                </div>
    99101                                <?php if ( ! $cannot_expand ) : ?>
    100                                 <div class="customize-section-content">
     102                                <div class="accordion-section-content">
    101103                                        <?php if ( $screenshot ) : ?>
    102104                                                <img class="theme-screenshot" src="<?php echo esc_url( $screenshot ); ?>" />
    103105                                        <?php endif; ?>

  • wp-admin/js/accordion.js

     
     1jQuery(document).ready( function($) {
     2        // Expand/Collapse
     3        $('.accordion-section-title').on('click keydown', function( event ) {
     4
     5                if ( event.type === 'keydown' &&  13 !== event.which ) // enter
     6                                return;
     7
     8                var clicked = $( this ).closest( '.accordion-section' );
     9
     10                if ( clicked.hasClass('cannot-expand') )
     11                        return;
     12
     13                clicked.closest( '.accordion-container' ).find( '.accordion-section' ).not( clicked ).removeClass( 'open' );
     14                clicked.toggleClass( 'open' );
     15                event.preventDefault();
     16        });
     17});
     18 No newline at end of file

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

     
    846846                        api.state = state;
    847847                }());
    848848
    849                 // Temporary accordion code.
    850                 $('.customize-section-title').bind('click keydown', function( event ) {
    851 
    852                         if ( event.type === 'keydown' &&  13 !== event.which ) // enter
    853                                         return;
    854 
    855                         var clicked = $( this ).parents( '.customize-section' );
    856 
    857                         if ( clicked.hasClass('cannot-expand') )
    858                                 return;
    859 
    860                         // Scroll up if on #customize-section-title_tagline
    861                         if ('customize-section-title_tagline' === clicked.attr('id'))
    862                                 $('.wp-full-overlay-sidebar-content').scrollTop(0);
    863 
    864                         $( '.customize-section' ).not( clicked ).removeClass( 'open' );
    865                         clicked.toggleClass( 'open' );
    866                         event.preventDefault();
    867                 });
    868 
    869849                // Button bindings.
    870850                $('#save').click( function( event ) {
    871851                        previewer.save();

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

     
    25342534        direction: ltr;
    25352535}
    25362536
     2537.control-section .accordion-section-title {
     2538        font-family: Tahoma, Arial, sans-serif;
     2539}
     2540
     2541.accordion-section-title:after {
     2542        right: auto;
     2543        left: 20px;
     2544}
     2545
    25372546/**
    25382547 * HiDPI Displays
    25392548 */

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

     
    82778277        -ms-touch-action: none;
    82788278}
    82798279
     8280/* Accordion */
     8281
     8282.accordion-section {
     8283        border-top: 1px solid #fff;
     8284        border-bottom: 1px solid #dfdfdf;
     8285        margin: 0;
     8286}
     8287
     8288.accordion-section:last-child {
     8289        box-shadow: 0 1px 0 0px #fff;
     8290}
     8291
     8292.accordion-section.open .accordion-section-content {
     8293        display: block;
     8294        background: #fdfdfd;
     8295}
     8296
     8297.accordion-section.open:hover {
     8298        border-bottom-color: #dfdfdf;
     8299}
     8300
     8301.accordion-section-content {
     8302        display: none;
     8303        padding: 10px 20px 15px;
     8304        overflow: hidden;
     8305}
     8306
     8307.accordion-section-title {
     8308        margin: 0;
     8309        padding: 15px 20px;
     8310        position: relative;
     8311
     8312        cursor: pointer;
     8313
     8314        -webkit-user-select: none;
     8315        -moz-user-select: none;
     8316        user-select: none;
     8317}
     8318
     8319.accordion-section-title:after {
     8320        content: '';
     8321        width: 0;
     8322        height: 0;
     8323        border-color: #ccc transparent;
     8324        border-style: solid;
     8325        border-width: 6px 6px 0;
     8326        position: absolute;
     8327        top: 25px;
     8328        right: 20px;
     8329        z-index: 1;
     8330}
     8331
     8332.accordion-section-title:focus {
     8333        outline: none;
     8334}
     8335
     8336.accordion-section-title:hover:after,
     8337.accordion-section-title:focus:after {
     8338        border-color: #aaa transparent;
     8339}
     8340
     8341.cannot-expand .accordion-section-title {
     8342        cursor: auto;
     8343}
     8344
     8345.cannot-expand .accordion-section-title:after {
     8346        display: none;
     8347}
     8348
     8349.control-section .accordion-section-title {
     8350        padding: 10px 20px;
     8351        font-size: 15px;
     8352        font-family: Georgia, "Times New Roman", "Bitstream Charter", Times, serif;
     8353        font-weight: normal;
     8354        text-shadow: 0 1px 0 #fff;
     8355        background: #f5f5f5;
     8356        background-image: -webkit-gradient(linear, left bottom, left top, from(#eee), to(#f5f5f5));
     8357        background-image: -webkit-linear-gradient(bottom, #eee, #f5f5f5);
     8358        background-image:    -moz-linear-gradient(bottom, #eee, #f5f5f5);
     8359        background-image:      -o-linear-gradient(bottom, #eee, #f5f5f5);
     8360        background-image: linear-gradient(to top, #eee, #f5f5f5);
     8361}
     8362
     8363.control-section .accordion-section-title:after {
     8364        top: 15px;
     8365}
     8366
     8367.control-section .accordion-section-title:hover:after,
     8368.control-section .accordion-section-title:focus:after {
     8369        border-color: #eee transparent;
     8370}
     8371
     8372.control-section:hover .accordion-section-title,
     8373.control-section .accordion-section-title:hover,
     8374.control-section.open .accordion-section-title,
     8375.control-section .accordion-section-title:focus {
     8376        color: #fff;
     8377        text-shadow: 0 -1px 0 #333;
     8378        background: #808080;
     8379        background-image: -webkit-gradient(linear, left bottom, left top, from(#6d6d6d), to(#808080));
     8380        background-image: -webkit-linear-gradient(bottom, #6d6d6d, #808080);
     8381        background-image:    -moz-linear-gradient(bottom, #6d6d6d, #808080);
     8382        background-image:      -o-linear-gradient(bottom, #6d6d6d, #808080);
     8383        background-image: linear-gradient(to top, #6d6d6d, #808080);
     8384}
     8385
     8386.control-section.accordion-section:hover,
     8387.control-section.accordion-section.open {
     8388        border-top-color: #808080;
     8389}
     8390
     8391.control-section.open .accordion-section-title {
     8392        border-bottom: 1px solid #6d6d6d;
     8393}
     8394
    82808395/* =Media Queries
    82818396-------------------------------------------------------------- */
    82828397

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

     
    1 .control-section .customize-section-title {
    2         font-family: Tahoma, Arial, sans-serif;
    3 }
    4 .customize-section-title:after {
    5         right: auto;
    6         left: 20px;
    7 }
    8 
    91#customize-header-actions .button-primary {
    102        float: left;
    113}

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

     
    66        text-decoration: none;
    77}
    88
    9 .customize-section {
    10         border-top: 1px solid #fff;
    11         border-bottom: 1px solid #dfdfdf;
    12         margin: 0;
    13 }
    14 
    15 .control-section.customize-section:hover,
    16 .control-section.customize-section.open {
    17         border-top-color: #808080;
    18 }
    19 
    20 .control-section.customize-section:hover {
    21         border-bottom-color: #6d6d6d;
    22 }
    23 
    24 .customize-section.open:hover {
    25         border-bottom-color: #dfdfdf;
    26 }
    27 
    28 .customize-section:last-child {
    29         box-shadow: 0 1px 0 0px #fff;
    30 }
    31 
    32 .customize-section-title {
    33         margin: 0;
    34         padding: 15px 20px;
    35         position: relative;
    36 
    37         cursor: pointer;
    38 
    39         -webkit-user-select: none;
    40         -moz-user-select: none;
    41         user-select: none;
    42 }
    43 
    44 .customize-section-title:focus {
    45         outline: none;
    46 }
    47 
    48 .cannot-expand .customize-section-title {
    49         cursor: auto;
    50 }
    51 
    52 .customize-section-content {
    53         display: none;
    54         padding: 10px 20px 15px;
    55         overflow: hidden;
    56 }
    57 
    58 .control-section .customize-section-title {
    59         padding: 10px 20px;
    60         font-size: 15px;
    61         font-family: Georgia, "Times New Roman", "Bitstream Charter", Times, serif;
    62         font-weight: normal;
    63         text-shadow: 0 1px 0 #fff;
    64         background: #f5f5f5;
    65         background-image: -webkit-gradient(linear, left bottom, left top, from(#eee), to(#f5f5f5));
    66         background-image: -webkit-linear-gradient(bottom, #eee, #f5f5f5);
    67         background-image:    -moz-linear-gradient(bottom, #eee, #f5f5f5);
    68         background-image:      -o-linear-gradient(bottom, #eee, #f5f5f5);
    69         background-image: linear-gradient(to top, #eee, #f5f5f5);
    70 }
    71 
    72 .control-section:hover .customize-section-title,
    73 .control-section .customize-section-title:hover,
    74 .control-section.open .customize-section-title,
    75 .control-section .customize-section-title:focus {
    76         color: #fff;
    77         text-shadow: 0 -1px 0 #333;
    78         background: #808080;
    79         background-image: -webkit-gradient(linear, left bottom, left top, from(#6d6d6d), to(#808080));
    80         background-image: -webkit-linear-gradient(bottom, #6d6d6d, #808080);
    81         background-image:    -moz-linear-gradient(bottom, #6d6d6d, #808080);
    82         background-image:      -o-linear-gradient(bottom, #6d6d6d, #808080);
    83         background-image: linear-gradient(to top, #6d6d6d, #808080);
    84 }
    85 
    86 .control-section.open .customize-section-title {
    87         border-bottom: 1px solid #6d6d6d;
    88 }
    89 
    90 .customize-section.open .customize-section-content {
    91         display: block;
    92         background: #fdfdfd;
    93 }
    94 
    95 .customize-section-title:after {
    96         content: '';
    97         width: 0;
    98         height: 0;
    99         border-color: #ccc transparent;
    100         border-style: solid;
    101         border-width: 6px 6px 0;
    102         position: absolute;
    103         top: 25px;
    104         right: 20px;
    105         z-index: 1;
    106 }
    107 
    108 .cannot-expand .customize-section-title:after {
    109         display: none;
    110 }
    111 
    112 .customize-section-title:hover:after,
    113 .customize-section-title:focus:after {
    114         border-color: #aaa transparent;
    115 }
    116 
    117 .control-section .customize-section-title:hover:after,
    118 .control-section .customize-section-title:focus:after {
    119         border-color: #eee transparent;
    120 }
    121 
    122 .control-section .customize-section-title:after {
    123         top: 15px;
    124 }
    125 
    126 #customize-info .customize-section-content {
     9#customize-info .accordion-section-content {
    12710        background: transparent;
    12811}
    12912
    … …  
    15841}
    15942
    16043#customize-theme-controls > ul,
    161 #customize-theme-controls .customize-section-content {
     44#customize-theme-controls .accordion-section-content {
    16245        margin: 0;
    16346}
    16447
    … …  
    245128/*
    246129 * Dropdowns
    247130 */
    248 .customize-section .dropdown {
     131.accordion-section .dropdown {
    249132        float: left;
    250133        display: block;
    251134        position: relative;
    … …  
    255138        border-radius: 3px;
    256139}
    257140
    258 .customize-section .dropdown-content {
     141.accordion-section .dropdown-content {
    259142        overflow: hidden;
    260143        float: left;
    261144        min-width: 30px;
    … …  
    301184        z-index: 1;
    302185}
    303186
    304 .customize-section .dropdown:hover .dropdown-content,
     187.accordion-section .dropdown:hover .dropdown-content,
    305188.customize-control .dropdown:hover .dropdown-arrow {
    306189        border-color: #aaa;
    307190}
    308191
    309 .customize-section .dropdown:hover .dropdown-arrow:after {
     192.accordion-section .dropdown:hover .dropdown-arrow:after {
    310193        border-color: #aaa transparent;
    311194}
    312195
    … …  
    341224        border-color: rgba( 0, 0, 0, 0.25 );
    342225}
    343226
    344 .customize-section input[type="text"].color-picker-hex {
     227.accordion-section input[type="text"].color-picker-hex {
    345228        width: 65px;
    346229        font-family: monospace;
    347230        text-align: center;
    … …  
    349232}
    350233
    351234/* The centered cursor overlaps the placeholder in webkit. Hide it when selected. */
    352 .customize-section input[type="text"].color-picker-hex:focus::-webkit-input-placeholder {
     235.accordion-section input[type="text"].color-picker-hex:focus::-webkit-input-placeholder {
    353236        color: transparent;
    354237}
    355 .customize-section input[type="text"].color-picker-hex:-moz-placeholder {
     238.accordion-section input[type="text"].color-picker-hex:-moz-placeholder {
    356239        color: #999;
    357240}
    358241
    … …  
    371254        display: block;
    372255}
    373256
    374 .customize-section .customize-control-image .dropdown-content {
     257.accordion-section .customize-control-image .dropdown-content {
    375258        height: auto;
    376259        min-height: 24px;
    377260        min-width: 40px;
    378261        padding: 0;
    379262}
    380263
    381 .customize-section .customize-control-image .dropdown-status {
     264.accordion-section .customize-control-image .dropdown-status {
    382265        padding: 4px 5px;
    383266}
    384267
    385 .customize-section .customize-control-image .preview-thumbnail img {
     268.accordion-section .customize-control-image .preview-thumbnail img {
    386269        display: block;
    387270        width: 100%;
    388271        max-width: 122px;
    … …  
    390273        margin: 0 auto;
    391274}
    392275
    393 .customize-section .customize-control-image .actions {
     276.accordion-section .customize-control-image .actions {
    394277        text-align: right;
    395278}
    396279
    397 .customize-section .customize-control-image .library ul {
     280.accordion-section .customize-control-image .library ul {
    398281        border-bottom: 1px solid #dfdfdf;
    399282        float: left;
    400283        width: 100%;
    401284        margin: 10px 0 0;
    402285}
    403286
    404 .customize-section .customize-control-image .library li {
     287.accordion-section .customize-control-image .library li {
    405288        color: #999;
    406289        float: left;
    407290        padding: 3px 5px;
    … …  
    411294        border-width: 1px 1px 0 1px;
    412295}
    413296
    414 .customize-section .customize-control-image .library li.library-selected {
     297.accordion-section .customize-control-image .library li.library-selected {
    415298        margin-bottom: -1px;
    416299        padding-bottom: 4px;
    417300
    … …  
    422305        border-radius: 3px 3px 0 0 ;
    423306}
    424307
    425 .customize-section .customize-control-image .library-content {
     308.accordion-section .customize-control-image .library-content {
    426309        display: none;
    427310        width: 100%;
    428311        float: left;
    429312        padding: 10px 0;
    430313}
    431314
    432 .customize-section .customize-control-image .library-content.library-selected {
     315.accordion-section .customize-control-image .library-content.library-selected {
    433316        display: block;
    434317}
    435318
    436 .customize-section .customize-control-image .library .thumbnail {
     319.accordion-section .customize-control-image .library .thumbnail {
    437320        display: block;
    438321        width: 100%;
    439322}
    440323
    441 .customize-section .customize-control-image .library .thumbnail:hover img {
     324.accordion-section .customize-control-image .library .thumbnail:hover img {
    442325        border-color: #21759b;
    443326}
    444327
    445 .customize-section .customize-control-image .library .thumbnail img {
     328.accordion-section .customize-control-image .library .thumbnail img {
    446329        display: block;
    447330        max-width: 90%;
    448331        max-height: 80px;
    … …  
    453336        border: 1px solid #dfdfdf;
    454337}
    455338
    456 .customize-section .customize-control-upload .upload-fallback,
    457 .customize-section .customize-control-image .upload-fallback {
     339.accordion-section .customize-control-upload .upload-fallback,
     340.accordion-section .customize-control-image .upload-fallback {
    458341        display: none;
    459342}
    460343
    461 .customize-section .customize-control-upload .upload-dropzone,
    462 .customize-section .customize-control-image .upload-dropzone {
     344.accordion-section .customize-control-upload .upload-dropzone,
     345.accordion-section .customize-control-image .upload-dropzone {
    463346        display: none;
    464347        padding: 15px 10px;
    465348        border: 3px dashed #dfdfdf;
    … …  
    470353        cursor: default;
    471354}
    472355
    473 .customize-section .customize-control-upload .upload-dropzone.supports-drag-drop,
    474 .customize-section .customize-control-image .upload-dropzone.supports-drag-drop {
     356.accordion-section .customize-control-upload .upload-dropzone.supports-drag-drop,
     357.accordion-section .customize-control-image .upload-dropzone.supports-drag-drop {
    475358        display: block;
    476359        -webkit-transition: border-color 0.1s;
    477360        -moz-transition:    border-color 0.1s;
    … …  
    480363        transition:         border-color 0.1s;
    481364}
    482365
    483 .customize-section .customize-control-upload .library ul li,
    484 .customize-section .customize-control-image .library ul li {
     366.accordion-section .customize-control-upload .library ul li,
     367.accordion-section .customize-control-image .library ul li {
    485368        cursor: pointer;
    486369}
    487370
    488 .customize-section .customize-control-upload .upload-dropzone.supports-drag-drop.drag-over,
    489 .customize-section .customize-control-image .upload-dropzone.supports-drag-drop.drag-over {
     371.accordion-section .customize-control-upload .upload-dropzone.supports-drag-drop.drag-over,
     372.accordion-section .customize-control-image .upload-dropzone.supports-drag-drop.drag-over {
    490373        border-color: #83b4d8;
    491374}
    492375