Ticket #29979: 29979.7.diff

wp-content/themes/twentyfifteen/js/functions.js

@@ -6 +6 @@
  */
 
 ( function( $ ) {
+        var $body, $window, sidebar, toolbarOffset;
+
         $( 'html' ).removeClass( 'no-js' );
 
         // Add dropdown toggle that display child menu items.
@@ -47 +49 @@
                         $( this ).toggleClass( 'toggled-on' );
                 } );
         } )();
+
+
+        // Sidebar (un)fixing: fix when short, un-fix when scroll needed
+        $body         = $( 'body' );
+        $window       = $( window );
+        sidebar       = $( '#sidebar' )[0];
+        toolbarOffset = $body.is( '.admin-bar' ) ? $( '#wpadminbar' ).height() : 0;
+
+        function fixedOrScrolledSidebar() {
+                if ( $window.width() >= 955 ) {
+                        if ( sidebar.scrollHeight < ( $window.height() - toolbarOffset ) ) {
+                                $body.addClass( 'sidebar-fixed' );
+                        } else {
+                                $body.removeClass( 'sidebar-fixed' );
+                        }
+                } else {
+                        $body.removeClass( 'sidebar-fixed' );
+                }
+        }
+
+        function debouncedFixedOrScrolledSidebar() {
+                var timeout;
+                return function() {
+                        clearTimeout( timeout );
+                        timeout = setTimeout( function() {
+                                timeout = null;
+                                fixedOrScrolledSidebar();
+                        }, 150 );
+                };
+        }
+
+        $window.on( 'load.twentyfifteen', fixedOrScrolledSidebar ).on( 'resize.twentyfifteen', debouncedFixedOrScrolledSidebar() );
+
 } )( jQuery );
+ No newline at end of file

wp-content/themes/twentyfifteen/style.css

@@ -3799 +3799 @@
 
 @media screen and (min-width: 59.6875em) {
         body:before,
-        .site-header,
-        .main-navigation,
-        .social-navigation,
-        .widget {
+        .sidebar-fixed .site-header,
+        .sidebar-fixed .main-navigation,
+        .sidebar-fixed .social-navigation,
+        .sidebar-fixed .widget {
                 -webkit-transform: translateZ(0); /* Fixes flashing bug with scrolling on iOS Safari */
         }
 
+        .sidebar-fixed .sidebar {
+                position: fixed;
+        }
+
         body:before {
                 background-color: #fff;
                 box-shadow: 0 0 1px rgba(0, 0, 0, 0.15);
@@ -3826 +3830 @@
 
         .sidebar {
                 float: left;
-                height: 100%;
                 margin-right: -100%;
                 max-width: 413px;
-                overflow-y: scroll;
-                -webkit-overflow-scrolling: touch; /* Enable momentum scrolling on iOS Safari */
-                position: fixed;
+                position: relative;
                 width: 29.4118%;
         }
 
-        .admin-bar .sidebar {
-                height: -webkit-calc(100% - 32px);
-                height: calc(100% - 32px);
-        }
-
         .secondary {
                 background-color: transparent;
                 display: block;