X-Git-Url: https://scripts.mit.edu/gitweb/autoinstalls/wordpress.git/blobdiff_plain/f5fcdc7994bb67cce809bc4777944ae8b7fad4a4..refs/tags/wordpress-4.3:/wp-includes/css/editor.css diff --git a/wp-includes/css/editor.css b/wp-includes/css/editor.css index 7ba00f92..b89e9390 100644 --- a/wp-includes/css/editor.css +++ b/wp-includes/css/editor.css @@ -79,8 +79,8 @@ width: calc( 100% - 36px ); } -.mce-wp-help .mce-window-head { - border-bottom: none; +.mce-window .mce-foot { + border-top: 1px solid #dfdfdf; } .mce-textbox, @@ -104,6 +104,72 @@ box-shadow: 0 0 2px rgba(30,140,190,0.8); } +.mce-window .mce-wp-help { + height: 360px; + width: 460px; + overflow: auto; +} + +.mce-window .mce-wp-help * { + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; +} + +.mce-window .mce-wp-help > .mce-container-body { + width: auto !important; +} + +.mce-window .wp-editor-help { + padding: 10px 10px 0 20px; +} + +.mce-window .wp-editor-help h2, +.mce-window .wp-editor-help p { + margin: 8px 0; + white-space: normal; + font-size: 14px; + font-weight: normal; +} + +.mce-window .wp-editor-help table { + width: 100%; + margin-bottom: 20px; +} + +.mce-window .wp-editor-help td, +.mce-window .wp-editor-help th { + font-size: 13px; + padding: 5px; + vertical-align: middle; + word-wrap: break-word; + white-space: normal; +} + +.mce-window .wp-editor-help th { + font-weight: bold; + padding-bottom: 0; +} + +.mce-window .wp-editor-help kbd { + font-family: monospace; + padding: 2px 7px 3px; + font-weight: bold; + margin: 0; + background: #eaeaea; + background: rgba(0,0,0,0.08); +} + +.mce-window .wp-help-header td { + font-weight: bold; + padding: 0 5px; +} + +.mce-window .wp-help-th-center td:nth-child(odd), +.mce-window .wp-help-th-center th:nth-child(odd) { + text-align: center; +} + /* TinyMCE menus */ .mce-menu, .mce-floatpanel.mce-popover { @@ -114,6 +180,7 @@ box-shadow: 0 3px 5px rgba( 0, 0, 0, 0.2 ); } +.mce-menu, .mce-floatpanel.mce-popover.mce-bottom { margin-top: 2px; } @@ -139,8 +206,6 @@ div.mce-panel { border: 0; background: #fff; - -webkit-filter: none; - filter: none; } .mce-panel.mce-menu { @@ -174,6 +239,7 @@ div.mce-inline-toolbar-grp { -webkit-user-select: none; -ms-user-select: none; user-select: none; + max-width: 98%; z-index: 100100; /* Same as the other TinyMCE "panels" */ } @@ -199,30 +265,30 @@ div.mce-inline-toolbar-grp:after { } div.mce-inline-toolbar-grp.mce-arrow-up:before { - top: -18px; + top: -9px; border-bottom-color: #a0a5aa; - border-width: 9px; + border-width: 0 9px 9px; margin-left: -9px; } div.mce-inline-toolbar-grp.mce-arrow-down:before { - bottom: -18px; + bottom: -9px; border-top-color: #a0a5aa; - border-width: 9px; + border-width: 9px 9px 0; margin-left: -9px; } div.mce-inline-toolbar-grp.mce-arrow-up:after { - top: -16px; + top: -8px; border-bottom-color: #f5f5f5; - border-width: 8px; + border-width: 0 8px 8px; margin-left: -8px; } div.mce-inline-toolbar-grp.mce-arrow-down:after { - bottom: -16px; + bottom: -8px; border-top-color: #f5f5f5; - border-width: 8px; + border-width: 8px 8px 0; margin-left: -8px; } @@ -286,7 +352,6 @@ div.mce-path { .mce-path-item, .mce-path .mce-divider { font-size: 12px; - line-height: 18px; } .mce-toolbar .mce-btn, @@ -299,21 +364,15 @@ div.mce-path { cursor: pointer; } -#wp-fullscreen-buttons .mce-btn, .mce-toolbar .mce-btn-group .mce-btn, .qt-dfw { border: 1px solid transparent; margin: 2px; - background-image: none; -webkit-border-radius: 2px; border-radius: 2px; - -webkit-filter: none; - filter: none; } -#wp-fullscreen-buttons .mce-btn:hover, .mce-toolbar .mce-btn-group .mce-btn:hover, -#wp-fullscreen-buttons .mce-btn:focus, .mce-toolbar .mce-btn-group .mce-btn:focus, .qt-dfw:hover, .qt-dfw:focus { @@ -326,9 +385,7 @@ div.mce-path { } .mce-toolbar .mce-btn-group .mce-btn.mce-active, -#wp-fullscreen-buttons .mce-btn.mce-active, .mce-toolbar .mce-btn-group .mce-btn:active, -#wp-fullscreen-buttons .mce-btn:active, .qt-dfw.active { background: #ebebeb; border-color: #999; @@ -345,9 +402,7 @@ div.mce-path { } .mce-toolbar .mce-btn-group .mce-btn.mce-disabled:hover, -#wp-fullscreen-buttons .mce-btn.mce-disabled:hover, -.mce-toolbar .mce-btn-group .mce-btn.mce-disabled:focus, -#wp-fullscreen-buttons .mce-btn.mce-disabled:focus { +.mce-toolbar .mce-btn-group .mce-btn.mce-disabled:focus { color: #a0a5aa; background: none; border-color: #ddd; @@ -367,6 +422,13 @@ div.mce-path { line-height: normal; } +.mce-toolbar .mce-listbox button { + font-size: 13px; + line-height: 20px; + padding-left: 6px; + padding-right: 20px; +} + .mce-toolbar .mce-btn i { text-shadow: none; } @@ -401,12 +463,7 @@ div.mce-path { } .mce-toolbar .mce-btn-group .mce-btn.mce-listbox:hover { - background-image: none; - border-color: #b4b9be; -} - -.mce-toolbar .mce-btn-group .mce-btn.mce-listbox span { - font-size: 13px; + border-color: #b4b9be; } .mce-panel .mce-btn i.mce-caret { @@ -416,13 +473,7 @@ div.mce-path { } .mce-listbox i.mce-caret { - right: 6px; -} - -.mce-panel .mce-btn button.mce-open i.mce-caret, -.mce-panel .mce-btn.mce-listbox i.mce-caret { - margin-left: 0; - margin-right: 0; + right: 4px; } .mce-panel .mce-btn:hover i.mce-caret { @@ -443,34 +494,33 @@ div.mce-path { border-right-color: transparent; } -.mce-toolbar .mce-splitbtn .mce-open.mce-active{ - -webkit-box-shadow: none; - box-shadow: none; -} - -.mce-menu .mce-menu-item-normal.mce-active { - background-color: #e5e5e5; - -webkit-filter: none; - filter: none; +.mce-toolbar .mce-splitbtn .mce-open.mce-active { + background: transparent; + outline: none; } .mce-menu .mce-menu-item:hover, .mce-menu .mce-menu-item.mce-selected, -.mce-menu .mce-menu-item:focus { - color: #000; - background-color: #b4b9be; - background-image: none; - -webkit-filter: none; - filter: none; -} - -.mce-menu .mce-menu-item:hover .mce-ico, -.mce-menu .mce-menu-item.mce-selected .mce-ico, -.mce-menu .mce-menu-item:focus .mce-ico, -.mce-menu .mce-menu-item:hover .mce-text, -.mce-menu .mce-menu-item.mce-active:hover .mce-text, -.mce-menu .mce-menu-item.mce-selected .mce-text { - color: #000; +.mce-menu .mce-menu-item:focus, +.mce-menu .mce-menu-item-normal.mce-active, +.mce-menu .mce-menu-item-preview.mce-active { + background: #0073aa; /* See color scheme. */ +} + +.mce-menu .mce-menu-item-preview.mce-active { + border-left: none; +} + +.mce-menu .mce-menu-item-preview.mce-active .mce-text { + color: #fff; +} + +.mce-menu .mce-menu-item.mce-disabled { + cursor: default; +} + +.mce-menu .mce-menu-item.mce-disabled:hover { + background: #ccc; } /* Menubar */ @@ -480,13 +530,32 @@ div.mce-path { border-width: 0px 0px 1px; } -.mce-menubar .mce-btn:focus { - outline: 0; +.mce-menubar .mce-menubtn { + margin: 2px; +} + +.mce-menubar .mce-menubtn:hover, +.mce-menubar .mce-menubtn.mce-active, +.mce-menubar .mce-menubtn:focus { + border-color: transparent; + background: transparent; +} + +.mce-menubar .mce-menubtn:focus { + color: #124964; + -webkit-box-shadow: + 0 0 0 1px #5b9dd9, + 0 0 2px 1px rgba(30, 140, 190, .8); + box-shadow: + 0 0 0 1px #5b9dd9, + 0 0 2px 1px rgba(30, 140, 190, .8); } div.mce-menu .mce-menu-item-sep, .mce-menu-item-sep:hover { - margin: 5px 0 4px; + border-bottom: 1px solid #ddd; + height: 0px; + margin: 5px 0; } .mce-menubtn span { @@ -525,7 +594,6 @@ div.mce-menu .mce-menu-item-sep, white-space: nowrap; -webkit-box-shadow: inset 0 1px 0 #fff, 0 1px 0 rgba( 0, 0, 0, 0.08 ); box-shadow: inset 0 1px 0 #fff, 0 1px 0 rgba( 0, 0, 0, 0.08 ); - background-image: none; } /* Remove the dotted border on :focus and the extra padding in Firefox */ @@ -619,9 +687,10 @@ div.mce-menu .mce-menu-item-sep, cursor: default; } -.mce-menubtn.mce-fixed-width button span { - max-width: 80px; - padding-right: 16px; +.mce-menubtn.mce-fixed-width button { + overflow-x: hidden; + text-overflow: ellipsis; + width: 110px; } /* Charmap modal */ @@ -651,6 +720,8 @@ div.mce-menu .mce-menu-item-sep, } .mce-tooltip-inner { + -webkit-border-radius: 3px; + border-radius: 3px; -webkit-box-shadow: 0 3px 5px rgba( 0, 0, 0, 0.2 ); box-shadow: 0 3px 5px rgba( 0, 0, 0, 0.2 ); color: #fff; @@ -1066,6 +1137,7 @@ i.mce-i-wp_code:before { position: relative; border-bottom: 1px solid #dedede; background: #f5f5f5; + min-height: 30px; } .has-dfw .quicktags-toolbar { @@ -1111,7 +1183,6 @@ i.mce-i-wp_code:before { padding: 6px 7px; } - #wp-fullscreen-buttons .mce-btn, .mce-toolbar .mce-btn-group .mce-btn { margin: 1px; } @@ -1355,6 +1426,8 @@ i.mce-i-wp_code:before { text-align: right; padding-right: 5px; max-width: 24%; + vertical-align: middle; + word-wrap: break-word; } #wp-link .link-search-field { @@ -1607,509 +1680,42 @@ i.mce-i-wp_code:before { } } -/* Old TinyMCE 3.x modal */ -/* -.clearlooks2 .mceTop { - border-bottom: 1px solid #ccc; -} - -.clearlooks2 .mceTop span { - font: 13px/24px "Open Sans", sans-serif; - color: #e5e5e5; -} - -.clearlooks2 .mceTop .mceLeft { - background: #444444; - border-color: transparent; -} - -.clearlooks2 .mceTop .mceRight { - background: #444444; - border-color: transparent; -} - -.clearlooks2 .mceMiddle { - clip: rect(24px auto auto auto); -} - -.clearlooks2 .mceMiddle .mceLeft { - background: #f1f1f1; - border-color: transparent; -} - -.clearlooks2 .mceMiddle .mceRight { - background: #f1f1f1; - border-color: transparent; -} - -.clearlooks2 .mceBottom { - background: #f1f1f1; - border-color: transparent; -} - -.clearlooks2 .mceBottom .mceLeft { - background: #f1f1f1; - border-color: transparent; -} - -.clearlooks2 .mceBottom .mceCenter { - background: #f1f1f1; - border-color: transparent; -} - -.clearlooks2 .mceBottom .mceRight { - background: #f1f1f1; - border-color: transparent; -} - -.clearlooks2 .mceClose, -.clearlooks2 .mceFocus .mceClose, -.clearlooks2 .mceFocus .mceClose:hover { - background-image: none; -} -.clearlooks2 .mceClose:before { - content: '\f158'; - font: normal 20px/1 'dashicons'; - speak: none; - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; - color: #999; - padding-left: 12px; -} - -/* from colors.css -.clearlooks2 { - box-shadow: 0 5px 15px rgba(0,0,0,0.7); -} - -.clearlooks2 .mceMiddle span, -.clearlooks2 .mceMiddle .mceLeft, -.clearlooks2 .mceMiddle .mceRight, -.clearlooks2 .mceBottom, -.clearlooks2 .mceBottom .mceLeft, -.clearlooks2 .mceBottom .mceCenter, -.clearlooks2 .mceBottom .mceRight { - background-color: #fcfcfc; -} - -.clearlooks2 .mceTop span, -.clearlooks2 .mceFocus .mceTop span { - color: #23282d; -} - -.clearlooks2 .mceClose:before { - color: #999; -} - -.clearlooks2 .mceClose:hover:before { - color: #00a0d2; -} -*/ -/* Distraction-Free Writing mode - * =Overlay Styles --------------------------------------------------------------- */ -.fullscreen-overlay { - z-index: 100005; - display: none; - position: fixed; - top: 0; - bottom: 0; - left: 0; - right: 0; - -webkit-filter: inherit; - filter: inherit; -} - -.wp-fullscreen-active .fullscreen-overlay, -.wp-fullscreen-active #wp-fullscreen-body { - display: block; +div.wp-link-preview { + float: left; + margin: 5px; + max-width: 694px; + overflow: hidden; + text-overflow: ellipsis; } -.fullscreen-fader { - z-index: 200000; +div.wp-link-preview a { + color: #0073aa; + text-decoration: underline; + -webkit-transition-property: border, background, color; + transition-property: border, background, color; + -webkit-transition-duration: .05s; + transition-duration: .05s; + -webkit-transition-timing-function: ease-in-out; + transition-timing-function: ease-in-out; + cursor: pointer; } -.wp-fullscreen-active .fullscreen-fader, -.wp-core-ui.wp-fullscreen-active .postbox-container { - display: none; +@media screen and ( max-width: 782px ) { + div.wp-link-preview { + margin: 8px 0 8px 5px; + max-width: 70%; + max-width: -webkit-calc(100% - 86px); + max-width: calc(100% - 86px); + } } /* =Overlay Body -------------------------------------------------------------- */ -#wp-fullscreen-body, .mce-fullscreen { z-index: 100010; } -#wp-fullscreen-body { - display: none; -} - -.wp-fullscreen-wrap { - margin: 0; - padding: 0; - position: absolute; - left: 0; - right: 0; - bottom: 30px; - top: 60px; - z-index: 100015; -} - -.wp-fullscreen-wrap .wp-editor-container, -.wp-fullscreen-title, -#wp-fullscreen-central-toolbar { - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - max-width: 100%; -} - -.wp-fullscreen-active .wp-editor-tools, -.wp-fullscreen-active .quicktags-toolbar, -.wp-fullscreen-active .mce-toolbar-grp, -.wp-fullscreen-active .mce-statusbar { - display: none; -} - -#wp-fullscreen-statusbar { - position: fixed; - left: 0; - right: 0; - bottom: 0; - height: 30px; - z-index: 100020; - background: #fff; - -webkit-transition: height 0.2s; - transition: height 0.2s; -} - -#wp-fullscreen-status { - margin: 0 auto; - padding: 0; -} - -.wp-fullscreen-active .wp-fullscreen-title, -.wp-fullscreen-active .wp-fullscreen-title:focus, -.wp-fullscreen-active .wp-editor-container { - -webkit-border-radius: 0; - border-radius: 0; - border: 1px dashed transparent; - background: transparent; - -webkit-box-shadow: none; - box-shadow: none; - -webkit-transition: border-color 0.4s; - transition: border-color 0.4s; -} - -.wp-fullscreen-active .wp-editor-container { - margin: 0 auto 40px; -} - -.wp-fullscreen-active .wp-fullscreen-title { - font-size: 1.7em; - line-height: 100%; - outline: medium none; - padding: 3px 7px; - margin: 10px auto 30px; - display: block; -} - -#wp-fullscreen-tagline { - color: #82878c; - font-size: 18px; - float: right; - padding: 4px 0 0; -} - -/* =Top bar --------------------------------------------------------------- */ -#fullscreen-topbar { - background: #f5f5f5; - border-bottom: 1px solid #dedede; - height: 45px; - position: fixed; - left: 0; - right: 0; - top: 0; - width: 100%; - z-index: 100020; - -webkit-transition: opacity 0.4s; - transition: opacity 0.4s; -} - -#wp-fullscreen-toolbar { - padding: 6px 10px 0; - clear: both; - max-width: 1100px; - margin: 0 auto; -} - -#wp-fullscreen-mode-bar, -#wp-fullscreen-button-bar, -#wp-fullscreen-close { - float: left; -} - -#wp-fullscreen-count, -#wp-fullscreen-tagline { - display: inline-block; -} - -#wp-fullscreen-button-bar { - margin-top: 2px; -} - -#wp-fullscreen-save { - float: right; - padding: 2px 0 0; - min-width: 95px; -} - -#wp-fullscreen-count, -#wp-fullscreen-close { - padding: 5px 0 0; -} - -#wp-fullscreen-central-toolbar { - margin: auto; - padding: 0; - min-width: 620px; -} - -#wp-fullscreen-buttons > div { - float: left; -} - -#wp-fullscreen-mode-bar { - padding: 3px 14px 0 0; -} - -#wp-fullscreen-buttons .hidden { - display: none; -} - -#wp-fullscreen-buttons .disabled { - opacity: 0.5; -} - -#wp-fullscreen-buttons .mce-btn button { - margin: 0; - outline: 0 none; - border: 0 none; - white-space: nowrap; - width: auto; - background: none; - color: #32373c; - cursor: pointer; - font-size: 18px; - line-height: 20px; - overflow: visible; - text-align: center; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; -} - -.wp-html-mode #wp-fullscreen-buttons div { - display: none; -} - -.wp-html-mode #wp-fullscreen-buttons div.wp-fullscreen-both { - display: block; -} - -#wp-fullscreen-save img { - vertical-align: middle; -} - -#wp-fullscreen-save span { - display: none; - margin: 5px 6px 0; - float: left; -} - -/* =Thickbox Adjustments --------------------------------------------------------------- */ -.wp-fullscreen-active #TB_overlay { - z-index: 100050; -} - -.wp-fullscreen-active #TB_window { - z-index: 100051; -} - -/* Colors */ -.fullscreen-overlay { - background: #fff; -} - -/* =CSS 3 transitions --------------------------------------------------------------- */ - -.wp-fullscreen-active #fullscreen-topbar { - -webkit-transition-duration: 0.8s; - transition-duration: 0.8s; - opacity: 0; - filter: alpha(opacity=0); -} - -.wp-fullscreen-active #wp-fullscreen-statusbar { - height: 0; -} - -.wp-fullscreen-active.wp-dfw-show-ui #fullscreen-topbar { - -webkit-transition-duration: 0.4s; - transition-duration: 0.4s; - opacity: 1; - filter: alpha(opacity=100); -} - -.wp-fullscreen-active.wp-dfw-show-ui #wp-fullscreen-statusbar { - height: 29px; - background: #f8f8f8; - border-top: 1px solid #eee; -} - -.wp-fullscreen-active .wp-fullscreen-title, -.wp-fullscreen-active .wp-editor-container { - -webkit-transition-duration: 0.8s; - transition-duration: 0.8s; - border-color: transparent; -} - -.wp-fullscreen-active.wp-dfw-show-ui .wp-fullscreen-title, -.wp-fullscreen-active.wp-dfw-show-ui .wp-editor-container { - -webkit-transition-duration: 0.4s; - transition-duration: 0.4s; - border-color: #ccc; -} - -.fade-1000, -.fade-600, -.fade-400, -.fade-300 { - opacity: 0; - -webkit-transition-property: opacity; - transition-property: opacity; -} - -.fade-1000 { - -webkit-transition-duration: 1s; - transition-duration: 1s; -} - -.fade-600 { - -webkit-transition-duration: 0.6s; - transition-duration: 0.6s; -} - -.fade-400 { - -webkit-transition-duration: 0.4s; - transition-duration: 0.4s; -} - -.fade-300 { - -webkit-transition-duration: 0.3s; - transition-duration: 0.3s; -} - -.fade-trigger { - opacity: 1; -} - -/* DFW on touch screen devices */ -.wp-dfw-touch #fullscreen-topbar { - position: absolute; - opacity: 1; -} - -.wp-dfw-touch .wp-fullscreen-wrap .wp-editor-container, -.wp-dfw-touch .wp-fullscreen-title { - max-width: 700px; -} - -.wp-fullscreen-active.wp-dfw-touch .wp-fullscreen-title, -.wp-fullscreen-active.wp-dfw-touch .wp-editor-container { - border-color: #ccc; -} - -.wp-dfw-touch #wp-fullscreen-statusbar { - height: 30px; -} - -@media screen and ( max-width: 782px ) { - #wp-fullscreen-close, - #wp-fullscreen-central-toolbar, - #wp-fullscreen-mode-bar, - #wp-fullscreen-button-bar, - #wp-fullscreen-save { - display: inline-block; - } - - #fullscreen-topbar { - height: 85px; - } - - #wp-fullscreen-central-toolbar { - width: auto !important; - min-width: 0; - } - - #wp-fullscreen-close { - line-height: 30px; - vertical-align: top; - padding: 0 12px; - } - - #wp-fullscreen-button-bar { - position: absolute; - top: 45px; - left: 0; - } - - .wp-fullscreen-wrap { - top: 95px; - } - - #wp-fullscreen-save { - position: absolute; - right: 10px; - } -} - -@media screen and ( max-width: 480px ) { - #wp_fs_help { - display: none; - } - - .wp-fullscreen-wrap .wp-editor-container, - .wp-fullscreen-title { - width: 480px !important; - } - - body.wp-fullscreen-active { - width: 480px; - overflow: auto; - } - - #fullscreen-topbar, - .wp-fullscreen-wrap { - width: 480px; - } - - #fullscreen-topbar { - position: absolute; - } - - #wp-fullscreen-status { - width: auto !important; - max-width: 100%; - padding: 0 10px; - } -} - /* =Localization -------------------------------------------------------------- */ .rtl .wp-switch-editor, @@ -2136,8 +1742,7 @@ html:lang(he-il) .rtl .quicktags-toolbar input { @media print, (-webkit-min-device-pixel-ratio: 1.25), (min-resolution: 120dpi) { - .wp-media-buttons .add_media span.wp-media-buttons-icon, - #wp-fullscreen-buttons #wp_fs_image span.mce_image { + .wp-media-buttons .add_media span.wp-media-buttons-icon { background: none; } }