diff --git a/src/wp-admin/css/common.css b/src/wp-admin/css/common.css index 11326f1710..3c9feeebd9 100644 --- a/src/wp-admin/css/common.css +++ b/src/wp-admin/css/common.css @@ -1806,15 +1806,14 @@ div.action-links { } #plugin-information-title { - padding: 0 36px 0 16px; - font-size: 18px; + padding: 0 76px 0 20px; + font-size: 22px; font-weight: 600; - line-height: 36px; + line-height: 56px; top: 0; right: 0; left: 0; - height: 36px; - border-bottom: 1px solid #ddd; + height: 56px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; @@ -1862,9 +1861,8 @@ div.action-links { position: absolute; top: 90px; right: 0; - bottom: 44px; + bottom: 58px; left: 0; - overflow: auto; } #section-holder { @@ -1875,6 +1873,7 @@ div.action-links { right: 250px; bottom: 0; left: 0; + overflow: auto; } #section-holder .updated { @@ -1883,14 +1882,15 @@ div.action-links { #plugin-information .fyi { background: #f3f3f3; - border: 1px solid #ddd; - border-top: 0; + border-left: 1px solid #ddd; color: #666; padding: 16px; position: absolute; top: 0; right: 0; + bottom: 0; width: 217px; + overflow: auto; } #plugin-information .fyi strong { @@ -1922,11 +1922,12 @@ div.action-links { } #plugin-information-footer { - padding: 8px 16px; + padding: 15px 16px; position: absolute; right: 0; bottom: 0; left: 0; + height: 28px; } #plugin-information .section ul, @@ -1974,7 +1975,7 @@ div.action-links { @media screen and ( max-width: 782px ) { #plugin-information-content { overflow: auto; - bottom: 62px; + bottom: 58px; } #plugin-information .fyi { @@ -1994,8 +1995,8 @@ div.action-links { } #plugin-information-footer { - padding: 12px 16px; - height: 37px; + padding: 12px 16px 0; + height: 46px; } } @@ -2031,14 +2032,14 @@ body.index-php #TB_ajaxWindowTitle { body.plugin-install-php .tb-close-icon, body.index-php .tb-close-icon { - line-height: 36px; - width: 36px; - height: 36px; + line-height: 48px; + width: 48px; + height: 48px; } body.plugin-install-php .tb-close-icon:before, body.index-php .tb-close-icon:before { - line-height: 36px; + line-height: 48px; } /* @todo: move this. */ diff --git a/src/wp-includes/css/editor.css b/src/wp-includes/css/editor.css index 1d854589ec..591165b876 100644 --- a/src/wp-includes/css/editor.css +++ b/src/wp-includes/css/editor.css @@ -73,6 +73,10 @@ width: calc( 100% - 36px ); } +.mce-wp-help .mce-window-head { + border-bottom: none; +} + .mce-textbox { border: 1px solid #ddd; -webkit-border-radius: 0; diff --git a/src/wp-includes/js/tinymce/plugins/wordpress/plugin.js b/src/wp-includes/js/tinymce/plugins/wordpress/plugin.js index 303f20d646..25362cc63a 100644 --- a/src/wp-includes/js/tinymce/plugins/wordpress/plugin.js +++ b/src/wp-includes/js/tinymce/plugins/wordpress/plugin.js @@ -182,7 +182,8 @@ tinymce.PluginManager.add( 'wordpress', function( editor ) { url: tinymce.baseURL + '/wp-mce-help.php', width: 450, height: 420, - inline: 1 + inline: 1, + classes: 'wp-help' }); }); diff --git a/src/wp-includes/js/tinymce/wp-mce-help.php b/src/wp-includes/js/tinymce/wp-mce-help.php index 1c58540d66..7a055b2991 100644 --- a/src/wp-includes/js/tinymce/wp-mce-help.php +++ b/src/wp-includes/js/tinymce/wp-mce-help.php @@ -27,51 +27,35 @@ header('Content-Type: text/html; charset=' . get_bloginfo('charset')); min-width: 0; } - #tabs-wrap { + .wp-core-ui #tabs { + margin-top: 1px; + padding: 0 6px; position: absolute; top: 0; + right: 0; + left: 0; + height: 31px; + z-index: 1; } - #tabs { - box-shadow: 0 3px 5px rgba( 255, 255, 255, 0.2 ); - margin: 0; - padding: 0; + .wp-core-ui #tabs a { position: relative; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - } - - #tabs a { + float: left; + padding: 6px 10px; + margin: 0; + height: 18px; + line-height: 18px; + text-decoration: none; -webkit-transition: none; transition: none; } - - #tabs-wrap #tabs > a { - float: left; - font-size: 14px; - height: 18px; - line-height: 18px; - margin: 0; - padding: 7px 10px; - position: relative; - text-decoration: none; - border-right: 1px solid #ddd; - background-color: #eee; - color: inherit; - } - #tabs > a:active, - #tabs > a:focus { - outline: none; - } - - #tabs-wrap #tabs .active, - #tabs-wrap #tabs .active:hover { - color: #333; + #tabs a.active { + margin: -1px -1px 0; background: #fff; - border-bottom: 1px solid #fff; + border: 1px solid #ddd; + border-bottom: none; + color: #333; } #tabs .active:after { @@ -83,8 +67,8 @@ header('Content-Type: text/html; charset=' . get_bloginfo('charset')); border-top: 1px solid #ddd; height: 360px; margin: 0; - margin-top: 32px; - overflow-y: scroll; + margin-top: 30px; + overflow: auto; padding: 10px 16px; } @@ -151,13 +135,11 @@ if ( tinymce.isMac ) document.body.className = document.body.className.replace(/windows/, 'macos'); -
-
- - - - -
+
+ + + +