diff options
Diffstat (limited to 'plugins/jetpack/_inc/jetpack.css')
| -rw-r--r-- | plugins/jetpack/_inc/jetpack.css | 187 |
1 files changed, 165 insertions, 22 deletions
diff --git a/plugins/jetpack/_inc/jetpack.css b/plugins/jetpack/_inc/jetpack.css index 5e3a83d0..0b6c340e 100644 --- a/plugins/jetpack/_inc/jetpack.css +++ b/plugins/jetpack/_inc/jetpack.css @@ -9,14 +9,14 @@ #jp-header #jp-clouds { position: relative; - background: transparent url( images/header-clouds-20110719.png ) -400px 100% repeat-x; + background: transparent url( images/header-clouds.png ) -315px 100% repeat-x; padding-top: 110px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; } #jp-header.small #jp-clouds { - background: transparent url( images/header-clouds-sm-20110719.png ) -220px 100% repeat-x; + background: transparent url( images/header-clouds-small.png ) -120px 100% repeat-x; padding: 50px 0 0 0; height: 70px; } @@ -30,7 +30,7 @@ } #jp-header #jp-clouds #jp-disconnect a { - background: #8caa46 url( images/status-light.png ) 4px 90% no-repeat; + background: #8caa46 url( images/status-light.png ) 3px 85% no-repeat; display: inline-block; padding: 4px 10px 3px 30px; color: #fff; @@ -46,13 +46,35 @@ text-shadow: 0px -1px 0px rgba( 0,0,0,0.3 ); } #jp-header #jp-clouds #jp-disconnect a:hover { - background: #8caa46 url( images/status-light.png ) 4px 3% no-repeat; + background: #8caa46 url( images/status-light.png ) 3px 5% no-repeat; background-color: #839f40; border-color: #6a8037; } #jp-header #jp-clouds #jp-disconnect span { display: none; } - + + /* Retina Header Clouds & Status Light */ + @media only screen and (-moz-min-device-pixel-ratio: 1.5), only screen and (-o-min-device-pixel-ratio: 3/2), only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5) { + #jp-header #jp-clouds { + background: transparent url( images/header-clouds-2x.png ) -315px 100% repeat-x; + background-size:1600px 400px; + } + #jp-header.small #jp-clouds { + background: transparent url( images/header-clouds-small-2x.png ) -120px 100% repeat-x; + background-size:980px 140px; + } + + #jp-header #jp-clouds #jp-disconnect a { + background: #8caa46 url( images/status-light-2x.png ) 3px 85% no-repeat; + background-size:25px 57px; + } + #jp-header #jp-clouds #jp-disconnect a:hover { + background: #8caa46 url( images/status-light-2x.png ) 3px 5% no-repeat; + background-size:25px 57px; + } + } + + #jp-header h3 { position: relative; background: transparent url( images/logo.png ) top left no-repeat; @@ -71,7 +93,21 @@ height: 120px; top: -35px; } - + + /* Retina Logo */ + @media only screen and (-moz-min-device-pixel-ratio: 1.5), only screen and (-o-min-device-pixel-ratio: 3/2), only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5) { + #jp-header h3 { + background: transparent url( images/logo-2x.png ) top left no-repeat; + background-size:250px 200px; + } + #jp-header.small h3 { + background: transparent url( images/logo-small-2x.png ) top left no-repeat; + background-size:150px 120px; + } + } + + + #jp-header p { position: absolute; left: 390px; @@ -150,7 +186,7 @@ -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; - background: url( images/cloudybox-back.png ) 100% 100% no-repeat; + background: url( images/alertbox-clouds.png ) 100% 100% no-repeat; background-color: #6aafcf !important; -webkit-box-shadow: inset 0 0 15px rgba( 0,0,0,0.04 ); -moz-box-shadow: inset 0 0 15px rgba( 0,0,0,0.04 ); @@ -159,6 +195,15 @@ overflow: hidden; line-height: 180%; } + +/* Retina alertbox clouds */ +@media only screen and (-moz-min-device-pixel-ratio: 1.5), only screen and (-o-min-device-pixel-ratio: 3/2), only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5) { + .jetpack-message { + background: url( images/alertbox-clouds-2x.png ) 100% 100% no-repeat; + background-size:95px 55px; + } +} + .jp-connect { padding: 10px 0 5px !important; } #jetpack-settings > .jetpack-message { margin: 10px 13px 10px 15px } @@ -256,7 +301,7 @@ clear: both; overflow: visible !important; color: #666 !important; - background: transparent url( images/module-clouds-sm.png ) bottom left repeat-x; + background: transparent url( images/module-clouds.png ) bottom left repeat-x; background-color: #f0f0f0 !important; border-color: #dcdcdc !important; text-shadow: 0px 1px 0px #fff; @@ -264,6 +309,16 @@ -moz-box-shadow: inset 0 0 20px rgba(0,0,0,0.05), 0 1px 2px rgba( 0,0,0,0.1 ); box-shadow: inset 0 0 20px rgba(0,0,0,0.05), 0 1px 2px rgba( 0,0,0,0.1 ); } + + /* Retina moreinfo bg clouds */ + @media only screen and (-moz-min-device-pixel-ratio: 1.5), only screen and (-o-min-device-pixel-ratio: 3/2), only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5) { + .more-info { + background: transparent url( images/module-clouds-2x.png ) bottom left repeat-x; + background-size:980px 140px; + } + } + + .more-info h4 { padding: 0; background: none; @@ -283,7 +338,15 @@ height: 18px; top: -16px; left: 0; - background: url( images/arrow.gif ) top left no-repeat; + background: url( images/arrow.png ) top left no-repeat; + } + + /* Retina module more info arrow */ + @media only screen and (-moz-min-device-pixel-ratio: 1.5), only screen and (-o-min-device-pixel-ratio: 3/2), only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5) { + .more-info .arrow { + background: url( images/arrow-2x.png ) top left no-repeat; + background-size:29px 16px; + } } .more-info p { @@ -460,17 +523,68 @@ p.jp-help { .jetpack-module div.module-image { float: right; margin: 0 0 5px 10px; + padding: 60px 0 0; background: #cbe0a1; - width: 84px; - -webkit-border-top-left-radius: 2px; - -moz-border-radius-topleft: 2px; - border-top-left-radius: 2px; - -webkit-border-bottom-left-radius: 2px; - -moz-border-radius-bottomleft: 2px; - border-bottom-left-radius: 2px; + width: 80px; + -webkit-border-top-left-radius: 3px; + -moz-border-radius-topleft: 3px; + border-top-left-radius: 3px; + -webkit-border-bottom-left-radius: 3px; + -moz-border-radius-bottomleft: 3px; + border-bottom-left-radius: 3px; + background-repeat: no-repeat; + background-image: url( images/module-icons-sprite.png ); } - .jetpack-module div.module-image img { - padding: 6px; + + + @media only screen and (-moz-min-device-pixel-ratio: 1.5), only screen and (-o-min-device-pixel-ratio: 3/2), only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5) { + .jetpack-module div.module-image { + background-image: url( images/module-icons-sprite-2x.png ); + background-size: 1450px 50px; + } + } + + #stats.jetpack-module div.module-image { + background-position: -510px 5px; + } + #comments.jetpack-module div.module-image { + background-position: -1210px 5px; + } + #subscriptions.jetpack-module div.module-image { + background-position: -1009px 5px; + } + #sharedaddy.jetpack-module div.module-image { + background-position: -710px 5px; + } + #after-the-deadline.jetpack-module div.module-image { + background-position: -308px 5px; + } + #vaultpress.jetpack-module div.module-image { + background-position: -910px 5px; + } + #gravatar-hovercards.jetpack-module div.module-image { + background-position: -410px 5px; + } + #contact-form.jetpack-module div.module-image { + background-position: -1107px 5px; + } + #shortlinks.jetpack-module div.module-image { + background-position: -108px 5px; + } + #shortcodes.jetpack-module div.module-image { + background-position: -608px 5px; + } + #latex.jetpack-module div.module-image { + background-position: -208px 5px; + } + #widgets.jetpack-module div.module-image { + background-position: -5px 5px; + } + #enhanced-distribution.jetpack-module div.module-image { + background-position: -808px 5px; + } + #carousel.jetpack-module div.module-image { + background-position: -1325px 5px; } .jetpack-module div.module-image p { @@ -606,11 +720,18 @@ p.jp-help { color: #dadada; margin-top: 55px; text-align: center; - background: transparent url(images/comingsoon.png) top center no-repeat; + background: transparent url(images/icon-comingsoon.png) top center no-repeat; padding: 40px 0 0 0; margin-right: 15px; box-shadow: none; } + + @media only screen and (-moz-min-device-pixel-ratio: 1.5), only screen and (-o-min-device-pixel-ratio: 3/2), only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5) { + .placeholder h3 { + background: transparent url(images/icon-comingsoon-2x.png) top center no-repeat; + background-size:32px 32px; + } + } #jp-settings-screen { margin: 0 25px; @@ -628,12 +749,20 @@ p#news-sub { } #jp-footer { - background: url( images/footer-clouds-20110719.png ) top center no-repeat; + background: url( images/footer-clouds.png ) top center no-repeat; margin: 30px 0; padding-top: 60px; text-align: center; } +@media only screen and (-moz-min-device-pixel-ratio: 1.5), only screen and (-o-min-device-pixel-ratio: 3/2), only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5) { + #jp-footer { + background: url( images/footer-clouds-2x.png ) top center no-repeat; + background-size:700px 150px; + } +} + + #jp-footer .automattic { color: #999; font-size: 10px; @@ -657,6 +786,12 @@ p#news-sub { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)"; opacity: 0.5; } + @media only screen and (-moz-min-device-pixel-ratio: 1.5), only screen and (-o-min-device-pixel-ratio: 3/2), only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5) { + #jp-footer .automattic span { + background: url( images/automattic-2x.png ) center top no-repeat; + background-size:165px 14px; + } + } #jp-footer p.small { font-size: 11px; @@ -866,7 +1001,7 @@ p#news-sub { width: 16px; height: 16px; text-indent: -9999px; - background: transparent url( images/jetpack-closebox-icon.png ) no-repeat center center; + background: transparent url( images/alertbox-closeicon.png ) no-repeat center center; border: 0 none; -moz-border-radius: 0 0 0 5px; -webkit-border-radius: 0 0 0 5px; @@ -884,6 +1019,13 @@ p#news-sub { cursor: pointer; } +@media only screen and (-moz-min-device-pixel-ratio: 1.5), only screen and (-o-min-device-pixel-ratio: 3/2), only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5) { + .jetpack-close-button { + background: transparent url( images/alertbox-closeicon-2x.png ) no-repeat center center; + background-size:16px 16px; + } +} + .jetpack-close-button:hover { background-color: #fff; border: 0 none; @@ -931,7 +1073,7 @@ p#news-sub { -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; - line-height: 100%; + line-height: 1.3; color: #fff; text-align: center; font-size: 16px; @@ -952,3 +1094,4 @@ p#news-sub { -webkit-box-shadow: inset 0 0 2px #fff, 0 1px 7px rgba(240,160,0,0.5); box-shadow: inset 0 0 2px #fff, 0 1px 7spx rgba(240,160,0,0.5); } + |