diff --git a/wp-admin/css/customize-controls.dev.css b/wp-admin/css/customize-controls.dev.css index 5196d82d21..ba8f71de59 100644 --- a/wp-admin/css/customize-controls.dev.css +++ b/wp-admin/css/customize-controls.dev.css @@ -402,10 +402,6 @@ body { text-align: right; } -.customize-section .customize-control-image .actions a { - display: block; -} - .customize-section .customize-control-image .library ul { border-bottom: 1px solid #dfdfdf; float: left; @@ -456,7 +452,7 @@ body { .customize-section .customize-control-image .library .thumbnail img { display: block; - max-width: 220px; + max-width: 90%; max-height: 80px; margin: 5px auto; @@ -479,6 +475,7 @@ body { text-align: center; color: #777; position: relative; + cursor: default; } .customize-section .customize-control-upload .upload-dropzone.supports-drag-drop, @@ -491,7 +488,29 @@ body { transition: border-color 0.1s; } +.customize-section .customize-control-upload .library ul li, +.customize-section .customize-control-image .library ul li { + cursor: pointer; +} + .customize-section .customize-control-upload .upload-dropzone.supports-drag-drop.drag-over, .customize-section .customize-control-image .upload-dropzone.supports-drag-drop.drag-over { border-color: #83b4d8; -} \ No newline at end of file +} + +/** + * iOS can't scroll iframes, + * instead it expands the iframe size to match the size of the content + */ +.ios .wp-full-overlay { + position: relative; +} + +.ios #customize-preview { + position: relative; +} + +.ios #customize-controls .wp-full-overlay-sidebar-content { + -webkit-overflow-scrolling: touch; +} + diff --git a/wp-admin/css/wp-admin-rtl.dev.css b/wp-admin/css/wp-admin-rtl.dev.css index 94ee2ad596..c92e9fe20e 100644 --- a/wp-admin/css/wp-admin-rtl.dev.css +++ b/wp-admin/css/wp-admin-rtl.dev.css @@ -1566,19 +1566,10 @@ table .column-rating { /*------------------------------------------------------------------------------ 26.0 - Full Overlay w/ Sidebar ------------------------------------------------------------------------------*/ -.wp-full-overlay { - left: 0; - right: 300px; -} - -.wp-full-overlay.collapsed { - right: 0 !important; -} - .wp-full-overlay .wp-full-overlay-sidebar { margin: 0; - left: 100%; - right: auto; + left: auto; + right: 0; border-right: 0; border-left: 1px solid rgba( 0, 0, 0, 0.2 ); } @@ -1589,6 +1580,21 @@ table .column-rating { box-shadow: inset 5px 0 4px -4px rgba(0, 0, 0, 0.1); } +.wp-full-overlay.collapsed, +.wp-full-overlay.expanded .wp-full-overlay-sidebar { + margin-right: 0 !important; +} + +.wp-full-overlay.expanded { + margin-right: 300px; + margin-left: 0; +} + +.wp-full-overlay.collapsed .wp-full-overlay-sidebar { + margin-right: -300px; + margin-left: 0; +} + /* Collapse Button */ .wp-full-overlay .collapse-sidebar { right: 0; diff --git a/wp-admin/css/wp-admin.dev.css b/wp-admin/css/wp-admin.dev.css index a0f8651076..cb7f9f890d 100644 --- a/wp-admin/css/wp-admin.dev.css +++ b/wp-admin/css/wp-admin.dev.css @@ -5255,27 +5255,23 @@ body.full-overlay-active { overflow: visible; top: 0; bottom: 0; - left: 300px; + left: 0; right: 0; height: 100%; min-width: 0; } -.wp-full-overlay.collapsed { - left: 0 !important; -} - .wp-full-overlay-sidebar { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; - position: absolute; + position: fixed; width: 300px; height: 100%; top: 0; bottom: 0; - right: 100%; + left: 0; padding: 0; margin: 0; z-index: 10; @@ -5288,6 +5284,19 @@ body.full-overlay-active { overflow: visible; } +.wp-full-overlay.collapsed, +.wp-full-overlay.expanded .wp-full-overlay-sidebar { + margin-left: 0 !important; +} + +.wp-full-overlay.expanded { + margin-left: 300px; +} + +.wp-full-overlay.collapsed .wp-full-overlay-sidebar { + margin-left: -300px; +} + .wp-full-overlay-sidebar:after { content: ''; display: block; @@ -5404,11 +5413,11 @@ body.full-overlay-active { .wp-full-overlay-sidebar, .wp-full-overlay .collapse-sidebar, .wp-full-overlay-main { - -webkit-transition-property: left, right, top, bottom, width; - -moz-transition-property: left, right, top, bottom, width; - -ms-transition-property: left, right, top, bottom, width; - -o-transition-property: left, right, top, bottom, width; - transition-property: left, right, top, bottom, width; + -webkit-transition-property: left, right, top, bottom, width, margin; + -moz-transition-property: left, right, top, bottom, width, margin; + -ms-transition-property: left, right, top, bottom, width, margin; + -o-transition-property: left, right, top, bottom, width, margin; + transition-property: left, right, top, bottom, width, margin; -webkit-transition-duration: 0.2s; -moz-transition-duration: 0.2s; diff --git a/wp-admin/customize.php b/wp-admin/customize.php index 41ffdb4d3e..e7885cf1d6 100644 --- a/wp-admin/customize.php +++ b/wp-admin/customize.php @@ -34,6 +34,19 @@ do_action( 'customize_controls_enqueue_scripts' ); wp_user_settings(); _wp_admin_html_begin(); +$body_class = ''; + +if ( wp_is_mobile() ) : + $body_class .= ' mobile'; + + ?>theme()->display('Name') ) ) ); ?>