Login background for retina

reybango · Mar 5, 2013 · 0a79c6e · 0a79c6e
1 parent b486f75
commit 0a79c6e
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 0 deletions.
diff --git a/css/flat-ui.css b/css/flat-ui.css
@@ -2297,6 +2297,7 @@ body.vjs-full-window {
 
 .login {
   background: url("../images/login/imac.png") 0 0 no-repeat;
+  background-size: 940px 778px;
   color: white;
   margin-bottom: 77px;
   padding: 38px 38px 267px;
@@ -2374,6 +2375,9 @@ body.vjs-full-window {
   margin-top: 15px;
   text-align: center; }
 
+@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (-moz-min-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 3 / 2), only screen and (-o-min-device-pixel-ratio: 2 / 1), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 2) {
+  .login {
+    background-image: url("../images/login/imac-2x.png"); } }
 .ptn, .pvn, .pan {
   padding-top: 0; }
 

diff --git a/images/login/imac-2x.png b/images/login/imac-2x.png
diff --git a/sass/modules/_login.sass b/sass/modules/_login.sass
@@ -3,6 +3,7 @@ $form-color: scale-color(desaturate($base, 15%), $lightness: 91%)
 // Login screen
 .login
   background: url('../images/login/imac.png') 0 0 no-repeat
+  background-size: 940px 778px
   color: $inverse
   margin-bottom: 77px
   padding: 38px 38px 267px
@@ -87,3 +88,8 @@ $form-color: scale-color(desaturate($base, 15%), $lightness: 91%)
   margin-top: 15px
   text-align: center
 
+// Serving 2x images
+@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (-moz-min-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 3/2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 2)
+  .login
+    background-image: url('../images/login/imac-2x.png')
+