WordPress.org
Get WordPress

Make WordPress Core

Ticket #32819: 32819.patch

File 32819.patch, 10.4 KB (added by afercia, 9 years ago)

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

     
    639639        border-right: 1px solid #ddd;
    640640}
    641641
    642 .collapse-sidebar {
    643         background-color: transparent !important;
    644         border: none !important;
    645         -webkit-box-shadow: none !important;
    646         box-shadow: none !important;
    647         -webkit-border-radius: 0 !important;
    648         border-radius: 0 !important;
    649 }
    650 
    651 
    652 .collapse-sidebar:active,
    653 .collapse-sidebar:active .collapse-sidebar-label,
    654 .collapse-sidebar:active .collapse-sidebar-arrow:before {
    655         text-shadow: none;
    656 }
    657 
    658 .collapsed .collapse-sidebar-arrow:before {
    659         color: #82878c;
    660 }
    661 
    662642/* Style for custom settings */
    663643
    664644/*

  • src/wp-admin/css/customize-nav-menus.css

     
    374374        display: block;
    375375}
    376376
    377 
    378 /* Not exactly sure what broke this, or why it works without these styles in core. */
    379 .wp-customizer .wp-full-overlay a.collapse-sidebar {
    380         position: fixed;
    381         left: 0;
    382 }
    383 
    384377/* WARNING: The 20px factor is hard-coded in JS. */
    385378.menu-item-depth-0  { margin-left: 0;     }
    386379.menu-item-depth-1  { margin-left: 20px;  }

  • src/wp-admin/css/themes.css

     
    512512        content: "\f345";
    513513}
    514514
    515 
    516 
    517515.theme-overlay .theme-wrap {
    518516        clear: both;
    519517        position: fixed;
    … …  
    14771475}
    14781476
    14791477/* Collapse Button */
    1480 .wp-full-overlay a.collapse-sidebar {
    1481         position: absolute;
    1482         bottom: 12px;
    1483         left: 0;
    1484         z-index: 50;
    1485         display: block;
    1486         width: 19px;
    1487         height: 19px;
    1488         margin-left: 15px;
     1478.wp-core-ui .wp-full-overlay .collapse-sidebar {
     1479        position: fixed;
     1480        bottom: 8px;
     1481        left: 10px;
    14891482        padding: 0;
    1490         -webkit-border-radius: 50%;
    1491         border-radius: 50%;
    1492         color: #777;
    1493         text-decoration: none;
     1483        color: #656a6f;
     1484        outline: 0;
     1485        line-height: 1;
     1486        background-color: transparent !important;
     1487        border: none !important;
     1488        -webkit-box-shadow: none !important;
     1489        box-shadow: none !important;
     1490        -webkit-border-radius: 0 !important;
     1491        border-radius: 0 !important;
    14941492}
    14951493
    1496 .wp-full-overlay a.collapse-sidebar:hover {
     1494.wp-core-ui .wp-full-overlay .collapse-sidebar:hover,
     1495.wp-core-ui .wp-full-overlay .collapse-sidebar:focus {
    14971496        color: #0073aa;
    14981497}
    14991498
    1500 .wp-full-overlay.collapsed .collapse-sidebar {
    1501         position: absolute;
    1502         left: 100%;
     1499.wp-full-overlay .collapse-sidebar-arrow,
     1500.wp-full-overlay .collapse-sidebar-label {
     1501        display: inline-block;
     1502        vertical-align: middle;
     1503        line-height: 20px;
    15031504}
    15041505
    15051506.wp-full-overlay .collapse-sidebar-arrow {
    1506         position: static;
    1507         margin-top: 0;
    1508         margin-left: 0;
    1509         display: block;
    1510         width: auto;
    1511         height: auto;
    1512         background: none;
     1507        width: 20px;
     1508        height: 20px;
     1509        margin: 0 2px; /* avoid the focus box-shadow to be cut-off */
     1510        -webkit-border-radius: 50%;
     1511        border-radius: 50%;
     1512        overflow: hidden;
    15131513}
    15141514
     1515.wp-full-overlay .collapse-sidebar:hover .collapse-sidebar-arrow,
     1516.wp-full-overlay .collapse-sidebar:focus .collapse-sidebar-arrow {
     1517    -webkit-box-shadow:
     1518        0 0 0 1px #5b9dd9,
     1519                0 0 2px 1px rgba(30, 140, 190, .8);
     1520    box-shadow:
     1521        0 0 0 1px #5b9dd9,
     1522                0 0 2px 1px rgba(30, 140, 190, .8);
     1523}
     1524
     1525.wp-full-overlay .collapse-sidebar-label {
     1526        margin-left: 3px;
     1527}
     1528
     1529.wp-full-overlay.collapsed .collapse-sidebar-label {
     1530        display: none;
     1531}
     1532
    15151533.wp-full-overlay .collapse-sidebar-arrow:before {
    1516         -webkit-border-radius: 50%;
    1517         border-radius: 50%;
    1518         float: left;
     1534        display: block;
    15191535        content: "\f148";
    15201536        background: #eee;
    15211537        font: normal 20px/1 'dashicons';
    15221538        speak: none;
    1523         display: block;
    15241539        padding: 0;
    1525         text-indent: 0;
    1526         text-align: center;
    1527         position: relative;
    15281540        -webkit-font-smoothing: antialiased;
    15291541        -moz-osx-font-smoothing: grayscale;
    1530         text-decoration: none !important;
    15311542}
    15321543
    15331544/* rtl:ignore */
    15341545.wp-full-overlay.collapsed .collapse-sidebar-arrow:before,
    15351546.rtl .wp-full-overlay .collapse-sidebar-arrow:before {
    1536         -webkit-transform: rotate(180deg);
    1537         -ms-transform: rotate(180deg);
    1538         transform: rotate(180deg);
     1547        -webkit-transform: rotate(180.001deg);
     1548        -ms-transform: rotate(180.001deg);
     1549        transform: rotate(180.001deg); /* Firefox: promoting to its own layer to trigger anti-aliasing  */
    15391550}
    15401551
    15411552.rtl .wp-full-overlay.collapsed .collapse-sidebar-arrow:before {
    … …  
    15441555        transform: none;
    15451556}
    15461557
    1547 .wp-full-overlay.collapsed .collapse-sidebar-arrow {
    1548         background-position: -1px -109px;
    1549 }
    1550 
    1551 .wp-full-overlay .collapse-sidebar-label {
    1552         position: absolute;
    1553         left: 100%;
    1554         line-height: 20px;
    1555         margin-left: 10px;
    1556 }
    1557 
    1558 .wp-full-overlay.collapsed .collapse-sidebar-label {
    1559         display: none;
    1560 }
    1561 
    15621558/* Animations */
    15631559.wp-full-overlay,
    15641560.wp-full-overlay-sidebar,
    … …  
    16191615        transition: opacity 0.3s;
    16201616}
    16211617
    1622 #customize-container .collapse-sidebar {
    1623         bottom: 16px;
    1624 }
    1625 
    16261618#customize-controls {
    16271619        margin-top: 0;
    16281620}

  • src/wp-admin/customize.php

     
    166166                </div>
    167167
    168168                <div id="customize-footer-actions" class="wp-full-overlay-footer">
    169                         <a href="#" class="collapse-sidebar button-secondary" title="<?php esc_attr_e('Collapse Sidebar'); ?>">
     169                        <button type="button" class="collapse-sidebar button-secondary" aria-expanded="true" aria-label="<?php esc_attr_e( 'Collapse Sidebar' ); ?>">
    170170                                <span class="collapse-sidebar-arrow"></span>
    171171                                <span class="collapse-sidebar-label"><?php _e('Collapse'); ?></span>
    172                         </a>
     172                        </button>
    173173                </div>
    174174        </form>
    175175        <div id="customize-preview" class="wp-full-overlay-main"></div>

  • src/wp-admin/includes/class-wp-theme-install-list-table.php

     
    328328                                        <div class="install-theme-info"></div>
    329329                                </div>
    330330                                <div class="wp-full-overlay-footer">
    331                                         <a href="#" class="collapse-sidebar" title="<?php esc_attr_e('Collapse Sidebar'); ?>">
     331                                        <button type="button" class="collapse-sidebar button-secondary" aria-expanded="true" aria-label="<?php esc_attr_e( 'Collapse Sidebar' ); ?>">
     332                                                <span class="collapse-sidebar-arrow"></span>
    332333                                                <span class="collapse-sidebar-label"><?php _e('Collapse'); ?></span>
    333                                                 <span class="collapse-sidebar-arrow"></span>
    334                                         </a>
     334                                        </button>
    335335                                </div>
    336336                        </div>
    337337                        <div class="wp-full-overlay-main"></div>

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

     
    30863086                        event.preventDefault();
    30873087                });
    30883088
    3089                 $('.collapse-sidebar').on( 'click keydown', function( event ) {
    3090                         if ( api.utils.isKeydownButNotEnterEvent( event ) ) {
    3091                                 return;
     3089                $( '.collapse-sidebar' ).on( 'click', function() {
     3090                        if ( 'true' === $( this ).attr( 'aria-expanded' ) ) {
     3091                                $( this ).attr({ 'aria-expanded': 'false', 'aria-label': api.l10n.expandSidebar });
     3092                        } else {
     3093                                $( this ).attr({ 'aria-expanded': 'true', 'aria-label': api.l10n.collapseSidebar });
    30923094                        }
    30933095
    30943096                        overlay.toggleClass( 'collapsed' ).toggleClass( 'expanded' );
    3095                         event.preventDefault();
    30963097                });
    30973098
    30983099                $( '.customize-controls-preview-toggle' ).on( 'click keydown', function( event ) {

  • src/wp-admin/js/theme.js

     
    793793                return false;
    794794        },
    795795
    796         collapse: function() {
     796        collapse: function( event ) {
     797                var $button = $( event.currentTarget );
     798                if ( 'true' === $button.attr( 'aria-expanded' ) ) {
     799                        $button.attr({ 'aria-expanded': 'false', 'aria-label': l10n.expandSidebar });
     800                } else {
     801                        $button.attr({ 'aria-expanded': 'true', 'aria-label': l10n.collapseSidebar });
     802                }
    797803
    798804                this.$el.toggleClass( 'collapsed' ).toggleClass( 'expanded' );
    799805                return false;

  • src/wp-admin/theme-install.php

     
    5151                'error'  => __( 'An unexpected error occurred. Something may be wrong with WordPress.org or this server&#8217;s configuration. If you continue to have problems, please try the <a href="https://wordpress.org/support/">support forums</a>.' ),
    5252                'themesFound'   => __( 'Number of Themes found: %d' ),
    5353                'noThemesFound' => __( 'No themes found. Try a different search.' ),
     54                'collapseSidebar'    => __( 'Collapse Sidebar' ),
     55                'expandSidebar'      => __( 'Expand Sidebar' ),
    5456        ),
    5557        'installedThemes' => array_keys( $installed_themes ),
    5658) );
    … …  
    256258                        </div>
    257259                </div>
    258260                <div class="wp-full-overlay-footer">
    259                         <a href="#" class="collapse-sidebar" title="<?php esc_attr_e( 'Collapse Sidebar' ); ?>">
     261                        <button type="button" class="collapse-sidebar button-secondary" aria-expanded="true" aria-label="<?php esc_attr_e( 'Collapse Sidebar' ); ?>">
     262                                <span class="collapse-sidebar-arrow"></span>
    260263                                <span class="collapse-sidebar-label"><?php _e( 'Collapse' ); ?></span>
    261                                 <span class="collapse-sidebar-arrow"></span>
    262                         </a>
     264                        </button>
    263265                </div>
    264266        </div>
    265267        <div class="wp-full-overlay-main">

  • src/wp-includes/script-loader.php

     
    419419                'cheatin'            => __( 'Cheatin&#8217; uh?' ),
    420420                'previewIframeTitle' => __( 'Site Preview' ),
    421421                'loginIframeTitle'   => __( 'Session expired' ),
    422 
     422                'collapseSidebar'    => __( 'Collapse Sidebar' ),
     423                'expandSidebar'      => __( 'Expand Sidebar' ),
    423424                // Used for overriding the file types allowed in plupload.
    424                 'allowedFiles' => __( 'Allowed Files' ),
     425                'allowedFiles'       => __( 'Allowed Files' ),
    425426        ) );
    426427
    427428        $scripts->add( 'customize-widgets', "/wp-admin/js/customize-widgets$suffix.js", array( 'jquery', 'jquery-ui-sortable', 'jquery-ui-droppable', 'wp-backbone', 'customize-controls' ), false, 1 );