WordPress.org
Get WordPress

Make WordPress Core

Ticket #38995: 38995.patch

File 38995.patch, 14.7 KB (added by laurelfulford, 10 years ago)

  • src/wp-content/themes/twentyseventeen/assets/css/ie9.css

     
    44*/
    55
    66.has-header-image.twentyseventeen-front-page .custom-header,
    7 .has-header-image.home.blog .custom-header {
     7.header-video-loaded.twentyseventeen-front-page .custom-header,
     8.has-header-image.home.blog .custom-header,
     9.header-video-loaded.home.blog .custom-header {
    810        height: 300px;
    911}
    1012
    1113.has-header-image .custom-header-image img,
    12 .has-header-image .custom-header-image video,
    13 .has-header-image .custom-header-image iframe {
     14.header-video-loaded .custom-header-image video,
     15.header-video-loaded .custom-header-image iframe {
    1416        min-width: 100%;
    1517}
    1618
    … …  
    1719@media screen and (min-width: 30em) {
    1820
    1921        .has-header-image.twentyseventeen-front-page .custom-header,
     22        .header-video-loaded.twentyseventeen-front-page .custom-header,
    2023        .has-header-image.home.blog .custom-header,
     24        .header-video-loaded.home.blog .custom-header,
    2125        .twentyseventeen-front-page.has-header-image .custom-header-image,
     26        .twentyseventeen-front-page.header-video-loaded .custom-header-image,
    2227        .home.blog.has-header-image .custom-header-image,
     28        .home.blog.header-video-loaded .custom-header-image,
    2329        .panel-image {
    2430                height: 700px;
    2531        }
    … …  
    2834@media screen and (min-width: 48em) {
    2935
    3036        .has-header-image.twentyseventeen-front-page .custom-header,
     37        .header-video-loaded.twentyseventeen-front-page .custom-header,
    3138        .has-header-image.home.blog .custom-header,
     39        .header-video-loaded.home.blog .custom-header,
    3240        .twentyseventeen-front-page.has-header-image .custom-header-image,
     41        .twentyseventeen-front-page.header-video-loaded .custom-header-image,
    3342        .home.blog.has-header-image .custom-header-image,
     43        .home.blog.header-video-loaded .custom-header-image,
    3444        .panel-image {
    3545                height: 1000px;
    3646        }

  • src/wp-content/themes/twentyseventeen/assets/js/customize-preview.js

     
    6060                                        clip: 'auto',
    6161                                        position: 'relative'
    6262                                });
    63                                 $( '.site-branding, .site-branding a, .site-description, .site-description a' ).css({
     63                                $( '.site-title a, .site-description' ).css({
    6464                                        color: to
    6565                                });
    6666                                $( 'body' ).removeClass( 'title-tagline-hidden' );
    … …  
    123123        $.each( [ 'external_header_video', 'header_image', 'header_video' ], function( index, settingId ) {
    124124                wp.customize( settingId, function( setting ) {
    125125                        setting.bind(function() {
    126                                 if ( hasHeaderImage() || ( hasHeaderVideo() && $( 'body' ).hasClass( 'twentyseventeen-front-page' ) ) ) {
     126                                if ( hasHeaderImage() ) {
    127127                                        $( document.body ).addClass( 'has-header-image' );
    128128                                } else {
    129129                                        $( document.body ).removeClass( 'has-header-image' );
    130130                                }
     131
     132                                if( ! hasHeaderVideo() ) {
     133                                        $( document.body ).removeClass( 'header-video-loaded' );
     134                                }
    131135                        } );
    132136                } );
    133137        } );

  • src/wp-content/themes/twentyseventeen/assets/js/global.js

     
    44        // Variables and DOM Caching.
    55        var $body = $( 'body' ),
    66                $customHeader = $body.find( '.custom-header' ),
    7                 $customHeaderImage = $customHeader.find( '.custom-header-image' ),
    87                $branding = $customHeader.find( '.site-branding' ),
    98                $navigation = $body.find( '.navigation-top' ),
    109                $navWrap = $navigation.find( '.wrap' ),
    … …  
    6564                        if ( navIsNotTooTall ) {
    6665
    6766                                // When there's a custom header image, the header offset includes the height of the navigation.
    68                                 if ( isFrontPage && $customHeaderImage.length ) {
     67                                if ( isFrontPage && ( $body.hasClass( 'has-header-image' ) || $body.hasClass( 'header-video-loaded' ) ) ) {
    6968                                        headerOffset = $customHeader.innerHeight() - navigationOuterHeight;
    7069                                } else {
    7170                                        headerOffset = $customHeader.innerHeight();
    … …  
    176175                }
    177176        }
    178177
     178        /*
     179         * Add a class when the custom header video is loaded.
     180         * Used for styles that should only be applied when a video is on page. Similar to `.has-header-image` class.
     181         */
     182        $( document ).on( 'wp-custom-header-video-loaded', function () {
     183                // Apply only on the front page.
     184                if ( isFrontPage ) {
     185                        $body.addClass( 'header-video-loaded' );
     186                }
     187        } );
     188
    179189        // Fire on document ready.
    180190        $( document ).ready( function() {
    181191

  • src/wp-content/themes/twentyseventeen/inc/color-patterns.php

     
    443443.colors-custom .next.page-numbers:focus,
    444444.colors-custom .next.page-numbers:hover,
    445445.colors-custom.has-header-image .site-title,
     446.colors-custom.header-video-loaded .site-title,
    446447.colors-custom.has-header-image .site-title a,
    447 .colors-custom.has-header-image .site-description {
     448.colors-custom.header-video-loaded .site-title a,
     449.colors-custom.has-header-image .site-description,
     450.colors-custom.header-video-loaded .site-description {
    448451        color: hsl( ' . $hue . ', ' . $saturation . ', 100% ); /* base: #fff; */
    449452}
    450453

  • src/wp-content/themes/twentyseventeen/inc/custom-header.php

     
    8787                .colors-dark .site-title a,
    8888                .colors-custom .site-title a,
    8989                body.has-header-image .site-title a,
     90                body.header-video-loaded .site-title a,
    9091                body.has-header-image.colors-dark .site-title a,
     92                body.header-video-loaded.colors-dark .site-title a,
    9193                body.has-header-image.colors-custom .site-title a,
     94                body.header-video-loaded.colors-custom .site-title a,
    9295                .site-description,
    9396                .colors-dark .site-description,
    9497                .colors-custom .site-description,
    9598                body.has-header-image .site-description,
     99                body.header-video-loaded .site-description,
    96100                body.has-header-image.colors-dark .site-description,
    97                 body.has-header-image.colors-custom .site-description {
     101                body.header-video-loaded.colors-dark .site-description,
     102                body.has-header-image.colors-custom .site-description,
     103                body.header-video-loaded.colors-custom .site-description {
    98104                        color: #<?php echo esc_attr( $header_text_color ); ?>;
    99105                }
    100106        <?php endif; ?>

  • src/wp-content/themes/twentyseventeen/inc/template-functions.php

     
    3434                $classes[] = 'twentyseventeen-front-page';
    3535        }
    3636
    37         // Add a class if there is a custom header.
    38         if ( has_header_image() || has_header_video() && is_front_page() ) {
     37        // Add a class if there is a custom header image.
     38        if ( has_header_image() && is_front_page() ) {
    3939                $classes[] = 'has-header-image';
    4040        }
    4141

  • src/wp-content/themes/twentyseventeen/style.css

     
    15801580        opacity: 1; /* Prevent opacity from changing during selective refreshes in the customize preview */
    15811581}
    15821582
    1583 body.has-header-image .site-title,
    1584 body.has-header-image .site-title a {
     1583body.has-header-image .site-title a,
     1584body.header-video-loaded .site-title a {
    15851585        color: #fff;
    15861586}
    15871587
    … …  
    15921592        margin-bottom: 0;
    15931593}
    15941594
    1595 body.has-header-image .site-description {
     1595body.has-header-image .site-description,
     1596body.header-video-loaded .site-description {
    15961597        color: #fff;
    15971598        opacity: 0.8;
    15981599}
    … …  
    16101611        width: auto;
    16111612}
    16121613
    1613 body.home.title-tagline-hidden.has-header-image .custom-logo-link img {
     1614body.home.title-tagline-hidden.has-header-image .custom-logo-link img,
     1615body.home.title-tagline-hidden.header-video-loaded .custom-logo-link img {
    16141616        max-height: 200px;
    16151617        max-width: 100%;
    16161618}
    … …  
    16301632}
    16311633
    16321634.has-header-image.twentyseventeen-front-page .custom-header,
    1633 .has-header-image.home.blog .custom-header {
     1635.has-header-image.home.blog .custom-header,
     1636.header-video-loaded.twentyseventeen-front-page .custom-header,
     1637.header-video-loaded.home.blog .custom-header {
    16341638        display: table;
    16351639        height: 300px;
    16361640        height: 75vh;
    … …  
    16371641        width: 100%;
    16381642}
    16391643
    1640 .custom-header-image {
     1644.has-header-image .custom-header-image,
     1645.header-video-loaded .custom-header-image {
    16411646        bottom: 0;
    16421647        left: 0;
    16431648        overflow: hidden;
    … …  
    16471652        width: 100%;
    16481653}
    16491654
    1650 .custom-header-image:before {
     1655.has-header-image .custom-header-image:before,
     1656.header-video-loaded .custom-header-image:before {
    16511657        /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,000000+100&0+0,0.3+75 */
    16521658        background: -moz-linear-gradient(to top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.3) 75%, rgba(0, 0, 0, 0.3) 100%); /* FF3.6-15 */
    16531659        background: -webkit-linear-gradient(to top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.3) 75%, rgba(0, 0, 0, 0.3) 100%); /* Chrome10-25,Safari5.1-6 */
    … …  
    16641670}
    16651671
    16661672.has-header-image .custom-header-image img,
    1667 .has-header-image .custom-header-image video,
    1668 .has-header-image .custom-header-image iframe {
     1673.header-video-loaded .custom-header-image video,
     1674.header-video-loaded .custom-header-image iframe {
    16691675        position: fixed;
    16701676        height: auto;
    16711677        left: 50%;
    … …  
    17201726
    17211727/* Hides div in Customizer preview when header images or videos change. */
    17221728
    1723 body:not(.has-header-image) .custom-header-image {
     1729body:not(.has-header-image):not(.header-video-loaded) .custom-header-image {
    17241730        display: none;
    17251731}
    17261732
    17271733.has-header-image.twentyseventeen-front-page .site-branding,
    1728 .has-header-image.home.blog .site-branding {
     1734.has-header-image.home.blog .site-branding,
     1735.header-video-loaded.twentyseventeen-front-page .site-branding,
     1736.header-video-loaded.home.blog .site-branding {
    17291737        display: table-cell;
    17301738        height: 100%;
    17311739        vertical-align: bottom;
    … …  
    32713279        }
    32723280
    32733281        .has-header-image.twentyseventeen-front-page .site-branding,
    3274         .has-header-image.home.blog .site-branding {
     3282        .has-header-image.home.blog .site-branding,
     3283        .header-video-loaded.twentyseventeen-front-page .site-branding,
     3284        .header-video-loaded.home.blog .site-branding {
    32753285                bottom: 0;
    32763286                display: block;
    32773287                left: 0;
    … …  
    32823292        }
    32833293
    32843294        .has-header-image.twentyseventeen-front-page .custom-header,
    3285         .has-header-image.home.blog .custom-header {
     3295        .has-header-image.home.blog .custom-header,
     3296        .header-video-loaded.twentyseventeen-front-page .custom-header,
     3297        .header-video-loaded.home.blog .custom-header {
    32863298                display: block;
    32873299                height: auto;
    32883300        }
    … …  
    32933305        }
    32943306
    32953307        .twentyseventeen-front-page.has-header-image .custom-header-image,
    3296         .home.blog.has-header-image .custom-header-image {
     3308        .home.blog.has-header-image .custom-header-image,
     3309        .twentyseventeen-front-page.header-video-loaded .custom-header-image,
     3310        .home.blog.header-video-loaded .custom-header-image {
    32973311                height: 0;
    32983312                position: relative;
    32993313        }
    33003314
    3301         .has-header-image:not(.twentyseventeen-front-page):not(.home) .custom-header-image {
     3315        .has-header-image:not(.twentyseventeen-front-page):not(.home) .custom-header-image,
     3316        .header-video-loaded:not(.twentyseventeen-front-page):not(.home) .custom-header-image {
    33023317                bottom: 0;
    33033318                height: auto;
    33043319                left: 0;
    … …  
    33123327        }
    33133328
    33143329        .custom-logo-link img,
    3315         body.home.title-tagline-hidden.has-header-image .custom-logo-link img {
     3330        body.home.title-tagline-hidden.has-header-image .custom-logo-link img,
     3331        body.home.title-tagline-hidden.header-video-loaded .custom-logo-link img {
    33163332                max-width: 350px;
    33173333        }
    33183334
    3319         .title-tagline-hidden.home.has-header-image .custom-logo-link img {
     3335        .title-tagline-hidden.home.has-header-image .custom-logo-link img,
     3336        .title-tagline-hidden.home.header-video-loaded .custom-logo-link img {
    33203337                max-height: 200px;
    33213338        }
    33223339
    … …  
    35783595        /* Front Page */
    35793596
    35803597        .twentyseventeen-front-page.has-header-image .site-branding,
    3581         .home.blog.has-header-image .site-branding {
     3598        .home.blog.has-header-image .site-branding,
     3599        .twentyseventeen-front-page.header-video-loaded .site-branding,
     3600        .home.blog.header-video-loaded .site-branding {
    35823601                margin-bottom: 70px;
    35833602        }
    35843603
    35853604        .twentyseventeen-front-page.has-header-image .custom-header-image,
    3586         .home.blog.has-header-image .custom-header-image {
     3605        .home.blog.has-header-image .custom-header-image,
     3606        .twentyseventeen-front-page.header-video-loaded .custom-header-image,
     3607        .home.blog.header-video-loaded .custom-header-image {
    35873608                height: 1200px;
    35883609                height: 100vh;
    35893610                max-height: 100%;
    … …  
    35913612        }
    35923613
    35933614        .twentyseventeen-front-page.has-header-image .custom-header-image:before,
    3594         .home.blog.has-header-image .custom-header-image:before {
     3615        .home.blog.has-header-image .custom-header-image:before,
     3616        .twentyseventeen-front-page.header-video-loaded .custom-header-image:before,
     3617        .home.blog.header-video-loaded .custom-header-image:before {
    35953618                height: 33%;
    35963619        }
    35973620
    35983621        .admin-bar.twentyseventeen-front-page.has-header-image .custom-header-image,
    3599         .admin-bar.home.blog.has-header-image .custom-header-image {
     3622        .admin-bar.home.blog.has-header-image .custom-header-image,
     3623        .admin-bar.twentyseventeen-front-page.header-video-loaded .custom-header-image,
     3624        .admin-bar.home.blog.header-video-loaded .custom-header-image {
    36003625                height: calc(100vh - 32px);
    36013626        }
    36023627
    … …  
    41114136        }
    41124137
    41134138        .twentyseventeen-front-page.has-header-image .site-branding,
    4114         .home.blog.has-header-image .site-branding {
     4139        .home.blog.has-header-image .site-branding,
     4140        .twentyseventeen-front-page.header-video-loaded .site-branding,
     4141        .home.blog.header-video-loaded .site-branding {
    41154142                position: relative;
    41164143        }
    41174144
    … …  
    41494176        body,
    41504177        a,
    41514178        .site-title a,
    4152         .twentyseventeen-front-page.has-header-image .site-title,
    4153         .twentyseventeen-front-page.has-header-image .site-title a {
     4179        .twentyseventeen-front-page.has-header-image .site-title a,
     4180        .twentyseventeen-front-page.header-video-loaded .site-title a {
    41544181                color: #222 !important; /* Make sure color schemes don't affect to print */
    41554182        }
    41564183
    … …  
    41594186        blockquote,
    41604187        .site-description,
    41614188        .twentyseventeen-front-page.has-header-image .site-description,
     4189        .twentyseventeen-front-page.header-video-loaded .site-description,
    41624190        .entry-meta,
    41634191        .entry-meta a {
    41644192                color: #777 !important; /* Make sure color schemes don't affect to print */