Make WordPress Core

Ticket #25554: 25554.3.diff

File 25554.3.diff, 26.2 KB (added by iamtakashi, 13 years ago)
  • wp-content/themes/twentyfourteen/functions.php

     
    239239        if ( is_active_sidebar( 'sidebar-3' ) )
    240240                wp_enqueue_script( 'jquery-masonry' );
    241241
    242         wp_enqueue_script( 'twentyfourteen-theme', get_template_directory_uri() . '/js/theme.js', array( 'jquery' ), '20130820', true );
     242        wp_enqueue_script( 'twentyfourteen-script', get_template_directory_uri() . '/js/functions.js', array( 'jquery' ), '20131011', true );
    243243
    244244        // Add Lato font used in the main stylesheet.
    245245        wp_enqueue_style( 'twentyfourteen-lato', twentyfourteen_font_url(), array(), null );
    … …  
    374374        if ( is_multi_author() )
    375375                $classes[] = 'group-blog';
    376376
     377        if ( get_header_image() )
     378                $classes[] = 'header-image';
     379        else
     380                $classes[] = 'masthead-fixed';
     381
    377382        if ( is_archive() || is_search() || is_home() )
    378383                $classes[] = 'list-view';
    379384
  • wp-content/themes/twentyfourteen/header.php

     
    3939                <div class="header-main">
    4040                        <h1 class="site-title"><a href="<?php echo esc_url( home_url( '/' ) ); ?>" rel="home"><?php bloginfo( 'name' ); ?></a></h1>
    4141
    42                         <div class="header-extra">
    43                                 <div class="search-toggle">
    44                                         <a href="#search-container"><?php _e( 'Search', 'twentyfourteen' ); ?></a>
    45                                 </div>
     42                        <div class="search-toggle">
     43                                <a href="#search-container" class="screen-reader-text"><?php _e( 'Search', 'twentyfourteen' ); ?></a>
    4644                        </div>
    4745
    48                         <nav role="navigation" class="site-navigation primary-navigation">
    49                                 <h1 class="screen-reader-text"><?php _e( 'Primary Menu', 'twentyfourteen' ); ?></h1>
    50                                 <a class="screen-reader-text skip-link" href="#content"><?php _e( 'Skip to content', 'twentyfourteen' ); ?></a></a>
    51                                 <?php wp_nav_menu( array( 'theme_location' => 'primary' ) ); ?>
     46                        <nav id="primary-navigation" class="site-navigation primary-navigation" role="navigation">
     47                                <h1 class="menu-toggle"><?php _e( 'Primary Menu', 'twentyfourteen' ); ?></h1>
     48                                <a class="screen-reader-text skip-link" href="#content"><?php _e( 'Skip to content', 'twentyfourteen' ); ?></a>
     49                                <?php wp_nav_menu( array( 'theme_location' => 'primary', 'menu_class' => 'nav-menu' ) ); ?>
    5250                        </nav>
    5351                </div>
    5452
    55                 <div id="mobile-navigations" class="hide"></div>
    56 
    5753                <div id="search-container" class="search-box-wrapper hide">
    5854                        <div class="search-box clear">
    5955                                <?php get_search_form(); ?>
  • wp-content/themes/twentyfourteen/inc/customizer.php

     
    126126                input[type="button"],
    127127                input[type="reset"],
    128128                input[type="submit"],
    129                 .header-extra,
    130129                .search-toggle,
    131                 .primary-navigation ul ul,
    132                 .primary-navigation li:hover > a,
    133130                .hentry .mejs-controls .mejs-time-rail .mejs-time-current,
    134131                .widget_calendar tbody a {
    135132                        background-color: ' . $accent_color . ';
    136133                }
    137134
     135                @media screen and (min-width: 782px) {
     136                        .primary-navigation ul ul,
     137                        .primary-navigation li:hover > a {
     138                                background-color: ' . $accent_color . ';
     139                        }
     140                }
     141
    138142                ::-moz-selection {
    139143                        background: ' . $accent_color . ';
    140144                }
    … …  
    160164                .search-toggle:hover,
    161165                .search-toggle.active,
    162166                .search-box,
     167                .primary-navigation ul ul a:hover,
    163168                .widget_calendar tbody a:hover {
    164169                        background-color: ' . $accent_lighter . ';
    165170                }
    … …  
    178183                a:focus,
    179184                a:active,
    180185                .site-navigation .current_page_item > a,
     186                .site-navigation .current_page_ancestor > a,
    181187                .site-navigation .current-menu-item > a,
     188                .site-navigation .current-menu-ancestor > a,
    182189                .secondary-navigation a:hover,
    183190                .entry-title a:hover,
    184191                .cat-links a:hover,
  • wp-content/themes/twentyfourteen/js/functions.js

     
     1( function( $ ) {
     2        var body    = $( 'body' ),
     3            _window = $( window );
     4
     5        /**
     6         * Enables menu toggle for small screens.
     7         */
     8        ( function() {
     9                var nav = $( '#primary-navigation' ), button, menu;
     10                if ( ! nav )
     11                        return;
     12
     13                button = nav.find( '.menu-toggle' );
     14                if ( ! button )
     15                        return;
     16
     17                // Hide button if menu is missing or empty.
     18                menu = nav.find( '.nav-menu' );
     19                if ( ! menu || ! menu.children().length ) {
     20                        button.hide();
     21                        return;
     22                }
     23
     24                $( '.menu-toggle' ).on( 'click.twentyfourteen', function() {
     25                        nav.toggleClass( 'toggled-on' );
     26                } );
     27        } )();
     28
     29        /**
     30         * Makes "skip to content" link work correctly in IE9 and Chrome for better
     31         * accessibility.
     32         *
     33         * @link http://www.nczonline.net/blog/2013/01/15/fixing-skip-to-content-links/
     34         */
     35        _window.on( 'hashchange.twentyfourteen', function() {
     36                var element = document.getElementById( location.hash.substring( 1 ) );
     37
     38                if ( element ) {
     39                        if ( ! /^(?:a|select|input|button|textarea)$/i.test( element.tagName ) )
     40                                element.tabIndex = -1;
     41
     42                        element.focus();
     43                };
     44        } );
     45
     46        $( function() {
     47                /**
     48                * Search toggle.
     49                */
     50                $( '.search-toggle' ).on( 'click.twentyfourteen', function() {
     51                        var that    = $( this ),
     52                            wrapper = $( '.search-box-wrapper' );
     53
     54                        that.toggleClass( 'active' );
     55                        wrapper.toggleClass( 'hide' );
     56
     57                        if ( that.is( '.active' ) )
     58                                wrapper.find( '.search-field' ).focus();
     59                } );
     60
     61                /**
     62                 * Fixed navbar.
     63                 *
     64                 * The callback on the scroll event is only added if there is a header
     65                 * image and we are not on mobile.
     66                 */
     67                if ( body.is( '.header-image' ) && _window.width() > 781 ) {
     68                        var toolbarOffset  = body.is( '.admin-bar' ) ? $( '#wpadminbar' ).height() : 0,
     69                            mastheadOffset = $( '#masthead' ).offset().top - toolbarOffset;
     70
     71                        _window.on( 'scroll.twentyfourteen', function() {
     72                                if ( window.scrollY > mastheadOffset )
     73                                        body.addClass( 'masthead-fixed' );
     74                                else
     75                                        body.removeClass( 'masthead-fixed' );
     76                        } );
     77                }
     78
     79                /**
     80                 * Focus styles for primary menu.
     81                 */
     82                $( '.primary-navigation' ).find( 'a' ).on( 'focus.twentyfourteen blur.twentyfourteen', function() {
     83                        $( this ).parents().toggleClass( 'focus' );
     84                } );
     85        } );
     86
     87        /**
     88         * Arranges footer widgets vertically.
     89         */
     90        if ( $.isFunction( $.fn.masonry ) ) {
     91                $( '#footer-sidebar' ).masonry( {
     92                        itemSelector: '.widget',
     93                        columnWidth: function( containerWidth ) {
     94                                return containerWidth / 4;
     95                        },
     96                        gutterWidth: 0,
     97                        isResizable: true,
     98                        isRTL: $( 'body' ).is( '.rtl' )
     99                } );
     100        }
     101} )( jQuery );
     102 No newline at end of file
  • wp-content/themes/twentyfourteen/js/theme.js

    Property changes on: wp-content/themes/twentyfourteen/js/functions.js
    ___________________________________________________________________
    Added: svn:eol-style
    ## -0,0 +1 ##
    +native
    \ No newline at end of property
     
    1 ( function( $ ) {
    2 
    3         $( document ).ready( function() {
    4 
    5                 var $primaryNaviClone,
    6                         $secondaryNaviClone,
    7                         $masthead = $( '#masthead' ),
    8                         $secondaryTop = $( '#secondary-top' ),
    9                         $mobileNavigations = $( '#mobile-navigations'),
    10                         $searchBoxWrapper = $( 'div.search-box-wrapper' ),
    11                         $searchToggle = $( 'div.search-toggle' ),
    12                         timeout = false;
    13 
    14                 // Toggle function.
    15                 function menuToggle() {
    16                         $( 'span#nav-toggle' ).toggleClass( 'active' );
    17                         $masthead.find( '#mobile-navigations' ).toggleClass( 'hide' );
    18                 }
    19 
    20                 // Click event for toggle the search
    21                 $searchToggle.click( function() {
    22                         $( this ).toggleClass( 'active' );
    23                         $searchBoxWrapper.toggleClass( 'hide' );
    24 
    25                         if ( $( this ).hasClass( 'active' ) )
    26                                 $searchBoxWrapper.find( '.search-field' ).focus();
    27                 } );
    28 
    29                 // DOM manipulations for mobile header
    30                 function mobileHeader() {
    31                         // Check if the toggler exists. If not add it.
    32                         if ( ! $( '#nav-toggle' ).length )
    33                         $( '<span id="nav-toggle" class="genericon" />' ).appendTo( $masthead );
    34 
    35                         // Clone and detach the primary navigation for use later
    36                         $primaryNaviClone = $masthead.find( 'nav.primary-navigation' ).detach();
    37 
    38                         // Clone and detach the secondary navigation for use later
    39                         $secondaryNaviClone = $secondaryTop.find( 'nav.secondary-navigation' ).detach();
    40 
    41                         // Prepend the primary navigation clone to #mobile-navigations and remove the class and add an id
    42                         $primaryNaviClone.prependTo( $mobileNavigations ).removeClass( 'primary-navigation' ).addClass( 'mobile-navigation' ).attr( 'id', 'primary-mobile-navigation' );
    43 
    44                         // Append the secondary navigation clone to #mobile-navigations and remove the class and add an id
    45                         $secondaryNaviClone.appendTo( $mobileNavigations ).removeClass( 'secondary-navigation' ).addClass( 'mobile-navigation' ).attr( 'id', 'secondary-mobile-navigation' );
    46 
    47                         // Remove the click event first and bind it after to make sure it's invoked once.
    48                         $( 'span#nav-toggle' ).off( 'click', menuToggle ).click( menuToggle );
    49                 };
    50 
    51                 // DOM manupilations for desktop header
    52                 function normalHeader() {
    53                         // Check if the toggler exists. If it does remove it.
    54                         if ( $( 'span#nav-toggle').length )
    55                         $( 'span#nav-toggle' ).remove();
    56 
    57                         // Clone and detach the primary mobile navigation for use later
    58                         $primaryNaviClone = $mobileNavigations.find( '#primary-mobile-navigation' ).detach();
    59 
    60                         // Clone and detach the secondary mobile navigation for use later
    61                         $secondaryNaviClone = $mobileNavigations.find( '#secondary-mobile-navigation' ).detach();
    62 
    63                         // Append the secondary navigation clone to #mobile-navigations and remove the class and add an id
    64                         $primaryNaviClone.appendTo( '.header-main' ).removeClass( 'mobile-navigation' ).removeAttr( 'id' ).addClass( 'primary-navigation' );
    65 
    66                         // Append the secondary navigation clone to #mobile-navigations and remove the class and add an id
    67                         $secondaryNaviClone.appendTo( $secondaryTop ).removeClass( 'mobile-navigation' ).removeAttr( 'id' ).addClass( 'secondary-navigation' );
    68                 };
    69 
    70                 // Check viewport width when user resizes the browser window.
    71                 $( window ).resize( function() {
    72                         if ( false !== timeout )
    73                                 clearTimeout( timeout );
    74 
    75                         timeout = setTimeout( function() {
    76                                 if ( $( window ).width() < 770 ) {
    77                                         mobileHeader();
    78                                 } else {
    79                                         normalHeader();
    80                                 }
    81                         }, 100 );
    82 
    83                 } ).resize();
    84 
    85                 // Sticky header.
    86                 var $mastheadOffset  = -1,
    87                         $toolbarOffset = $( 'body' ).is( '.admin-bar' ) ? 32 : 0,
    88                         $maindiv = $( '#main' );
    89 
    90                 $( window ).on( 'scroll', false, function() {
    91                         if ( $mastheadOffset < 0 )
    92                                 $mastheadOffset = $masthead.offset().top - $toolbarOffset;
    93 
    94                         if ( ( window.scrollY > $mastheadOffset ) && ( $( window ).width() > 769 ) ) {
    95                                 $masthead.addClass( 'masthead-fixed' );
    96                                 $maindiv.css( {
    97                                         marginTop: $masthead.height()
    98                                 } );
    99                         } else {
    100                                 $masthead.removeClass( 'masthead-fixed' );
    101                                 $maindiv.css( {
    102                                         marginTop: 0
    103                                 } );
    104                         }
    105                 } );
    106 
    107                 // Arranges footer widgets vertically.
    108                 if ( $.isFunction( $.fn.masonry ) ) {
    109 
    110                         $( '#footer-sidebar' ).masonry( {
    111                                 itemSelector: '.widget',
    112                                 columnWidth: 315,
    113                                 gutterWidth: 0,
    114                                 isRTL: $( 'body' ).is( '.rtl' )
    115                         } );
    116                 }
    117 
    118         } );
    119 
    120         /* Focus styles for primary menu. */
    121         $( '.primary-navigation' ).find( 'a' ).on( 'focus.twentyfourteen blur.twentyfourteen', function() {
    122                 $( this ).parents().toggleClass( 'focus' );
    123         });
    124 } )( jQuery );
    125  No newline at end of file
  • wp-content/themes/twentyfourteen/rtl.css

     
    5959/* =Header
    6060----------------------------------------------- */
    6161
    62 .header-main {
    63         margin-left: 48px;
    64         padding-right: 10px;
    65         padding-left: 0;
     62.search-toggle {
     63        float: left;
     64        margin-left: 38px;
    6665        margin-right: auto;
    6766}
    6867
    69 .header-extra {
    70         float: left;
    71 }
    72 
    7368.site-title {
    7469        float: right;
    7570}
    7671
    77 #nav-toggle {
     72.menu-toggle {
    7873        left: 0;
    7974        right: auto;
    8075}
    … …  
    9388----------------------------------------------- */
    9489
    9590/* Primary Navigation */
    96 .primary-navigation {
    97         float: left;
    98         margin: 0 -10px 0 10px;
    99 }
    100 
    10191.primary-navigation ul {
    10292        padding-right: 0;
    10393        padding-left: 0;
    10494}
    10595
     96.primary-navigation ul ul li {
     97        margin-left: auto;
     98        margin-right: 15px;
     99}
     100
    106101.primary-navigation ul ul {
    107         float: right;
    108102        right: -999em;
    109103        left: auto;
    110104}
    … …  
    493487        }
    494488}
    495489
    496 @media screen and (min-width: 770px) {
     490@media screen and (min-width: 782px) {
    497491        .header-main {
     492                padding: 0 27px 0 0;
     493        }
     494
     495        .search-toggle {
    498496                margin-left: 0;
    499                 margin-right: auto;
    500497        }
    501498}
    502499
  • wp-content/themes/twentyfourteen/style.css

     
    411411        -webkit-box-sizing: border-box;
    412412        -moz-box-sizing:    border-box;
    413413        box-sizing:         border-box;
     414        background-image: -webkit-linear-gradient(hsla(0,0%,100%,0), hsla(0,0%,100%,0)); /* Removing the inner shadow, rounded corners on iOS inputs */
    414415}
    415416
    416417button,
    … …  
    728729.comment-reply-link:before,
    729730.comment-reply-login:before,
    730731.contributor-posts-link:before,
     732.menu-toggle:before,
    731733.search-toggle:before,
    732734.widget_twentyfourteen_ephemera .widget-title:before {
    733735        -webkit-font-smoothing: antialiased;
    … …  
    785787}
    786788
    787789.header-main {
    788         margin-right: 48px;
    789790        min-height: 48px;
    790         padding-left: 10px;
     791        padding: 0 10px;
    791792}
    792793
    793 .header-extra {
    794         background-color: #24890d;
    795         float: right;
    796 }
    797 
    798794.site-title {
    799795        display: inline-block;
    800796        float: left;
    … …  
    812808
    813809.search-toggle {
    814810        background-color: #24890d;
    815         -webkit-box-sizing: border-box;
    816         -moz-box-sizing:    border-box;
    817         box-sizing:         border-box;
    818         color: #fff;
    819811        cursor: pointer;
    820         display: block;
    821         float: left;
    822         font-size: 10px;
    823         min-width: 70px;
    824         min-height: 48px;
    825         padding: 25px 10px 0;
    826         position: relative;
     812        float: right;
     813        height: 48px;
     814        margin-right: 38px;
    827815        text-align: center;
    828         text-transform: uppercase;
     816        width: 48px;
    829817}
    830818
    831819.search-toggle:hover,
    … …  
    836824.search-toggle:before {
    837825        color: #fff;
    838826        content: "\f400";
    839         margin-left: -8px;
    840         position: absolute;
    841         top: 9px;
    842         left: 50%;
     827        font-size: 20px;
     828        margin-top: 14px;
    843829}
    844830
    845 .search-toggle a,
    846 .search-toggle a:hover {
    847         color: #fff;
    848 }
    849 
    850831.search-box-wrapper {
    851832        -webkit-box-sizing: border-box;
    852833        -moz-box-sizing:    border-box;
    853834        box-sizing:         border-box;
    854         position: absolute;
     835        position: relative;
    855836        width: 100%;
    856837        z-index: 2;
    857838}
    … …  
    865846        float: right;
    866847        font-size: 13px;
    867848        margin: 12px 10px;
    868         padding: 3px 6px;
    869         width: 326px;
     849        padding: 3px 2px 3px 6px;
     850        width: 240px;
    870851}
    871852
    872 /* Fixed Header */
    873853
    874 .site-header.masthead-fixed {
    875         box-shadow: 0 1px 8px rgba(0, 0, 0, 0.2);
    876         position: fixed;
    877         top: 0;
    878 }
    879 
    880 .admin-bar .site-header.masthead-fixed {
    881         top: 28px;
    882 }
    883 
    884 .admin-bar.mp6 .site-header.masthead-fixed {
    885         top: 32px;
    886 }
    887 
    888 
    889854/**
    890855 * 5.0 Navigations
    891856 * -----------------------------------------------------------------------------
    … …  
    897862}
    898863
    899864.site-navigation .current_page_item > a,
    900 .site-navigation .current-menu-item > a {
     865.site-navigation .current_page_ancestor > a,
     866.site-navigation .current-menu-item > a,
     867.site-navigation .current-menu-ancestor > a {
    901868        color: #55d737;
    902869}
    903870
    … …  
    908875/* Primary Navigation */
    909876
    910877.primary-navigation {
    911         display: none;
    912         float: right;
    913         font-size: 11px;
    914         line-height: 1.6363636363;
    915         margin: 0 10px 0 -10px;
    916 }
    917 
    918 .primary-navigation ul {
    919         margin: 0;
    920         padding-left: 0;
    921 }
    922 
    923 .primary-navigation li {
     878        background-color: #000;
    924879        -webkit-box-sizing: border-box;
    925880        -moz-box-sizing:    border-box;
    926881        box-sizing:         border-box;
    927         display: inline-block;
    928         height: 48px;
    929         line-height: 48px;
    930         position: relative;
     882        font-size: 14px;
     883        margin: 0 auto;
     884        padding-top: 24px;
    931885}
    932886
    933 .primary-navigation a {
    934         display: inline-block;
    935         padding: 0 10px;
    936         text-decoration: none;
    937         white-space: nowrap;
     887.primary-navigation.toggled-on {
     888        border-bottom: 1px solid rgba(255, 255, 255, 0.4);
     889        margin-bottom: 36px;
     890        padding-top: 72px;
    938891}
    939892
    940 .primary-navigation ul ul {
    941         background-color: #24890d;
    942         float: left;
    943         position: absolute;
    944         top: 48px;
    945         left: -999em;
    946         z-index: 99999;
     893.primary-navigation .nav-menu {
     894        display: none;
    947895}
    948896
    949 .primary-navigation li li {
     897.primary-navigation.toggled-on .nav-menu {
    950898        display: block;
    951         height: auto;
    952         line-height: 1.6363636363;
    953899}
    954900
    955 .primary-navigation ul ul ul {
    956         left: -999em;
    957         top: 0;
     901.primary-navigation ul {
     902        list-style: none;
     903        margin: 0;
     904        padding-left: 0;
    958905}
    959906
    960 .primary-navigation ul ul a {
    961         padding: 9px 12px;
    962         white-space: normal;
    963         width: 148px;
     907.primary-navigation li {
     908        border-top: 1px solid rgba(255, 255, 255, 0.2);
    964909}
    965910
    966 .primary-navigation li:hover > a {
    967         background-color: #24890d;
    968         color: #fff;
     911.primary-navigation ul ul li {
     912        margin-left: 15px;
    969913}
    970914
    971 .primary-navigation ul ul a:hover {
    972         background-color: #000;
     915.primary-navigation a {
     916        color: #fff;
     917        display: block;
     918        padding: 7px 0;
     919        text-decoration: none;
    973920}
    974921
    975 .primary-navigation ul li:hover > ul,
    976 .primary-navigation ul li.focus > ul {
    977         left: auto;
     922.primary-navigation a:hover {
     923        color: rgba(255, 255, 255, 0.7);
    978924}
    979925
    980 .primary-navigation ul ul li:hover > ul,
    981 .primary-navigation ul ul li.focus > ul {
    982         left: 100%;
    983 }
    984 
    985926/* Secondary Navigation */
    986927
    987928.secondary-navigation {
    988         border-bottom: 1px solid rgba(255, 255, 255, 0.4);
     929        border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    989930        font-size: 14px;
    990         margin: 0 auto 48px;
    991         max-width: 474px;
     931        margin: 48px 0 0;
    992932}
    993933
    994934.secondary-navigation a {
    995935        display: block;
    996         padding: 7px 0;
     936        padding: 8px 0 9px;
    997937}
    998938
    999939.secondary-navigation a:hover {
    … …  
    1009949}
    1010950
    1011951.secondary-navigation li {
    1012         border-top: 1px solid rgba(255, 255, 255, 0.4);
    1013 }
    1014 
    1015 .secondary-navigation li li {
    1016952        border-top: 1px solid rgba(255, 255, 255, 0.2);
    1017953}
    1018954
    1019 /* Mobile Navigations */
    1020 
    1021 #mobile-navigations {
    1022         margin: 1px auto 0;
    1023         max-width: 474px;
    1024 }
    1025 
    1026 .mobile-navigation {
     955.menu-toggle {
    1027956        background-color: #000;
    1028         -webkit-box-sizing: border-box;
    1029         -moz-box-sizing:    border-box;
    1030         box-sizing:         border-box;
    1031         font-size: 14px;
    1032         padding: 24px 10px 0;
    1033 }
    1034 
    1035 .mobile-navigation ul {
     957        cursor: pointer;
     958        font-size: 0;
     959        height: 16px;
    1036960        margin: 0;
    1037 }
    1038 
    1039 .mobile-navigation li {
    1040         border-top: 1px solid rgba(255, 255, 255, 0.4);
    1041 }
    1042 
    1043 .mobile-navigation li li {
    1044         border-top: 1px solid rgba(255, 255, 255, 0.2);
    1045 }
    1046 
    1047 .mobile-navigation ul ul li {
    1048         margin-left: 15px;
    1049 }
    1050 
    1051 .mobile-navigation a {
    1052         display: block;
    1053         padding: 7px 0;
    1054         text-decoration: none;
    1055 }
    1056 
    1057 .mobile-navigation a:hover {
    1058         color: rgba(255, 255, 255, 0.7);
    1059 }
    1060 
    1061 #nav-toggle {
    1062         background-color: #000;
    1063         cursor: pointer;
    1064         line-height: 1;
    1065961        padding: 16px;
    1066962        position: absolute;
    1067963        top: 0;
    1068964        right: 0;
    1069965}
    1070966
    1071 #nav-toggle:before {
     967.menu-toggle:before {
    1072968        color: #fff;
    1073969        content: "\f419";
    1074970}
    … …  
    11111007        background: #767676;
    11121008        background-attachment: fixed;
    11131009        background-image: -webkit-linear-gradient(135deg, #767676 12.5%, #fff 12.5%, #fff 50%, #767676 50%, #767676 62.5%, #fff 62.5%);
    1114         background-image:         linear-gradient(135deg, #767676 12.5%, #fff 12.5%, #fff 50%, #767676 50%, #767676 62.5%, #fff 62.5%);
    11151010        background-size: 4px 4px;
    11161011        display: none;
    11171012        float: none;
     1013        height: auto;
    11181014        margin: 0;
    11191015        min-height: 180px;
    11201016        position: relative;
    11211017        width: 100%;
    1122         height: auto;
    11231018        z-index: 0;
    11241019}
    11251020
    … …  
    11271022        background: #919191;
    11281023        background-attachment: fixed;
    11291024        background-image: -webkit-linear-gradient(135deg, #919191 12.5%, #fff 12.5%, #fff 50%, #919191 50%, #919191 62.5%, #fff 62.5%);
    1130         background-image:         linear-gradient(135deg, #919191 12.5%, #fff 12.5%, #fff 50%, #919191 50%, #919191 62.5%, #fff 62.5%);
    11311025        background-size: 4px 4px;
    11321026}
    11331027
    … …  
    12791173        border-right: 8px solid #767676;
    12801174        border-bottom: 10px solid transparent;
    12811175        content: "";
     1176        height: 0;
    12821177        position: absolute;
    12831178        top: 0;
    12841179        left: -8px;
    12851180        width: 0;
    1286         height: 0;
    12871181}
    12881182
    12891183.tag-links a:hover:before,
    … …  
    12951189        background-color: #fff;
    12961190        border-radius: 50%;
    12971191        content: "";
     1192        height: 4px;
    12981193        position: absolute;
    12991194        top: 8px;
    13001195        left: -2px;
    13011196        width: 4px;
    1302         height: 4px;
    13031197}
    13041198
    13051199@-moz-document url-prefix() { /* For Firefox to avoid jagged edge */
    … …  
    14261320        background: #fff;
    14271321        border: 1px solid #fff;
    14281322        display: inline-block;
     1323        height: 22px;
    14291324        margin: 0 1px 2px 0;
    14301325        text-align: center;
    14311326        width: 22px;
    1432         height: 22px;
    14331327}
    14341328
    14351329.page-links a {
    … …  
    14461340}
    14471341
    14481342.page-links > span.page-links-title {
     1343        height: auto;
    14491344        margin: 0;
    14501345        padding-right: 9px;
    14511346        width: auto;
    1452         height: auto;
    14531347}
    14541348
    14551349/* More link */
    … …  
    19431837
    19441838.comment-author .avatar {
    19451839        border: 1px solid rgba(0, 0, 0, 0.1);
     1840        height: 18px;
    19461841        padding: 2px;
    19471842        position: absolute;
    19481843        top: 0;
    19491844        left: 0;
    19501845        width: 18px;
    1951         height: 18px;
    19521846}
    19531847
    19541848.bypostauthor .avatar {
    … …  
    20801974
    20811975#secondary {
    20821976        background-color: #000;
    2083         border-bottom: 1px solid rgba(255, 255, 255, 0.2);
     1977        border-top: 1px solid #000;
    20841978        clear: both;
    20851979        color: rgba(255, 255, 255, 0.55);
    20861980        font-size: 14px;
    20871981        line-height: 1.2857142857;
     1982        margin-top: -1px;
    20881983        padding: 0 10px;
    20891984        position: relative;
    20901985        z-index: 2;
    … …  
    21442039
    21452040.widget {
    21462041        margin: 0 auto 48px;
    2147         max-width: 474px;
    2148         overflow: hidden;
     2042        width: 100%;
    21492043}
    21502044
    21512045.widget p {
    … …  
    22392133        background-color: #41a62a;
    22402134}
    22412135
     2136.footer-sidebar .widget_calendar tbody a,
     2137.footer-sidebar .widget_calendar tbody a:hover,
     2138.primary-sidebar .widget_calendar tbody a,
     2139.primary-sidebar .widget_calendar tbody a:hover {
     2140        color: #fff;
     2141}
     2142
    22422143.widget_calendar #prev {
    22432144        padding-left: 5px;
    22442145}
    … …  
    25292430 * -----------------------------------------------------------------------------
    25302431 */
    25312432
     2433#supplementary {
     2434        padding: 0 10px;
     2435}
     2436
    25322437.site-footer {
    25332438        background-color: #000;
    25342439        color: #949a92;
    … …  
    25372442        z-index: 3;
    25382443}
    25392444
    2540 .site-footer .widget {
    2541         -webkit-box-sizing: border-box;
    2542         -moz-box-sizing:    border-box;
    2543         box-sizing:         border-box;
    2544         float: left;
    2545         padding: 0 30px;
    2546         width: 315px;
    2547 }
    2548 
    25492445.footer-sidebar {
    25502446        border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    2551         padding: 48px 10px 0;
     2447        padding-top: 48px;
    25522448}
    25532449
    25542450.site-info {
    … …  
    28872783                padding-left: 30px;
    28882784        }
    28892785
    2890         #secondary {
    2891                 padding: 0 30px;
    2892         }
    2893 
    28942786        .content-sidebar {
    28952787                border: 0;
    28962788                float: right;
    … …  
    29172809        }
    29182810}
    29192811
    2920 @media screen and (min-width: 770px) {
     2812@media screen and (min-width: 782px) {
    29212813        .header-main {
     2814                padding: 0 0 0 30px;
     2815        }
     2816
     2817        .search-toggle {
    29222818                margin-right: 0;
    29232819        }
    29242820
     2821        /* Fixed Header */
     2822
     2823        .masthead-fixed .site-header {
     2824                box-shadow: 0 1px 8px rgba(0, 0, 0, 0.2);
     2825                position: fixed;
     2826                top: 0;
     2827        }
     2828
     2829        .admin-bar.masthead-fixed .site-header {
     2830                top: 28px;
     2831        }
     2832
     2833        .admin-bar.mp6.masthead-fixed .site-header {
     2834                top: 32px;
     2835        }
     2836
     2837        .masthead-fixed .site-main {
     2838                margin-top: 48px;
     2839        }
     2840
     2841        /* Primary Navigation */
     2842
    29252843        .primary-navigation {
     2844                float: right;
     2845                font-size: 11px;
     2846                margin: 0 10px 0 -10px;
     2847                padding: 0;
     2848                text-transform: uppercase;
     2849        }
     2850
     2851        .primary-navigation .menu-toggle {
     2852                display: none;
     2853                padding: 0;
     2854        }
     2855
     2856        .primary-navigation .nav-menu {
    29262857                display: block;
    29272858        }
    29282859
     2860        .primary-navigation.toggled-on {
     2861                border-bottom: 0;
     2862                margin: 0;
     2863                padding: 0;
     2864        }
     2865
     2866        .primary-navigation li {
     2867                border: 0;
     2868                display: inline-block;
     2869                height: 48px;
     2870                line-height: 48px;
     2871                position: relative;
     2872        }
     2873
     2874        .primary-navigation a {
     2875                display: inline-block;
     2876                padding: 0 10px;
     2877                white-space: nowrap;
     2878        }
     2879
     2880        .primary-navigation ul ul {
     2881                background-color: #24890d;
     2882                float: left;
     2883                position: absolute;
     2884                top: 48px;
     2885                left: -999em;
     2886                z-index: 99999;
     2887        }
     2888
     2889        .primary-navigation li li {
     2890                border: 0;
     2891                display: block;
     2892                height: auto;
     2893                line-height: 1.0909090909;
     2894        }
     2895
     2896        .primary-navigation ul ul ul {
     2897                left: -999em;
     2898                top: 0;
     2899        }
     2900
     2901        .primary-navigation ul ul li {
     2902                margin: 0;
     2903        }
     2904
     2905        .primary-navigation ul ul a {
     2906                padding: 18px 12px;
     2907                white-space: normal;
     2908                width: 144px;
     2909        }
     2910
     2911        .primary-navigation li:hover > a {
     2912                background-color: #24890d;
     2913                color: #fff;
     2914        }
     2915
     2916        .primary-navigation ul ul a:hover {
     2917                background-color: #41a62a;
     2918        }
     2919
     2920        .primary-navigation ul li:hover > ul,
     2921        .primary-navigation ul li.focus > ul {
     2922                left: auto;
     2923        }
     2924
     2925        .primary-navigation ul ul li:hover > ul,
     2926        .primary-navigation ul ul li.focus > ul {
     2927                left: 100%;
     2928        }
     2929
     2930        .primary-navigation li .current_page_item > a,
     2931        .primary-navigation li .current_page_ancestor > a,
     2932        .primary-navigation li .current-menu-item > a,
     2933        .primary-navigation li .current-menu-ancestor > a {
     2934                background-color: #000;
     2935        }
     2936
    29292937        .attachment-featured-featured {
    29302938                height: 213px;
    29312939        }
    … …  
    30013009        }
    30023010
    30033011        .comment-author .avatar {
     3012                height: 34px;
    30043013                top: 2px;
    30053014                width: 34px;
    3006                 height: 34px;
    30073015        }
    30083016
    30093017        .comment-author,
    … …  
    30313039}
    30323040
    30333041@media screen and (min-width: 1008px) {
    3034         .header-main {
    3035                 padding-left: 30px;
    3036         }
    3037 
    30383042        .search-box-wrapper {
    30393043                padding-left: 182px;
    30403044        }
    … …  
    30723076
    30733077        #secondary {
    30743078                background-color: transparent;
    3075                 border-bottom: 0;
     3079                border-top: 0;
    30763080                clear: none;
    30773081                float: left;
    30783082                font-size: 11px;
    30793083                line-height: 1.6363636363;
    30803084                margin: 0 0 0 -100%;
    30813085                min-height: 100vh;
     3086                padding: 0 30px;
    30823087                width: 122px;
    30833088        }
    30843089
    … …  
    31153120        .secondary-navigation {
    31163121                border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    31173122                font-size: 11px;
     3123                margin: 0 0 48px;
    31183124        }
    31193125
    31203126        .secondary-navigation ul,
    … …  
    31283134                position: relative;
    31293135        }
    31303136
    3131         .secondary-navigation a {
    3132                 padding: 8px 0 9px;
    3133         }
    3134 
    31353137        .secondary-navigation ul ul {
    31363138                background: rgba(0, 0, 0, 0.9);
    31373139                display: none;
    … …  
    31583160                margin-bottom: 18px;
    31593161        }
    31603162
     3163        #supplementary {
     3164                padding: 0;
     3165        }
     3166
    31613167        .footer-sidebar {
    31623168                font-size: 11px;
    31633169                line-height: 1.6363636363;
    3164                 padding: 48px 0 0;
    31653170        }
    31663171
     3172        .site-footer .widget {
     3173                -webkit-box-sizing: border-box;
     3174                -moz-box-sizing:    border-box;
     3175                box-sizing:         border-box;
     3176                float: left;
     3177                padding: 0 30px;
     3178                width: 25%;
     3179        }
     3180
    31673181        .site-info {
    31683182                padding: 15px 30px;
    31693183        }