diff -r 3d4e9c994f10 -r a86126ab1dd4 wp/wp-admin/css/common-rtl.css --- a/wp/wp-admin/css/common-rtl.css Tue Oct 22 16:11:46 2019 +0200 +++ b/wp/wp-admin/css/common-rtl.css Tue Dec 15 13:49:49 2020 +0100 @@ -1,3 +1,4 @@ +/*! This file is auto-generated */ /* 2 column liquid layout */ #wpwrap { height: auto; @@ -26,7 +27,7 @@ padding-bottom: 65px; float: right; width: 100%; - overflow: visible !important; + overflow: visible; } /* inner 2 column liquid layout */ @@ -190,7 +191,7 @@ .feature-filter, .imgedit-group, .comment-ays { - border: 1px solid #e5e5e5; + border: 1px solid #ccd0d4; box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04); } @@ -265,7 +266,7 @@ a:hover, a:active { - color: #00a0d2; + color: #006799; } a:focus, @@ -275,12 +276,8 @@ box-shadow: 0 0 0 1px #5b9dd9, 0 0 2px 1px rgba(30, 140, 190, 0.8); - /* Only visible in Windows High Contrast mode */ - outline: 1px solid transparent; -} - -.ie8 a:focus { - outline: #5b9dd9 solid 1px; + /* Only visible in Windows High Contrast mode */ + outline: 1px solid transparent; } #adminmenu a:focus { @@ -308,7 +305,8 @@ content: none; } -p { +p, +.wp-die-message { font-size: 13px; line-height: 1.5; margin: 1em 0; @@ -484,12 +482,12 @@ .widefat thead th, .widefat thead td { - border-bottom: 1px solid #e1e1e1; + border-bottom: 1px solid #ccd0d4; } .widefat tfoot th, .widefat tfoot td { - border-top: 1px solid #e1e1e1; + border-top: 1px solid #ccd0d4; border-bottom: none; } @@ -617,15 +615,14 @@ position: relative; top: -3px; text-decoration: none; - border: none; - border: 1px solid #ccc; + border: 1px solid #0071a1; border-radius: 2px; - background: #f7f7f7; text-shadow: none; font-weight: 600; font-size: 13px; line-height: normal; /* IE8-IE11 need this for buttons */ - color: #0073aa; /* some of these controls are button elements and don't inherit from links */ + color: #0071a1; /* use the standard color used for buttons */ + background: #f3f5f6; cursor: pointer; } @@ -635,19 +632,25 @@ .wrap .add-new-h2:hover, /* deprecated */ .wrap .page-title-action:hover { - border-color: #008EC2; - background: #00a0d2; - color: #fff; + background: #f1f1f1; + border-color: #016087; + color: #016087; } /* lower specificity: color needs to be overridden by :hover and :active */ .page-title-action:focus { - color: #124964; + color: #016087; +} + +/* Dashicon for language options on General Settings and Profile screens */ +.form-table th label[for="locale"] .dashicons, +.form-table th label[for="WPLANG"] .dashicons { + margin-right: 5px; } .wrap .page-title-action:focus { - border-color: #5b9dd9; - box-shadow: 0 0 2px rgba(30, 140, 190, 0.8); + border-color: #007cba; + box-shadow: 0 0 0 1px #007cba; /* Only visible in Windows High Contrast mode */ outline: 2px solid transparent; } @@ -765,13 +768,11 @@ color: #23282d; } -.postbox .hndle, .stuffbox .hndle { - border-bottom: 1px solid #eee; -} - -.quicktags, -.search { + border-bottom: 1px solid #ccd0d4; +} + +.quicktags { background-color: #ccc; color: #000; font-size: 12px; @@ -850,7 +851,6 @@ .howto { color: #666; - font-style: italic; display: block; } @@ -914,11 +914,11 @@ #delete-action { float: right; - line-height: 2.1; + line-height: 2.30769231; /* 30px */ } #delete-link { - line-height: 2.1; + line-height: 2.30769231; /* 30px */ vertical-align: middle; text-align: right; margin-right: 8px; @@ -935,7 +935,8 @@ } #publishing-action .spinner { - float: right; + float: none; + margin-top: 5px; } #misc-publishing-actions { @@ -997,7 +998,7 @@ padding: 0 10px; width: 100%; box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04); - border: 1px solid #e5e5e5; + border: 1px solid #ccd0d4; background: #fff; color: #555; font-size: 13px; @@ -1067,7 +1068,7 @@ .filter-links li > a:focus, .show-filters .filter-links a.current:hover, .show-filters .filter-links a.current:focus { - color: #00a0d2; + color: #006799; } .wp-filter .search-form { @@ -1076,23 +1077,33 @@ } .wp-filter .search-form input[type="search"] { - margin: 0; - padding: 3px 5px; + margin: 1px 0; width: 280px; max-width: 100%; - font-size: 16px; - font-weight: 300; - line-height: 1.5; } .wp-filter .search-form select { margin: 0; - height: 32px; - vertical-align: top; +} + +/* Use flexbox only on the plugins install page. The `filter-links` and search form children will become flex items. */ +.plugin-install-php .wp-filter { + display: flex; + flex-wrap: wrap; + justify-content: space-between; + align-items: center; } .wp-filter .search-form.search-plugins { + /* This element is a flex item: the inherited float won't have any effect. */ + margin-top: 0; +} + +.wp-filter .search-form.search-plugins select, +.wp-filter .search-form.search-plugins .wp-filter-search { display: inline-block; + margin-top: 10px; + vertical-align: top; } .wp-filter .button.drawer-toggle { @@ -1120,7 +1131,7 @@ .wp-filter .button.drawer-toggle:focus, .wp-filter .drawer-toggle:focus:before { background-color: transparent; - color: #00a0d2; + color: #006799; } .wp-filter .button.drawer-toggle:hover, @@ -1275,7 +1286,7 @@ .filters-applied .filter-group, .filters-applied .filter-drawer .buttons, .filters-applied .filter-drawer br { - display: none !important; + display: none; } .filters-applied .filtered-by { @@ -1364,8 +1375,9 @@ div.updated, div.error { background: #fff; - border-right: 4px solid #fff; - box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.1); + border: 1px solid #ccd0d4; + border-right-width: 4px; + box-shadow: 0 1px 1px rgba(0,0,0,.04); margin: 5px 15px 2px; padding: 1px 12px; } @@ -1430,11 +1442,9 @@ .notice-dismiss:focus { outline: none; - box-shadow: 0 0 0 1px #5b9dd9, 0 0 2px 1px rgba(30, 140, 190, 0.8); -} - -.ie8 .notice-dismiss:focus { - outline: 1px solid #5b9dd9; + box-shadow: + 0 0 0 1px #5b9dd9, + 0 0 2px 1px rgba(30, 140, 190, 0.8); } .notice-success, @@ -1524,10 +1534,16 @@ .updating-message p:before, .import-php .updating-message:before, .button.updating-message:before, -.button.installing:before { +.button.installing:before, +.plugins .column-auto-updates .dashicons-update.spin, +.theme-overlay .theme-autoupdate .dashicons-update.spin { animation: rotation 2s infinite linear; } +.theme-overlay .theme-autoupdate .dashicons-update.spin { + margin-left: 3px; +} + /* Updated icon (check mark). */ .updated-message p:before, .installed p:before, @@ -1554,11 +1570,7 @@ line-height: 1.4; padding: 11px 15px; font-size: 14px; - text-align: right; margin: 25px 2px 0 20px; - background-color: #fff; - border-right: 4px solid #ffba00; - box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.1); } ul#dismissed-updates { @@ -1655,7 +1667,7 @@ #contextual-help-wrap { overflow: auto; - margin-right: 0 !important; + margin-right: 0; } #screen-meta-links { @@ -1669,9 +1681,9 @@ margin: 0 0px -1px 20px; position: relative; background-color: #fff; - border: 1px solid #ddd; + border: 1px solid #ccd0d4; border-top: none; - box-shadow: 0 1px 0 rgba(0, 0, 0, 0.025); + box-shadow: 0 0 0 transparent; } #screen-options-link-wrap, @@ -1686,17 +1698,17 @@ } #screen-meta-links .show-settings { - border: 1px solid #ddd; + border: 1px solid #ccd0d4; border-top: none; - border-bottom-color: #ccc; height: auto; margin-bottom: 0; padding: 3px 16px 3px 6px; background: #fff; - border-radius: 0; + border-radius: 0 0 4px 4px; color: #72777c; line-height: 1.7; - box-shadow: none; + box-shadow: 0 0 0 transparent; + transition: box-shadow 0.1s linear; } #screen-meta-links .show-settings:hover, @@ -1726,7 +1738,7 @@ vertical-align: bottom; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; - text-decoration: none !important; + text-decoration: none; color: #72777c; } @@ -1758,10 +1770,6 @@ font-weight: 600; } -.ie8 #screen-options-wrap legend { - color: inherit; -} - .metabox-prefs label { display: inline-block; padding-left: 15px; @@ -1835,7 +1843,7 @@ bottom: 0; right: 150px; left: 170px; - border: 1px solid #e1e1e1; + border: 1px solid #ccd0d4; border-top: none; border-bottom: none; background: #f6fbfd; @@ -1888,7 +1896,7 @@ } .contextual-help-tabs .active a { - border-color: #e1e1e1; + border-color: #ccd0d4; color: #32373c; } @@ -1978,37 +1986,12 @@ padding-top: 10px; } -.metabox-holder .postbox-container .empty-container { - border: 3px dashed #b4b9be; - height: 250px; +.metabox-holder .postbox-container .meta-box-sortables { + /* The jQuery UI Sortables need some initial height to work properly. */ + min-height: 1px; position: relative; } -.metabox-holder .postbox-container .empty-container:after { - content: attr(data-emptystring); - margin: auto; - position: absolute; - top: 0; - right: 0; - bottom: 0; - left: 0; - height: 1em; - width: 200px; - text-align: center; - color: #ccc; - font-size: 18px; - display: none; -} - -.metabox-holder.columns-1 .postbox-container .empty-container, -.columns-2 #postbox-container-3 .empty-container, -.columns-2 #postbox-container-4 .empty-container, -.columns-3 #postbox-container-4 .empty-container { - border: 0 none; - height: 0; - min-height: 0; -} - #post-body-content { width: 100%; min-width: 463px; @@ -2028,7 +2011,7 @@ /* one column on the dash */ @media only screen and (max-width: 799px) { #wpbody-content .metabox-holder .postbox-container .empty-container { - border: 0 none; + outline: none; height: 0; min-height: 0; } @@ -2039,14 +2022,40 @@ cursor: move; } +.js .widget .widget-top.is-non-sortable, +.js .postbox .hndle.is-non-sortable { + cursor: auto; +} + +/* Configurable dashboard widgets "Configure" edit-box link. */ .hndle a { - font-size: 11px; + font-size: 12px; font-weight: 400; } +.postbox-header { + display: flex; + align-items: center; + justify-content: space-between; + border-bottom: 1px solid #ccd0d4; +} + +.postbox-header .hndle { + flex-grow: 1; + /* Handle the alignment for the configurable dashboard widgets "Configure" edit-box link. */ + display: flex; + justify-content: space-between; + align-items: center; +} + +.postbox-header .handle-actions { + flex-shrink: 0; +} + +/* Post box order and toggle buttons. */ +.postbox .handle-order-higher, +.postbox .handle-order-lower, .postbox .handlediv { - display: none; - float: left; width: 36px; height: 36px; margin: 0; @@ -2056,8 +2065,24 @@ cursor: pointer; } -.js .postbox .handlediv { - display: block; +.postbox .handle-order-higher, +.postbox .handle-order-lower { + color: #72777c; + width: 1.62rem; +} + +/* Post box order buttons in the block editor meta boxes area. */ +.edit-post-meta-boxes-area .postbox .handle-order-higher, +.edit-post-meta-boxes-area .postbox .handle-order-lower { + width: 44px; + height: 44px; + color: #191e23 +} + +.postbox .handle-order-higher[aria-disabled="true"], +.postbox .handle-order-lower[aria-disabled="true"] { + cursor: default; + color: #a0a5aa; } .sortable-placeholder { @@ -2072,6 +2097,10 @@ line-height: 1; } +.postbox.closed { + border-bottom: 0; +} + /* user-select is not a part of the CSS standard - may change behavior in the future */ .postbox .hndle, .stuffbox .hndle { @@ -2138,7 +2167,8 @@ #pass-strength-result.short, #ed_reply_toolbar #ed_reply_strong, .item-controls .item-order a, -.feature-filter .feature-name { +.feature-filter .feature-name, +#comment-status-display { font-weight: 600; } @@ -2233,13 +2263,6 @@ clear: both; } -.ie8 .nav-tab-wrapper { - /* contain floats establishing a new block formatting context */ - display: inline-block; - width: 100%; - vertical-align: top; -} - /*------------------------------------------------------------------------------ 26.0 - Misc ------------------------------------------------------------------------------*/ @@ -2415,10 +2438,6 @@ margin: 10px 0; } -#submitdiv h3 { - margin-bottom: 0 !important; -} - /* - Used - but could/should be deprecated with a CSS reset ------------------------------------------------------------------------------*/ .zerosize { @@ -2463,11 +2482,11 @@ position: relative; height: 17px; width: 100px; - background: url(../images/stars.png?ver=20121108) repeat-x bottom left; + background: url(../images/stars.png?ver=20121108) repeat-x bottom right; } div.star-holder .star-rating { - background: url(../images/stars.png?ver=20121108) repeat-x top left; + background: url(../images/stars.png?ver=20121108) repeat-x top right; height: 17px; float: right; } @@ -2659,7 +2678,7 @@ margin-top: 10px; margin-left: 250px; /* FYI box */ padding: 10px 26px; - margin-bottom: -99939px; /* 60px less than the padding below to accommodate footer */ + margin-bottom: -99932px; /* 67px less than the padding below to accommodate footer height */ padding-bottom: 99999px; /* equal height column trick */ } @@ -2677,7 +2696,7 @@ top: 0; left: 0; padding: 16px; - margin-bottom: -99939px; /* 60px less than the padding below to accommodate footer */ + margin-bottom: -99932px; /* 67px less than the padding below to accommodate footer height */ padding-bottom: 99999px; /* equal height column trick */ width: 217px; border-right: 1px solid #ddd; @@ -2771,7 +2790,7 @@ left: 0; bottom: 0; right: 0; - height: 33px; /* 33+13+13+1=60 */ + height: 40px; /* actual height: 40+13+13+1=67 */ border-top: 1px solid #ddd; background: #f3f3f3; } @@ -2984,7 +3003,7 @@ .plugin-details-modal #TB_closeWindowButton:hover, .plugin-details-modal #TB_closeWindowButton:focus { - color: #00a0d2; + color: #006799; outline: none; box-shadow: none; } @@ -3015,52 +3034,83 @@ } /* Metabox collapse arrow indicators */ -.sidebar-name .toggle-indicator:before, -.js .meta-box-sortables .postbox .toggle-indicator:before, -.bulk-action-notice .toggle-indicator:before, -.privacy-text-box .toggle-indicator:before { +.sidebar-name .toggle-indicator::before, +.meta-box-sortables .postbox .toggle-indicator::before, +.meta-box-sortables .postbox .order-higher-indicator::before, +.meta-box-sortables .postbox .order-lower-indicator::before, +.bulk-action-notice .toggle-indicator::before, +.privacy-text-box .toggle-indicator::before { content: "\f142"; display: inline-block; font: normal 20px/1 dashicons; speak: none; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; - text-decoration: none !important; -} - -.js .widgets-holder-wrap.closed .toggle-indicator:before, -.js .meta-box-sortables .postbox.closed .handlediv .toggle-indicator:before, -.bulk-action-notice .bulk-action-errors-collapsed .toggle-indicator:before, -.privacy-text-box.closed .toggle-indicator:before { + text-decoration: none; +} + +.js .widgets-holder-wrap.closed .toggle-indicator::before, +.meta-box-sortables .postbox.closed .handlediv .toggle-indicator::before, +.bulk-action-notice .bulk-action-errors-collapsed .toggle-indicator::before, +.privacy-text-box.closed .toggle-indicator::before { content: "\f140"; } -.js .postbox .handlediv .toggle-indicator:before { - margin-top: 4px; +.postbox .handle-order-higher .order-higher-indicator::before { + content: "\f343"; + color: inherit; +} + +.postbox .handle-order-lower .order-lower-indicator::before { + content: "\f347"; + color: inherit; +} + +.postbox .handle-order-higher .order-higher-indicator::before, +.postbox .handle-order-lower .order-lower-indicator::before { + position: relative; + top: 0.11rem; + width: 20px; + height: 20px; +} + +.postbox .handlediv .toggle-indicator::before { width: 20px; border-radius: 50%; - text-indent: -1px; /* account for the dashicon alignment */ -} - -.rtl.js .postbox .handlediv .toggle-indicator:before { - text-indent: 1px; /* account for the dashicon alignment */ -} - -.bulk-action-notice .toggle-indicator:before { +} + +.postbox .handlediv .toggle-indicator::before { + position: relative; + top: 0.05rem; + text-indent: -1px; /* account for the dashicon glyph uneven horizontal alignment */ +} + +.rtl .postbox .handlediv .toggle-indicator::before { + text-indent: 1px; /* account for the dashicon glyph uneven horizontal alignment */ +} + +.bulk-action-notice .toggle-indicator::before { line-height: 16px; vertical-align: top; color: #72777c; } -.js .postbox .handlediv:focus { - box-shadow: none; - outline: none; -} - -.js .postbox .handlediv:focus .toggle-indicator:before { +.postbox .handle-order-higher:focus, +.postbox .handle-order-lower:focus, +.postbox .handlediv:focus { box-shadow: 0 0 0 1px #5b9dd9, 0 0 2px 1px rgba(30, 140, 190, 0.8); + /* Only visible in Windows High Contrast mode */ + outline: 1px solid transparent; +} + +.postbox .handle-order-higher:focus .order-higher-indicator::before, +.postbox .handle-order-lower:focus .order-lower-indicator::before, +.postbox .handlediv:focus .toggle-indicator::before { + box-shadow: none; + /* Only visible in Windows High Contrast mode */ + outline: 1px solid transparent; } /* @todo: appears to be Press This only and overridden */ @@ -3155,7 +3205,9 @@ } [role="treeitem"] .folder-label.focus { color: #124964; - box-shadow: 0 0 0 1px #5b9dd9, 0 0 2px 1px rgba(30, 140, 190, 0.8); + box-shadow: + 0 0 0 1px #5b9dd9, + 0 0 2px 1px rgba(30, 140, 190, 0.8); } [role="treeitem"].hover, [role="treeitem"] .folder-label.hover { @@ -3348,7 +3400,7 @@ display: block; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; - text-decoration: none !important; + text-decoration: none; } .widget-top .widget-action .toggle-indicator:before { @@ -3379,6 +3431,8 @@ .sidebar-name:hover .toggle-indicator, .accordion-section-title:hover:after { color: #23282d; + /* Only visible in Windows High Contrast mode */ + outline: 1px solid transparent; } .widget-top .widget-action:focus .toggle-indicator:before { @@ -3461,12 +3515,15 @@ } .accordion-section-title:focus { - outline: none; + /* Only visible in Windows High Contrast mode */ + outline: 1px solid transparent; } .accordion-section-title:hover:after, .accordion-section-title:focus:after { border-color: #a0a5aa transparent; + /* Only visible in Windows High Contrast mode */ + outline: 1px solid transparent; } .cannot-expand .accordion-section-title { @@ -3664,7 +3721,7 @@ /* Back-compat for pre-3.8 */ div.star-holder, div.star-holder .star-rating { - background: url(../images/stars-2x.png?ver=20121108) repeat-x bottom left; + background: url(../images/stars-2x.png?ver=20121108) repeat-x bottom right; background-size: 21px 37px; } @@ -3672,19 +3729,6 @@ background-image: url(../images/spinner-2x.gif); } - /* @todo: evaluate - most of these were likely replaced by dashicons */ - .curtime #timestamp, - #screen-meta-links a.show-settings, - .widget-top .widget-action, - .widget-top .widget-action:hover, - .sidebar-name .toggle-indicator, - .sidebar-name:hover .toggle-indicator, - .meta-box-sortables .postbox:hover .handlediv, - #bulk-titles div a, - #bulk-titles div a:hover { - background: none !important; - } - } @-ms-viewport { @@ -3785,6 +3829,8 @@ code { word-wrap: break-word; + word-wrap: anywhere; /* Firefox. Allow breaking long words anywhere */ + word-break: break-word; /* Webkit: Treated similarly to word-wrap: break-word */ } /* General Metabox */ @@ -3904,8 +3950,7 @@ } .fileedit-sub input[type="submit"] { - margin-bottom: 0px; - padding: 8px 18px; + margin-bottom: 0; } #documentation label[for="docs-list"] { @@ -3919,7 +3964,6 @@ #documentation input[type="button"] { margin-bottom: 0; - padding: 8px 18px; } #wpfooter { @@ -3980,9 +4024,23 @@ float: none; } + #screen-meta, + #screen-meta-links { + margin-left: 10px; + } + #screen-meta-links { margin-bottom: 20px; /* Add margins beneath links for better spacing between boxes and elements */ } + + .wp-filter .search-form input[type="search"] { + font-size: 1rem; + } + + .wp-filter .search-form.search-plugins { + /* This element is a flex item. */ + min-width: 100%; + } } /* Smartphone */ @@ -4029,6 +4087,10 @@ .nav-tab-active:focus:active { border-bottom: 1px solid #ccc; } + + .wp-filter .search-form input[type="search"] { + width: 100%; + } } @media screen and (max-width: 320px) {