diff --git a/src/wp-content/themes/twentyfifteen/inc/customizer.php b/src/wp-content/themes/twentyfifteen/inc/customizer.php index 99bc051fc2..7c4b401e1a 100644 --- a/src/wp-content/themes/twentyfifteen/inc/customizer.php +++ b/src/wp-content/themes/twentyfifteen/inc/customizer.php @@ -17,8 +17,8 @@ function twentyfifteen_customize_register( $wp_customize ) { $color_scheme = twentyfifteen_get_color_scheme(); - $wp_customize->get_setting( 'blogname' )->transport = 'postMessage'; - $wp_customize->get_setting( 'blogdescription' )->transport = 'postMessage'; + $wp_customize->get_setting( 'blogname' )->transport = 'postMessage'; + $wp_customize->get_setting( 'blogdescription' )->transport = 'postMessage'; // Add color scheme setting and control. $wp_customize->add_setting( 'color_scheme', array( @@ -254,7 +254,7 @@ function twentyfifteen_customize_control_js() { add_action( 'customize_controls_enqueue_scripts', 'twentyfifteen_customize_control_js' ); /** - * Binds JS handlers to make Customizer preview reload changes asynchronously. + * Binds JS handlers to make the Customizer preview reload changes asynchronously. * * @since Twenty Fifteen 1.0 */ @@ -266,6 +266,9 @@ add_action( 'customize_preview_init', 'twentyfifteen_customize_preview_js' ); /** * Output an Underscore template for generating CSS for the color scheme. * + * The template generates the css dynamically for instant display in the Customizer preview, + * and to be saved in a `theme_mod` for display on the front-end. + * * @since Twenty Fifteen 1.0 */ function twentyfifteen_color_scheme_css_template() { @@ -512,7 +515,7 @@ function twentyfifteen_color_scheme_css_template() { /* Sidebar Text Color */ .site-title a:hover, .site-title a:focus { - color: {{ data.sidebar_textcolor2 }}; + color: {{ data.secondary_sidebar_textcolor }}; } /* Sidebar Border Color */ @@ -592,7 +595,7 @@ function twentyfifteen_color_scheme_css_template() { .widget blockquote, .widget .wp-caption-text, .widget .gallery-caption { - color: {{ data.sidebar_textcolor2 }}; + color: {{ data.secondary_sidebar_textcolor }}; } .widget button:hover, @@ -605,11 +608,11 @@ function twentyfifteen_color_scheme_css_template() { .widget input[type="submit"]:focus, .widget_calendar tbody a:hover, .widget_calendar tbody a:focus { - background-color: {{ data.sidebar_textcolor2 }}; + background-color: {{ data.secondary_sidebar_textcolor }}; } .widget blockquote { - border-color: {{ data.sidebar_textcolor2 }}; + border-color: {{ data.secondary_sidebar_textcolor }}; } /* Sidebar Border Color */ diff --git a/src/wp-content/themes/twentyfifteen/js/color-scheme-control.js b/src/wp-content/themes/twentyfifteen/js/color-scheme-control.js index 7b0f05c1cf..1aff097595 100644 --- a/src/wp-content/themes/twentyfifteen/js/color-scheme-control.js +++ b/src/wp-content/themes/twentyfifteen/js/color-scheme-control.js @@ -1,6 +1,7 @@ /* global colorScheme */ /** * Add a listener to the Color Scheme control to update other color controls to new values/defaults. + * Also trigger an update of the Color Scheme CSS when a color is changed. */ ( function( api ) { @@ -45,6 +46,7 @@ } } ); + // Generate the CSS for the current Color Scheme. function getCSS() { var scheme = api( 'color_scheme' )(), colors = _.object( colorSchemeKeys, colorScheme[ scheme ].colors ); @@ -58,7 +60,7 @@ colors['secondary_textcolor'] = Color( colors.textcolor ).toCSS( 'rgba', 0.7 ); colors['border_color'] = Color( colors.textcolor ).toCSS( 'rgba', 0.1 ); colors['border_focus_color'] = Color( colors.textcolor ).toCSS( 'rgba', 0.3 ); - colors['sidebar_textcolor2'] = Color( colors.sidebar_textcolor ).toCSS( 'rgba', 0.7 ); + colors['secondary_sidebar_textcolor'] = Color( colors.sidebar_textcolor ).toCSS( 'rgba', 0.7 ); colors['sidebar_border_color'] = Color( colors.sidebar_textcolor ).toCSS( 'rgba', 0.1 ); colors['sidebar_border_focus_color'] = Color( colors.sidebar_textcolor ).toCSS( 'rgba', 0.3 ); diff --git a/src/wp-content/themes/twentyfifteen/js/customize-preview.js b/src/wp-content/themes/twentyfifteen/js/customize-preview.js index bce815f1c3..75c059dbf8 100644 --- a/src/wp-content/themes/twentyfifteen/js/customize-preview.js +++ b/src/wp-content/themes/twentyfifteen/js/customize-preview.js @@ -10,19 +10,21 @@ .find( '#twentyfifteen-color-scheme-css' ); } - // Site title and description. + // Site title. wp.customize( 'blogname', function( value ) { value.bind( function( to ) { $( '.site-title a' ).text( to ); } ); } ); + // Site tagline. wp.customize( 'blogdescription', function( value ) { value.bind( function( to ) { $( '.site-description' ).text( to ); } ); } ); - + + // Color Scheme CSS. wp.customize( 'color_scheme_css', function( value ) { value.bind( function( to ) { $style.html( to );