Changeset 33454

Timestamp:

07/28/2015 03:42:36 AM (6 years ago)

Author:

westonruter

Message:

Customizer: Hide empty space in footer on small screens since it is only populated on larger screens.

Props obenland.
Fixes #33138.

File:

• trunk/src/wp-admin/js/customize-controls.js (modified) (2 diffs)

trunk/src/wp-admin/js/customize-controls.js

@@ -596 +596 @@
                     container.scrollTop( 0 );
                     expand = function () {
+                        var matchMedia, offset;
+                        matchMedia = window.matchMedia || window.msMatchMedia;
+                        offset = 90; // 45px for customize header actions + 45px for footer actions.
+
+                        // No footer on small screens.
+                        if ( matchMedia && matchMedia( '(max-width: 640px)' ).matches ) {
+                            offset = 45;
+                        }
+
                         section.container.addClass( 'open' );
                         overlay.addClass( 'section-open' );
@@ -601 +610 @@
                         scroll = container.scrollTop();
                         content.css( 'margin-top', ( 45 - position - scroll ) );
-                        content.css( 'height', ( window.innerHeight - 90 ) );
+                        content.css( 'height', ( window.innerHeight - offset ) );
                         sectionTitle.attr( 'tabindex', '-1' );
                         backBtn.attr( 'tabindex', '0' );