X-Git-Url: https://scripts.mit.edu/gitweb/autoinstalls/wordpress.git/blobdiff_plain/03f2fa83c13c1b532284205fa7efcab9b8b2c41f..refs/tags/wordpress-4.5:/wp-admin/css/common.css diff --git a/wp-admin/css/common.css b/wp-admin/css/common.css index e63b1629..e98e87ea 100644 --- a/wp-admin/css/common.css +++ b/wp-admin/css/common.css @@ -114,6 +114,13 @@ clear: both; } +/* modern clearfix */ +.wp-clearfix:after { + content: ""; + display: table; + clear: both; +} + /* Hide visually but not from screen readers */ .screen-reader-text, .screen-reader-text span, @@ -265,13 +272,14 @@ a:active { } a:focus, -a:focus .media-icon img { +a:focus .media-icon img, +.wp-person a:focus .gravatar { color: #124964; - -webkit-box-shadow: - 0 0 0 1px #5b9dd9, + -webkit-box-shadow: + 0 0 0 1px #5b9dd9, 0 0 2px 1px rgba(30, 140, 190, .8); - box-shadow: - 0 0 0 1px #5b9dd9, + box-shadow: + 0 0 0 1px #5b9dd9, 0 0 2px 1px rgba(30, 140, 190, .8); } @@ -337,8 +345,12 @@ h3 { margin: 1em 0; } +.update-core-php h2 { + margin-top: 2em; +} + .update-php h2, -.update-core-php h2, +.update-messages h2, h4 { font-size: 1em; margin: 1.33em 0; @@ -431,7 +443,7 @@ code { .subsubsub a .count, .subsubsub a.current .count { - color: #999; + color: #555d66; /* #f1f1f1 background */ font-weight: normal; } @@ -504,6 +516,7 @@ code { } .widefat th input, +.updates-table td input, .widefat thead td input, .widefat tfoot td input { margin: 0 0 0 8px; @@ -517,18 +530,13 @@ code { vertical-align: top; } -.widefat th input[type=checkbox], -.widefat thead td input[type=checkbox], -.widefat tfoot td input[type=checkbox] { - margin-top: -1px; -} - .widefat tbody th.check-column { padding: 9px 0 22px; } .widefat thead td.check-column, .widefat tbody th.check-column, +.updates-table tbody td.check-column, .widefat tfoot td.check-column { padding: 11px 0 0 3px; } @@ -578,7 +586,7 @@ code { .subtitle { margin: 0; padding-left: 25px; - color: #777; + color: #555d66; font-size: 14px; font-weight: normal; } @@ -593,9 +601,10 @@ code { top: -3px; text-decoration: none; border: none; + border: 1px solid #ccc; -webkit-border-radius: 2px; border-radius: 2px; - background: #e0e0e0; + background: #f7f7f7; text-shadow: none; font-weight: 600; font-size: 13px; @@ -603,10 +612,17 @@ code { .wrap .add-new-h2:hover, /* deprecated */ .wrap .page-title-action:hover { + border-color: #008EC2; background: #00a0d2; color: #fff; } +.wrap .page-title-action:focus { + border-color: #5b9dd9; + -webkit-box-shadow: 0 0 2px rgba( 30, 140, 190, 0.8 ); + box-shadow: 0 0 2px rgba( 30, 140, 190, 0.8 ); +} + .wrap h1.long-header { padding-right: 0; } @@ -645,11 +661,6 @@ ul.striped > :nth-child(odd), border-right-color: #99d; } -.media-upload-form label.form-help, -td.help { - color: #9a9a9a; -} - /* Helper classes for plugins to leverage the active WordPress color scheme */ .highlight { @@ -682,7 +693,7 @@ td.help { } .wp-ui-text-icon { - color: #999; + color: #82878c; /* same as new icons */ } /* For emoji replacement images */ @@ -826,6 +837,7 @@ hr { } abbr.required, +span.required, .file-error, .widget-control-remove:hover, .row-actions .delete a:hover, @@ -900,26 +912,6 @@ abbr.required, margin-left: 18px; } -.side-info { - margin: 0; - padding: 4px; - font-size: 11px; -} - -.side-info h5 { - padding-bottom: 7px; - font-size: 14px; - margin: 12px 2px 5px; - border-bottom: 1px solid #dadada; -} - -.side-info ul { - margin: 0; - padding-left: 18px; - list-style: square; - color: #666; -} - .approve, .unapproved .unapprove { display: none; @@ -972,7 +964,7 @@ th.action-links { padding: 4px 10px; -webkit-border-radius: 30px; border-radius: 30px; - background: #777; + background: #72777c; color: #fff; font-size: 14px; font-weight: 600; @@ -1063,7 +1055,7 @@ th.action-links { margin: 0 5px 0 0; width: 16px; height: 16px; - color: #777; + color: #72777c; -webkit-transition: color .1s ease-in 0; transition: color .1s ease-in 0; font-family: dashicons; @@ -1126,7 +1118,7 @@ th.action-links { -webkit-border-radius: 2px; border-radius: 2px; border: none; - background: #777; + background: #72777c; color: #fff; } @@ -1328,7 +1320,6 @@ div.error p, .updated a { padding-bottom: 2px; - text-decoration: none; } .notice-alt { @@ -1538,7 +1529,7 @@ form.upgrade .hint { background: none; -webkit-border-radius: 0; border-radius: 0; - color: #777; + color: #72777c; line-height: 1.7; padding: 3px 6px 3px 16px; } @@ -1570,7 +1561,7 @@ form.upgrade .hint { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-decoration: none !important; - color: #b4b9be; + color: #72777c; } #screen-meta-links .screen-meta-active:after { @@ -1652,7 +1643,7 @@ form.upgrade .hint { } .screen-options + .screen-options { - margin-top: 10px; + margin-top: 10px; } .metabox-prefs .submit { @@ -1825,6 +1816,23 @@ html.wp-toolbar { .metabox-holder .postbox-container .empty-container { border: 3px dashed #b4b9be; height: 250px; + position: relative; +} + +.metabox-holder .postbox-container .empty-container:after { + content: attr(data-emptystring); + margin: auto; + position: absolute; + top: 0; + left: 0; + bottom: 0; + right: 0; + height: 1em; + width: 200px; + text-align: center; + color: #ccc; + font-size:18px; + display: none; } .metabox-holder.columns-1 .postbox-container .empty-container, @@ -1971,7 +1979,7 @@ html.wp-toolbar { left: 0; right: 0; padding: 10px 20px; - color: #777; + color: #555d66; } #wpfooter p { @@ -2005,7 +2013,7 @@ html.wp-toolbar { font-size: 14px; line-height: 24px; font-weight: 600; - background: #e4e4e4; + background: #e5e5e5; color: #555; text-decoration: none; white-space: nowrap; @@ -2021,7 +2029,7 @@ h3 .nav-tab, /* Back-compat for pre-4.4 */ .nav-tab:hover, .nav-tab:focus { background-color: #fff; - color: #464646; + color: #444; } .nav-tab-active, @@ -2032,7 +2040,7 @@ h3 .nav-tab, /* Back-compat for pre-4.4 */ .nav-tab-active { margin-bottom: -1px; - color: #464646; + color: #444; } .nav-tab-active, @@ -2049,15 +2057,23 @@ h1.nav-tab-wrapper, /* Back-compat for pre-4.4 */ h3.nav-tab-wrapper { border-bottom: 1px solid #ccc; margin: 0; - padding: 9px 15px 0 0; + padding-top: 9px; + padding-bottom: 0; line-height: inherit; } -/* contain floats */ -.nav-tab-wrapper:after { - content: ""; - display: table; - clear: both; +/* Back-compat for plugins. Deprecated. Use .wp-clearfix instead. */ +.nav-tab-wrapper:not(.wp-clearfix):after { + content: ""; + display: table; + clear: both; + } + +.ie8 .nav-tab-wrapper { + /* contain floats establishing a new block formatting context */ + display: inline-block; + width: 100%; + vertical-align: top; } /*------------------------------------------------------------------------------ @@ -2146,7 +2162,7 @@ body.iframe { } .media-icon img { - border: 1px solid #e7e7e7; + border: 1px solid #e5e5e5; border: 1px solid rgba(0, 0, 0, 0.07); } @@ -2480,7 +2496,7 @@ div.action-links { } #plugin-information .fyi strong { - color: #464646; + color: #444; } #plugin-information .fyi h3 { @@ -2507,6 +2523,10 @@ div.action-links { margin: 0 0 10px; } +#plugin-information .fyi-description { + margin-top: 0; +} + #plugin-information .counter-container { margin: 3px 0; } @@ -2520,7 +2540,7 @@ div.action-links { #plugin-information .counter-back { height: 17px; width: 92px; - background-color: #ececec; + background-color: #e5e5e5; float: left; } @@ -2616,7 +2636,7 @@ div.action-links { overflow: hidden; /* clearfix */ width: 100%; margin-bottom: 20px; - border-bottom: 1px solid #e6e6e6; + border-bottom: 1px solid #e5e5e5; } #plugin-information .review-title-section { @@ -2795,67 +2815,67 @@ body.index-php #TB_ajaxWindowTitle { display: none; } -body.about-php .tb-close-icon, -body.plugin-install-php .tb-close-icon, -body.import-php .tb-close-icon, -body.plugins-php .tb-close-icon, -body.update-core-php .tb-close-icon, -body.index-php .tb-close-icon { +/* only on these screens */ +.about-php #TB_closeWindowButton, +.plugin-install-php #TB_closeWindowButton, +.import-php #TB_closeWindowButton, +.plugins-php #TB_closeWindowButton, +.update-core-php #TB_closeWindowButton, +.index-php #TB_closeWindowButton { left: auto; right: -30px; color: #eee; - -webkit-transition: color .1s ease-in-out, background .1s ease-in-out; - transition: color .1s ease-in-out, background .1s ease-in-out; } + +body.about-php #TB_closeWindowButton:hover, body.about-php #TB_closeWindowButton:focus, -body.about-php #TB_closeWindowButton:focus .tb-close-icon, -body.about-php .tb-close-icon:focus, -body.about-php .tb-close-icon:hover, +body.plugin-install-php #TB_closeWindowButton:hover, body.plugin-install-php #TB_closeWindowButton:focus, -body.plugin-install-php #TB_closeWindowButton:focus .tb-close-icon, -body.plugin-install-php .tb-close-icon:focus, -body.plugin-install-php .tb-close-icon:hover, +body.import-php #TB_closeWindowButton:hover, body.import-php #TB_closeWindowButton:focus, -body.import-php #TB_closeWindowButton:focus .tb-close-icon, -body.import-php .tb-close-icon:focus, -body.import-php .tb-close-icon:hover, +body.plugins-php #TB_closeWindowButton:hover, body.plugins-php #TB_closeWindowButton:focus, -body.plugins-php #TB_closeWindowButton:focus .tb-close-icon, -body.plugins-php .tb-close-icon:focus, -body.plugins-php .tb-close-icon:hover, +body.update-core-php #TB_closeWindowButton:hover, body.update-core-php #TB_closeWindowButton:focus, -body.update-core-php #TB_closeWindowButton:focus .tb-close-icon, -body.update-core-php .tb-close-icon:focus, -body.update-core-php .tb-close-icon:hover, -body.index-php #TB_closeWindowButton:focus, -body.index-php #TB_closeWindowButton:focus .tb-close-icon, -body.index-php .tb-close-icon:focus, -body.index-php .tb-close-icon:hover { +body.index-php #TB_closeWindowButton:hover, +body.index-php #TB_closeWindowButton:focus { color: #00a0d2; outline: none; -webkit-box-shadow: none; box-shadow: none; } -body.about-php .tb-close-icon:before, -body.plugin-install-php .tb-close-icon:before, -body.import-php .tb-close-icon:before, -body.plugins-php .tb-close-icon:before, -body.update-core-php .tb-close-icon:before, -body.index-php .tb-close-icon:before { +body.about-php .tb-close-icon, +body.plugin-install-php .tb-close-icon, +body.import-php .tb-close-icon, +body.plugins-php .tb-close-icon, +body.update-core-php .tb-close-icon, +body.index-php .tb-close-icon { + display: none; +} + +body.about-php #TB_closeWindowButton:after, +body.plugin-install-php #TB_closeWindowButton:after, +body.import-php #TB_closeWindowButton:after, +body.plugins-php #TB_closeWindowButton:after, +body.update-core-php #TB_closeWindowButton:after, +body.index-php #TB_closeWindowButton:after { content: "\f335"; - font-size: 32px; + font: normal 32px/29px 'dashicons'; + speak: none; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; } /* move plugin install close icon to top on narrow screens */ @media screen and ( max-width: 830px ) { - body.about-php .tb-close-icon, - body.plugin-install-php .tb-close-icon, - body.import-php .tb-close-icon, - body.plugins-php .tb-close-icon, - body.update-core-php .tb-close-icon, - body.index-php .tb-close-icon { + body.about-php #TB_closeWindowButton, + body.plugin-install-php #TB_closeWindowButton, + body.import-php #TB_closeWindowButton, + body.plugins-php #TB_closeWindowButton, + body.update-core-php #TB_closeWindowButton, + body.index-php #TB_closeWindowButton { right: 0; top: -30px; } @@ -2866,16 +2886,6 @@ img { border: none; } -/* Header */ -/* @todo: are these also specific to Press This? */ -#wphead { - border-bottom: 1px solid #dfdfdf; -} - -#wphead h1 a { - color: #464646; -} - /* Metabox collapse arrow indicators */ .js .sidebar-name .sidebar-name-arrow:before, .js .meta-box-sortables .postbox .toggle-indicator:before { @@ -2927,10 +2937,10 @@ img { .js .postbox .handlediv:focus .toggle-indicator:before { -webkit-box-shadow: - 0 0 0 1px #5b9dd9, + 0 0 0 1px #5b9dd9, 0 0 2px 1px rgba(30, 140, 190, .8); - box-shadow: - 0 0 0 1px #5b9dd9, + box-shadow: + 0 0 0 1px #5b9dd9, 0 0 2px 1px rgba(30, 140, 190, .8); } @@ -3046,21 +3056,26 @@ img { text-decoration: none !important; } -.widget-action, .handlediv, .item-edit, .sidebar-name-arrow, .accordion-section-title:after { - color: #a0a5aa; + color: #72777c; } -.widget-action:hover, +.widget-action { + color: #555d66; /* #fafafa background in the Widgets screen */ +} + +.widget-top:hover .widget-action, +.widget-action:focus, .handlediv:hover, .handlediv:focus, .item-edit:hover, +.item-edit:focus, .sidebar-name:hover .sidebar-name-arrow, .accordion-section-title:hover:after { - color: #777; + color: #23282d; } .widget-top a.widget-action:after { @@ -3110,7 +3125,7 @@ img { /* Accordion */ .accordion-section { - border-bottom: 1px solid #dfdfdf; + border-bottom: 1px solid #ddd; margin: 0; } @@ -3120,7 +3135,7 @@ img { } .accordion-section.open:hover { - border-bottom-color: #dfdfdf; + border-bottom-color: #ddd; } .accordion-section-content { @@ -3134,8 +3149,8 @@ img { margin: 0; padding: 12px 15px 15px; position: relative; - border-left: 1px solid #dfdfdf; - border-right: 1px solid #dfdfdf; + border-left: 1px solid #ddd; + border-right: 1px solid #ddd; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; @@ -3192,7 +3207,7 @@ img { .control-section.open .accordion-section-title { /* When expanded */ - border-bottom: 1px solid #dfdfdf; + border-bottom: 1px solid #ddd; } /* Edit Site */ @@ -3624,15 +3639,13 @@ img { h1.nav-tab-wrapper, .wrap h2.nav-tab-wrapper, h3.nav-tab-wrapper { - padding-left: 0; border-bottom: 0; } h1 .nav-tab, h2 .nav-tab, h3 .nav-tab { - margin-top: 10px; - margin-right: 10px; + margin: 10px 10px 0 0; border-bottom: 1px solid #ccc; } }