Twenty Twelve: better handling for cases where a background color is set to white or an empty value (like first run with no `theme_mods` set) and a background image is enabled, which resulted previously in a broken layout. Fixes #23586, props obenland.

git-svn-id: http://core.svn.wordpress.org/trunk@23568 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
Lance Willett 2013-03-01 17:14:59 +00:00
parent dbdfca5d21
commit 0b6e43ac34
2 changed files with 29 additions and 12 deletions

View File

@ -383,6 +383,7 @@ endif;
*/
function twentytwelve_body_class( $classes ) {
$background_color = get_background_color();
$background_image = get_background_image();
if ( ! is_active_sidebar( 'sidebar-1' ) || is_page_template( 'page-templates/full-width.php' ) )
$classes[] = 'full-width';
@ -395,10 +396,12 @@ function twentytwelve_body_class( $classes ) {
$classes[] = 'two-sidebars';
}
if ( empty( $background_color ) )
$classes[] = 'custom-background-empty';
elseif ( in_array( $background_color, array( 'fff', 'ffffff' ) ) )
$classes[] = 'custom-background-white';
if ( empty( $background_image ) ) {
if ( empty( $background_color ) )
$classes[] = 'custom-background-empty';
elseif ( in_array( $background_color, array( 'fff', 'ffffff' ) ) )
$classes[] = 'custom-background-white';
}
// Enable custom font class only if the font CSS is queued to load.
if ( wp_style_is( 'twentytwelve-fonts', 'queue' ) )
@ -445,6 +448,6 @@ add_action( 'customize_register', 'twentytwelve_customize_register' );
* @since Twenty Twelve 1.0
*/
function twentytwelve_customize_preview_js() {
wp_enqueue_script( 'twentytwelve-customizer', get_template_directory_uri() . '/js/theme-customizer.js', array( 'customize-preview' ), '20120827', true );
wp_enqueue_script( 'twentytwelve-customizer', get_template_directory_uri() . '/js/theme-customizer.js', array( 'customize-preview' ), '20130301', true );
}
add_action( 'customize_preview_init', 'twentytwelve_customize_preview_js' );

View File

@ -18,15 +18,29 @@
} );
} );
// Hook into background color change and adjust body class value as needed.
// Hook into background color/image change and adjust body class value as needed.
wp.customize( 'background_color', function( value ) {
value.bind( function( to ) {
if ( '#ffffff' == to || '#fff' == to )
$( 'body' ).addClass( 'custom-background-white' );
else if ( '' == to )
$( 'body' ).addClass( 'custom-background-empty' );
var body = $( 'body' );
if ( ( '#ffffff' == to || '#fff' == to ) && 'none' == body.css( 'background-image' ) )
body.addClass( 'custom-background-white' );
else if ( '' == to && 'none' == body.css( 'background-image' ) )
body.addClass( 'custom-background-empty' );
else
$( 'body' ).removeClass( 'custom-background-empty custom-background-white' );
body.removeClass( 'custom-background-empty custom-background-white' );
} );
} );
} )( jQuery );
wp.customize( 'background_image', function( value ) {
value.bind( function( to ) {
var body = $( 'body' );
if ( '' != to )
body.removeClass( 'custom-background-empty custom-background-white' );
else if ( 'rgb(255, 255, 255)' == body.css( 'background-color' ) )
body.addClass( 'custom-background-white' );
else if ( 'rgb(230, 230, 230)' == body.css( 'background-color' ) && '' == _wpCustomizeSettings.values.background_color )
body.addClass( 'custom-background-empty' );
} );
} );
} )( jQuery );