Customize: Fix positioning of device-previewed window when publish settings are open.

* Update date control padding.
* Collapse publish settings section when opening panes for available widgets or nav menus.
* Remove save and cog buttons in mobile preview only mode.
* Move definition of `wp.customize.previewedDevice` to `wp.customize.state('previewedDevice')` for centralization, maintaining old alias.
* Remove unused CSS because the section is inside form now.

Props sayedwp, westonruter.
See #39896.
Fixes #42027, #42199.

Built from https://develop.svn.wordpress.org/trunk@41860


git-svn-id: http://core.svn.wordpress.org/trunk@41694 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
Weston Ruter 2017-10-13 21:21:55 +00:00
parent e48b16d96a
commit 24d304a0a1
11 changed files with 70 additions and 29 deletions

View File

@ -127,11 +127,20 @@ body:not(.ready) #customize-save-button-wrapper .save {
margin: 0;
}
.outer-section-open .wp-full-overlay.expanded #customize-preview {
.outer-section-open .wp-full-overlay.expanded .wp-full-overlay-main {
right: 300px;
opacity: 0.4;
}
.outer-section-open .wp-full-overlay.expanded.preview-tablet .wp-full-overlay-main,
.outer-section-open .wp-full-overlay.expanded.preview-mobile .wp-full-overlay-main,
.adding-menu-items .wp-full-overlay.expanded.preview-tablet .wp-full-overlay-main,
.adding-menu-items .wp-full-overlay.expanded.preview-mobile .wp-full-overlay-main,
.adding-widget .wp-full-overlay.expanded.preview-tablet .wp-full-overlay-main,
.adding-widget .wp-full-overlay.expanded.preview-mobile .wp-full-overlay-main {
right: 64%;
}
#customize-outer-theme-controls li.notice {
padding-top: 8px;
padding-bottom: 8px;
@ -379,7 +388,7 @@ body.trashing #publish-settings {
box-sizing: content-box;
width: 100%;
margin-right: -12px;
padding: 12px 12px 10px;
padding: 12px;
background: #ffffff;
border-bottom: 1px solid #ddd;
margin-bottom: 0;
@ -506,8 +515,7 @@ body.trashing #publish-settings {
margin-bottom: 0;
}
#customize-controls .customize-info .customize-section-description,
#customize-outer-theme-controls .customize-section-description {
#customize-controls .customize-info .customize-section-description {
margin-bottom: 15px;
}
@ -562,9 +570,6 @@ body.trashing #publish-settings {
#customize-controls .control-section:hover > .accordion-section-title,
#customize-controls .control-section .accordion-section-title:hover,
#customize-controls .control-section.open .accordion-section-title,
#customize-outer-theme-controls .control-section .accordion-section-title:hover,
#customize-outer-theme-controls .control-section.open .accordion-section-title,
#customize-outer-theme-controls .control-section .accordion-section-title:focus,
#customize-controls .control-section .accordion-section-title:focus {
color: #0073aa;
background: #f3f3f5;
@ -1724,8 +1729,7 @@ p.customize-section-description {
.control-panel-themes .accordion-section-title span.customize-action,
#customize-controls .customize-section-title span.customize-action,
#customize-controls .control-section-themes .accordion-section-title span.customize-action,
#customize-controls .customize-section-title span.customize-action,
#customize-outer-theme-controls .customize-section-title span.customize-action {
#customize-controls .customize-section-title span.customize-action {
font-size: 13px;
display: block;
font-weight: 400;
@ -2791,6 +2795,14 @@ body.adding-widget .add-new-widget:before,
}
}
@media screen and ( max-width: 1200px ) {
.outer-section-open .wp-full-overlay.expanded.preview-mobile .wp-full-overlay-main,
.adding-menu-items .wp-full-overlay.expanded.preview-mobile .wp-full-overlay-main,
.adding-widget .wp-full-overlay.expanded.preview-mobile .wp-full-overlay-main {
right: 67%;
}
}
@media screen and ( max-width: 640px ) {
#customize-controls {
width: 100%;
@ -2837,6 +2849,10 @@ body.adding-widget .add-new-widget:before,
display: none;
}
.preview-only #customize-save-button-wrapper {
margin-top: -46px;
}
.customize-controls-preview-toggle .preview:before,
.customize-controls-preview-toggle .controls:before {
font: normal 20px/1 dashicons;

File diff suppressed because one or more lines are too long

View File

@ -127,11 +127,20 @@ body:not(.ready) #customize-save-button-wrapper .save {
margin: 0;
}
.outer-section-open .wp-full-overlay.expanded #customize-preview {
.outer-section-open .wp-full-overlay.expanded .wp-full-overlay-main {
left: 300px;
opacity: 0.4;
}
.outer-section-open .wp-full-overlay.expanded.preview-tablet .wp-full-overlay-main,
.outer-section-open .wp-full-overlay.expanded.preview-mobile .wp-full-overlay-main,
.adding-menu-items .wp-full-overlay.expanded.preview-tablet .wp-full-overlay-main,
.adding-menu-items .wp-full-overlay.expanded.preview-mobile .wp-full-overlay-main,
.adding-widget .wp-full-overlay.expanded.preview-tablet .wp-full-overlay-main,
.adding-widget .wp-full-overlay.expanded.preview-mobile .wp-full-overlay-main {
left: 64%;
}
#customize-outer-theme-controls li.notice {
padding-top: 8px;
padding-bottom: 8px;
@ -379,7 +388,7 @@ body.trashing #publish-settings {
box-sizing: content-box;
width: 100%;
margin-left: -12px;
padding: 12px 12px 10px;
padding: 12px;
background: #ffffff;
border-bottom: 1px solid #ddd;
margin-bottom: 0;
@ -506,8 +515,7 @@ body.trashing #publish-settings {
margin-bottom: 0;
}
#customize-controls .customize-info .customize-section-description,
#customize-outer-theme-controls .customize-section-description {
#customize-controls .customize-info .customize-section-description {
margin-bottom: 15px;
}
@ -562,9 +570,6 @@ body.trashing #publish-settings {
#customize-controls .control-section:hover > .accordion-section-title,
#customize-controls .control-section .accordion-section-title:hover,
#customize-controls .control-section.open .accordion-section-title,
#customize-outer-theme-controls .control-section .accordion-section-title:hover,
#customize-outer-theme-controls .control-section.open .accordion-section-title,
#customize-outer-theme-controls .control-section .accordion-section-title:focus,
#customize-controls .control-section .accordion-section-title:focus {
color: #0073aa;
background: #f3f3f5;
@ -1724,8 +1729,7 @@ p.customize-section-description {
.control-panel-themes .accordion-section-title span.customize-action,
#customize-controls .customize-section-title span.customize-action,
#customize-controls .control-section-themes .accordion-section-title span.customize-action,
#customize-controls .customize-section-title span.customize-action,
#customize-outer-theme-controls .customize-section-title span.customize-action {
#customize-controls .customize-section-title span.customize-action {
font-size: 13px;
display: block;
font-weight: 400;
@ -2791,6 +2795,14 @@ body.adding-widget .add-new-widget:before,
}
}
@media screen and ( max-width: 1200px ) {
.outer-section-open .wp-full-overlay.expanded.preview-mobile .wp-full-overlay-main,
.adding-menu-items .wp-full-overlay.expanded.preview-mobile .wp-full-overlay-main,
.adding-widget .wp-full-overlay.expanded.preview-mobile .wp-full-overlay-main {
left: 67%;
}
}
@media screen and ( max-width: 640px ) {
#customize-controls {
width: 100%;
@ -2837,6 +2849,10 @@ body.adding-widget .add-new-widget:before,
display: none;
}
.preview-only #customize-save-button-wrapper {
margin-top: -46px;
}
.customize-controls-preview-toggle .preview:before,
.customize-controls-preview-toggle .controls:before {
font: normal 20px/1 dashicons;

File diff suppressed because one or more lines are too long

View File

@ -6788,7 +6788,8 @@
'remainingTimeToPublish',
'previewerAlive',
'editShortcutVisibility',
'changesetLocked'
'changesetLocked',
'previewedDevice'
], function( name ) {
api.state.create( name );
});
@ -8317,8 +8318,8 @@
};
}());
// Previewed device bindings.
api.previewedDevice = new api.Value();
// Previewed device bindings. (The api.previewedDevice property is how this Value was first introduced, but since it has moved to api.state.)
api.previewedDevice = api.state( 'previewedDevice' );
// Set the default device.
api.bind( 'ready', function() {

File diff suppressed because one or more lines are too long

View File

@ -682,6 +682,10 @@
this.itemSectionHeight();
if ( api.section.has( 'publish_settings' ) ) {
api.section( 'publish_settings' ).collapse();
}
$( 'body' ).addClass( 'adding-menu-items' );
close = function() {

File diff suppressed because one or more lines are too long

View File

@ -330,6 +330,10 @@
}
} );
if ( api.section.has( 'publish_settings' ) ) {
api.section( 'publish_settings' ).collapse();
}
$( 'body' ).addClass( 'adding-widget' );
this.$el.find( '.selected' ).removeClass( 'selected' );

File diff suppressed because one or more lines are too long

View File

@ -4,7 +4,7 @@
*
* @global string $wp_version
*/
$wp_version = '4.9-beta2-41859';
$wp_version = '4.9-beta2-41860';
/**
* Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema.