sergiotarxz
/
Wordpress
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

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.


git-svn-id: https://develop.svn.wordpress.org/trunk@41860 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Weston Ruter 2017-10-13 21:20:42 +00:00
parent 99cff48f61
commit a626ef6c81
4 changed files with 37 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
src/wp-admin/css/customize-controls.css
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;

7
src/wp-admin/js/customize-controls.js
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() {

4
src/wp-admin/js/customize-nav-menus.js
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() {

4
src/wp-admin/js/customize-widgets.js
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' );