WordPress.org

Make WordPress Core

Changeset 20791


Ignore:
Timestamp:
05/15/2012 01:03:31 AM (7 years ago)
Author:
koopersmith
Message:

Theme Customizer: Prevent sidebar scrollbar from overlapping sidebar header or footer. fixes #20649, #20650, see #19910.

Location:
trunk
Files:
4 edited

Legend:

Unmodified
Added
Removed
  • trunk/wp-admin/css/wp-admin.dev.css

    r20789 r20791  
    52865286
    52875287.wp-full-overlay.collapsed,
    5288 .wp-full-overlay.collapsed div.wp-full-overlay-header,
    5289 .wp-full-overlay.collapsed div.wp-full-overlay-footer {
     5288.wp-full-overlay.collapsed .wp-full-overlay-sidebar > div {
    52905289    left: -302px;
    52915290}
     
    53005299    overflow: auto;
    53015300    background: #f5f5f5;
    5302     box-shadow: inset -11px 0 8px -8px rgba( 0, 0, 0, 0.1 );
    53035301    border-right: 1px solid rgba( 0, 0, 0, 0.2 );
    53045302}
     
    53065304.wp-full-overlay.collapsed .wp-full-overlay-sidebar {
    53075305    overflow: visible;
     5306}
     5307
     5308.wp-full-overlay-sidebar:after {
     5309    content: '';
     5310    display: block;
     5311    position: absolute;
     5312    top: 0;
     5313    bottom: 0;
     5314    right: 0;
     5315    width: 8px;
     5316    box-shadow: inset -11px 0 8px -8px rgba( 0, 0, 0, 0.1 );
     5317    z-index: 1000;
    53085318}
    53095319
     
    53205330}
    53215331
    5322 .wp-full-overlay-sidebar div.wp-full-overlay-header,
    5323 .wp-full-overlay-sidebar div.wp-full-overlay-footer {
     5332.wp-full-overlay-sidebar .wp-full-overlay-header,
     5333.wp-full-overlay-sidebar .wp-full-overlay-footer {
    53245334    position: fixed;
    53255335    left: 0;
    53265336    width: 260px;
    5327     padding: 15px 20px;
    5328     min-height: 16px;
     5337    height: 45px;
     5338    padding: 0 20px;
     5339    line-height: 45px;
     5340    z-index: 10;
    53295341    margin: 0;
    5330     z-index: 10;
    5331     background: #f5f5f5;
    5332 }
    5333 
    5334 .wp-full-overlay-sidebar div.wp-full-overlay-header {
     5342}
     5343
     5344.wp-full-overlay-sidebar .wp-full-overlay-header {
    53355345    top: 0;
    53365346    border-top: 0;
    53375347    border-bottom: 1px solid #fff;
    5338     box-shadow:
    5339         inset -11px 0 8px -8px rgba( 0, 0, 0, 0.1 ),
    5340         inset 0 -1px 0 0px #dfdfdf;
    5341 }
    5342 
    5343 .wp-full-overlay-sidebar div.wp-full-overlay-footer {
     5348    box-shadow: inset 0 -1px 0 0px #dfdfdf;
     5349}
     5350
     5351.wp-full-overlay-sidebar .wp-full-overlay-footer {
    53445352    bottom: 0;
    53455353    border-bottom: 0;
    53465354    border-top: 1px solid #dfdfdf;
    5347     box-shadow:
    5348         inset -11px 0 8px -8px rgba( 0, 0, 0, 0.1 ),
    5349         inset 0 1px 0 0px #fff;
     5355    box-shadow: inset 0 1px 0 0px #fff;
     5356}
     5357
     5358.wp-full-overlay-sidebar .wp-full-overlay-sidebar-content {
     5359    position: fixed;
     5360    top: 45px;
     5361    bottom: 45px;
     5362    width: 300px;
     5363    overflow: auto;
    53505364}
    53515365
     
    53665380.wp-full-overlay .collapse-sidebar {
    53675381    position: absolute;
    5368     bottom: 13px;
     5382    bottom: 12px;
    53695383    left: 265px;
    53705384    z-index: 50;
     
    54145428.wp-full-overlay,
    54155429.wp-full-overlay .collapse-sidebar,
    5416 .wp-full-overlay-sidebar div.wp-full-overlay-header,
    5417 .wp-full-overlay-sidebar div.wp-full-overlay-footer,
     5430.wp-full-overlay-sidebar > div,
    54185431.wp-full-overlay-main {
    54195432    -moz-transition-property: left, right, top, bottom;
     
    54815494.install-theme-info {
    54825495    display: none;
    5483     padding: 45px 20px 15px;
     5496    padding: 10px 20px 20px;
    54845497}
    54855498
     
    55075520    width: 258px;
    55085521    border: 1px solid #ccc;
     5522}
     5523
     5524.install-theme-info .theme-details {
     5525    overflow: hidden;
    55095526}
    55105527
  • trunk/wp-admin/includes/class-wp-theme-install-list-table.php

    r20765 r20791  
    259259            <div class="wp-full-overlay-sidebar">
    260260                <div class="wp-full-overlay-header"></div>
    261                 <div class="install-theme-info"></div>
     261                <div class="wp-full-overlay-sidebar-content">
     262                    <div class="install-theme-info"></div>
     263                </div>
    262264                <div class="wp-full-overlay-footer"></div>
    263265            </div>
  • trunk/wp-includes/css/customize-controls.dev.css

    r20777 r20791  
    100100}
    101101
    102 #customize-info {
    103     margin-top: 45px;
    104 }
    105 
    106102#customize-info .preview-notice {
    107103    font-size: 13px;
     
    133129}
    134130
    135 #customize-theme-controls {
    136     padding-bottom: 60px;
    137 }
    138 
    139131#customize-theme-controls > ul,
    140132#customize-theme-controls .customize-section-content {
     
    145137    display: none;
    146138    position: absolute;
    147     top: 18px;
     139    top: 15px;
    148140    margin-left: 4px;
    149141}
     
    151143.saving #customize-footer-actions img {
    152144    display: inline;
     145}
     146
     147#customize-footer-actions .button-primary {
     148    display: inline-block;
     149    margin-top: 12px;
    153150}
    154151
  • trunk/wp-includes/customize-controls.php

    r20737 r20791  
    4444    <form id="customize-controls" class="wrap wp-full-overlay-sidebar">
    4545        <?php wp_nonce_field( 'customize_controls' ); ?>
    46         <div id="customize-header-actions" class="customize-section wp-full-overlay-header">
     46        <div id="customize-header-actions" class="wp-full-overlay-header">
    4747            <a class="back" href="<?php echo esc_url( admin_url( 'themes.php' ) ); ?>">
    4848                <?php printf( __( '&larr; Return to %s' ), __('Manage Themes') ); ?>
     
    5050        </div>
    5151
    52         <div id="customize-info" class="customize-section">
    53             <div class="customize-section-title">
    54                 <span class="preview-notice"><?php _e('You are previewing'); ?></span>
    55                 <strong class="theme-name"><?php echo $this->theme->display('Name'); ?></strong>
     52        <div class="wp-full-overlay-sidebar-content">
     53            <div id="customize-info" class="customize-section">
     54                <div class="customize-section-title">
     55                    <span class="preview-notice"><?php _e('You are previewing'); ?></span>
     56                    <strong class="theme-name"><?php echo $this->theme->display('Name'); ?></strong>
     57                </div>
     58                <div class="customize-section-content">
     59                    <?php if ( $screenshot = $this->theme->get_screenshot() ) : ?>
     60                        <img class="theme-screenshot" src="<?php echo esc_url( $screenshot ); ?>" />
     61                    <?php endif; ?>
     62
     63                    <?php if ( $this->theme->get('Description') ): ?>
     64                        <div class="theme-description"><?php echo $this->theme->display('Description'); ?></div>
     65                    <?php endif; ?>
     66                </div>
    5667            </div>
    57             <div class="customize-section-content">
    58                 <?php if ( $screenshot = $this->theme->get_screenshot() ) : ?>
    59                     <img class="theme-screenshot" src="<?php echo esc_url( $screenshot ); ?>" />
    60                 <?php endif; ?>
    6168
    62                 <?php if ( $this->theme->get('Description') ): ?>
    63                     <div class="theme-description"><?php echo $this->theme->display('Description'); ?></div>
    64                 <?php endif; ?>
    65             </div>
     69            <div id="customize-theme-controls"><ul>
     70                <?php
     71                foreach ( $this->sections as $section )
     72                    $section->maybe_render();
     73                ?>
     74            </ul></div>
    6675        </div>
    6776
    68         <div id="customize-theme-controls"><ul>
    69             <?php
    70             foreach ( $this->sections as $section )
    71                 $section->maybe_render();
    72             ?>
    73         </ul></div>
    74 
    75         <div id="customize-footer-actions" class="customize-section wp-full-overlay-footer">
     77        <div id="customize-footer-actions" class="wp-full-overlay-footer">
    7678            <?php
    7779            $save_text = $this->get_stylesheet() == $this->original_stylesheet ? __('Save') : __('Save and Activate');
Note: See TracChangeset for help on using the changeset viewer.