From 3b56df670ee3c707f5df5092696bd12c55142668 Mon Sep 17 00:00:00 2001 From: "Dominik Schilling (ocean90)" Date: Fri, 18 Oct 2013 17:35:39 +0000 Subject: [PATCH] CSS cleanup for the about page. Also fixes for IE and support for RTL. see #25603. git-svn-id: https://develop.svn.wordpress.org/trunk@25844 602fd350-edb4-49c9-b593-d223f7449a82 --- src/wp-admin/about.php | 8 +- src/wp-admin/css/ie.css | 38 ++--- src/wp-admin/css/wp-admin-rtl.css | 46 +----- src/wp-admin/css/wp-admin.css | 240 ++++++++---------------------- 4 files changed, 82 insertions(+), 250 deletions(-) diff --git a/src/wp-admin/about.php b/src/wp-admin/about.php index 129ec2a17a..96031a5af3 100644 --- a/src/wp-admin/about.php +++ b/src/wp-admin/about.php @@ -39,12 +39,14 @@ include( ABSPATH . 'wp-admin/admin-header.php' );

-
+

-
-
+
+ +
+

diff --git a/src/wp-admin/css/ie.css b/src/wp-admin/css/ie.css index 26279fb3e4..ef1979240b 100644 --- a/src/wp-admin/css/ie.css +++ b/src/wp-admin/css/ie.css @@ -486,20 +486,6 @@ table.ie-fixed { min-width: 400px; } -.about-wrap img.element-screenshot { - padding: 2px; -} - -.about-wrap .feature-section img, -.about-wrap .feature-section .image-mask { - border-width: 1px; - border-style: solid; -} - -.about-wrap .feature-section.three-col img { - margin-left: 0; -} - .available-theme { display: inline; } @@ -513,13 +499,17 @@ table.ie-fixed { margin-right: 7px; } -.about-wrap .three-col-images img { - margin: 0 0.6% 10px; +.about-wrap .three-col.about-updates .col-2 { + width: 15%; } -.about-wrap .three-col-images .last-feature, -.about-wrap .three-col-images .first-feature { - float: none; +.revisions-tickmarks, +.revisions-tooltip { + display: none !important; +} + +.revisions.pinned .revisions-controls { + position: relative; } /* IE6 leftovers */ @@ -626,13 +616,3 @@ table.ie-fixed { * html #adminmenu div.wp-menu-image { height: 29px; } - -.revisions-tickmarks, -.revisions-tooltip { - display: none !important; -} - -.revisions.pinned .revisions-controls { - position: relative; -} - diff --git a/src/wp-admin/css/wp-admin-rtl.css b/src/wp-admin/css/wp-admin-rtl.css index 2b9a518810..5221a0430d 100644 --- a/src/wp-admin/css/wp-admin-rtl.css +++ b/src/wp-admin/css/wp-admin-rtl.css @@ -1706,38 +1706,21 @@ h2 .nav-tab { float: right; } +.about-wrap .feature-section.two-col div, .about-wrap .feature-section.three-col div { margin-right: 0; margin-left: 4.999999999%; float: right; } -.about-wrap .feature-section.three-col h4 { - text-align: right; -} - -.about-wrap .feature-section.three-col img { - margin-right: 5px; +.about-wrap .feature-section.col .last-feature { margin-left: 0; } -.about-wrap .feature-section.three-col .last-feature { - margin-left: 0; -} - -.about-wrap .feature-section img { - margin: 0 0 10px 0.7%; -} - -.about-wrap .feature-section.images-stagger-right img, -.about-wrap .feature-section.images-stagger-right .video { +.about-wrap .feature-section div p img { float: left; - margin: 0 2em 12px 5px; -} - -.about-wrap .feature-section.images-stagger-left img { - float: right; - margin: 0 5px 12px 2em; + margin-left: 0; + margin-right: 10px; } .about-wrap li.wp-person, @@ -1747,25 +1730,6 @@ h2 .nav-tab { margin-left: 10px; } -@media only screen and (max-width: 900px) { - .about-wrap .feature-section.images-stagger-right .video.image-66 { - margin-right: 3px; - } -} - -@media only screen and (max-width: 768px) { - .about-wrap .feature-section .image-66 { - float: none; - } - - .about-wrap .feature-section.images-stagger-right .image-66 { - margin-right: 3px; - } - - .about-wrap .feature-section.images-stagger-left .image-66 { - margin-left: 3px; - } -} /*------------------------------------------------------------------------------ 23.0 - Misc diff --git a/src/wp-admin/css/wp-admin.css b/src/wp-admin/css/wp-admin.css index 2383438d27..3fb19db8c5 100644 --- a/src/wp-admin/css/wp-admin.css +++ b/src/wp-admin/css/wp-admin.css @@ -2312,7 +2312,7 @@ html.wp-toolbar { } .wp-core-ui .welcome-panel .button.button-hero { - margin: 15px 0 3px; + margin: 15px 0 3px; } .welcome-panel-content { @@ -2378,7 +2378,7 @@ html.wp-toolbar { } .welcome-panel .welcome-write-blog { - background-position: 0 -44px; + background-position: 0 -44px; } .welcome-panel .welcome-panel-column ul { @@ -2386,8 +2386,8 @@ html.wp-toolbar { } .welcome-panel .welcome-panel-column li { - line-height: 16px; - list-style-type: none; + line-height: 16px; + list-style-type: none; } @media screen and (max-width: 870px) { @@ -3162,7 +3162,7 @@ ul.category-tabs li, } .no-js .category-tabs li.hide-if-no-js { - display: none; + display: none; } .category-tabs a, @@ -5775,52 +5775,6 @@ h2 .nav-tab { -webkit-border-radius: 3px; } -.about-wrap .about-passwords { - margin: 20px 0; - padding: 1px 20px 10px; - background-color: #f9f9f9; -} - -.about-wrap .about-auto-update { - text-align: center; - background-color: #f9f9ef; - clear: both; - padding: 10px; -} - -.about-wrap .about-auto-update.cool { - background-color: #eff9ef; -} - -.about-wrap .about-password-meter input { - font-size: 250%; - width: 100%; - display: block; - width: 100%; - padding: 5px; -} - -.about-wrap .about-password-meter #pass-strength-result { - font-weight: normal !important; - display:block !important; - font-size: 150%; - width: 100%; - padding: 17px 0; - margin-bottom: 15px; -} - -.about-wrap .feature-section img { - border: 0; - background: transparent; - box-shadow: none; - -webkit-box-shadow: none; - max-width: 20%; -} - -.about-wrap .feature-section div p img { - float: right; - margin-left: 10px; -} /* Typography */ @@ -5855,8 +5809,8 @@ h2 .nav-tab { } .about-wrap h3 { - font-size: 24px; - margin-bottom: 1em; + font-size: 1.5em; + line-height: 1.5em; padding-top: 20px; } @@ -5864,8 +5818,6 @@ h2 .nav-tab { padding-bottom: 20px; } -.about-wrap .feature-section - .about-wrap .feature-section h4 { margin-bottom: 0.6em; } @@ -5931,79 +5883,18 @@ h2 .nav-tab { /* Changelog / Update screen */ -.about-wrap .feature-section img, -.about-wrap .feature-section .video { - border: none; - margin: 0 1.94% 10px 0; - -webkit-border-radius: 3px; - border-radius: 3px; -} - -.about-wrap .feature-section .video video { - max-width: 100%; -} - .about-wrap .feature-section.three-col img { margin: 0.5em 0 0.5em 5px; max-width: 100%; float: none; } -.ie8 .about-wrap .feature-section.three-col img { - margin-left: 0; -} - -.about-wrap .feature-section.images-stagger-right img, -.about-wrap .feature-section.images-stagger-right .video { - float: right; - margin: 0 5px 12px 2em; -} - -.about-wrap .feature-section.images-stagger-left img { - float: left; - margin: 0 2em 12px 5px; -} - -.about-wrap .feature-section .image-100 { - margin: 0 0 2em 0; - width: 100%; -} - -.about-wrap .feature-section .image-66 { - width: 65%; -} - -.about-wrap .feature-section .image-66.video { - max-width: 600px; -} - -.about-wrap .feature-section .image-50 { - max-width: 50%; -} - -.about-wrap .feature-section img.image-30 { - max-width: 31.2381%; -} - -.ie8 .about-wrap .feature-section img { - border-width: 1px; - border-style: solid; -} - -.about-wrap .images-stagger-right img.image-30:nth-child(2) { - margin-left: 1em; -} - .about-wrap .feature-section.col { margin-bottom: 0; } .about-wrap .feature-section.col h4 { - margin: 0 0 0.6em 0; -} - -.about-wrap .feature-section.col .last-feature { - margin-right: 0; + margin: 0 0 0.6em 0; } .about-wrap .feature-section.two-col div { @@ -6018,79 +5909,74 @@ h2 .nav-tab { float: left; } -.about-wrap .three-col.about-updates div:nth-of-type(1), -.about-wrap .three-col.about-updates div:nth-of-type(3) { +.about-wrap .three-col.about-updates .col-1, +.about-wrap .three-col.about-updates .col-3 { width: 37%; margin: 0; } -.about-wrap .three-col.about-updates div:nth-of-type(2) { +.about-wrap .three-col.about-updates .col-2 { width: 16%; margin: 0 5%; } +.about-wrap .feature-section.col .last-feature { + margin-right: 0; +} + .about-wrap .three-col.about-updates img { margin: 0; } -.about-wrap .three-col-images { - text-align: center; -} - -.about-wrap .three-col-images img { - margin: 0 0 10px; -} - -.about-wrap .three-col-images .last-feature { - float: right; -} - -.about-wrap .three-col-images .first-feature { - float: left; -} - .about-wrap .changelog .feature-section { overflow: hidden; } +.about-wrap .about-passwords { + margin: 20px 0; + padding: 1px 20px 10px; + background-color: #f9f9f9; +} + +.about-wrap .about-auto-update { + text-align: center; + background-color: #f9f9ef; + clear: both; + padding: 10px; +} + +.about-wrap .about-auto-update.cool { + background-color: #eff9ef; +} + +.about-wrap .about-password-meter input { + font-size: 250%; + line-height: 1; + width: 100%; + display: block; + width: 100%; + padding: 5px; +} + +.about-wrap .about-password-meter #pass-strength-result { + display: block !important; + font-size: 150%; + width: 100%; + padding: 17px 0; + margin-bottom: 15px; +} + +.about-wrap .feature-section div p img { + float: right; + margin-left: 10px; + max-width: 20%; +} + .about-wrap .changelog li { list-style-type: disc; margin-left: 3em; } -@media only screen and (max-width: 900px) { - .about-wrap .feature-section.images-stagger-left img, - .about-wrap .feature-section.images-stagger-right img, - .about-wrap .feature-section.images-stagger-right .video { - clear: both; - } - - .about-wrap .feature-section .video.image-66 { - float: none; - width: 98%; - max-width: 98%; - } - - .about-wrap .feature-section.images-stagger-right .video.image-66 { - margin-left: 3px; - } -} - -@media only screen and (max-width: 768px) { - .about-wrap .feature-section .image-66 { - float: none; - width: 98%; - max-width: 98%; - } - - .about-wrap .feature-section.images-stagger-right .image-66 { - margin-left: 3px; - } - - .about-wrap .feature-section.images-stagger-left .image-66 { - margin-right: 3px; - } -} /* Return to Dashboard Home link */ @@ -9368,20 +9254,20 @@ a.widget-control-edit { (min-resolution: 120dpi) { .press-this .tagchecklist span a { - background-image: url('../images/xit-2x.gif'); - background-size: 20px auto; + background-image: url('../images/xit-2x.gif'); + background-size: 20px auto; } .js .postbox:hover .handlediv, .js .stuffbox:hover .handlediv, .widget-top a.widget-action { - background-image: url('../images/arrows-2x.png'); - background-size: 15px 123px; + background-image: url('../images/arrows-2x.png'); + background-size: 15px 123px; } .widget-top a.widget-action:hover { - background-image: url('../images/arrows-dark-2x.png'); - background-size: 15px 123px; + background-image: url('../images/arrows-dark-2x.png'); + background-size: 15px 123px; } .post-com-count { @@ -9440,8 +9326,8 @@ a.widget-control-edit { } .wp-full-overlay .collapse-sidebar-arrow { - background-image: url('../images/arrows-2x.png'); - background-size: 15px 123px; + background-image: url('../images/arrows-2x.png'); + background-size: 15px 123px; } .pressthis a span {