From 7e9203bcfe01060f655700081466e47b88c6974b Mon Sep 17 00:00:00 2001
From: toddparker <todd@filamentgroup.com>
Date: Wed, 4 Jan 2012 11:53:10 -0500
Subject: [PATCH] Re-org file, scoped all flip rules to the 3d supported class
 to avoid android seeing these

Cleaned up unsupported rules, added to top of file - needed both fade
in and out rules
---
 .../jquery.mobile.transitions.flip.css        | 109 ++++++++++--------
 1 file changed, 63 insertions(+), 46 deletions(-)

diff --git a/css/structure/jquery.mobile.transitions.flip.css b/css/structure/jquery.mobile.transitions.flip.css
index 5cdb6036..6f08802b 100644
--- a/css/structure/jquery.mobile.transitions.flip.css
+++ b/css/structure/jquery.mobile.transitions.flip.css
@@ -4,54 +4,9 @@
  * the viewer from the z-plane. According to the CSS3 spec, 1000 is a moderate
  * value.
  */
-.viewport-flip {
-	-webkit-perspective: 1000;
-	-moz-perspective: 1000;
-	position: absolute;
-}
 
-.flip {
-	-webkit-animation-duration: .65s;
-	-webkit-backface-visibility:hidden;
-	-webkit-transform:translateX(0); /* Needed to work around an iOS 3.1 bug that causes listview thumbs to disappear when -webkit-visibility:hidden is used. */
-	-moz-animation-duration: .65s;
-	-moz-backface-visibility:hidden;
-	-moz-transform:translateX(0); /* Needed to work around an iOS 3.1 bug that causes listview thumbs to disappear when -webkit-visibility:hidden is used. */
-}
 
-.flip.out {
-	-webkit-transform: rotateY(-180deg) scale(.8);
-	-webkit-animation-name: flipouttoleft;
-	-moz-transform: rotateY(-180deg) scale(.8);
-	-moz-animation-name: flipouttoleft;
-}
-
-.flip.in {
-	opacity: 1;
-	z-index: 10;
-	-webkit-animation-duration: 150ms;
-	-webkit-animation-name: fadein;
-	-moz-animation-duration: 150ms;
-	-moz-animation-name: fadein;
-}
-
-.flip.out.reverse {
-	-webkit-transform: rotateY(180deg) scale(.8);
-	-webkit-animation-name: flipouttoright;
-	-moz-transform: rotateY(180deg) scale(.8);
-	-moz-animation-name: flipouttoright;
-}
-
-.flip.in.reverse {
-	opacity: 1;
-	z-index: 10;
-	-webkit-animation-duration: 300ms;
-	-webkit-animation-name: fadein;
-	-moz-animation-duration: 300ms;
-	-moz-animation-name: fadein;
-}
-
-/* for non-3d supporting browsers, use fade */
+/* for non-3d supporting browsers, fallback to fade */
 .ui-unsupported-csstransform3d .flip.out,
 .ui-unsupported-csstransform3d .flip.out.reverse {
 	z-index: 0;
@@ -62,6 +17,68 @@
 	-moz-animation-name: fadeout;
 }
 
+.ui-unsupported-csstransform3d .flip.in,
+.ui-unsupported-csstransform3d .flip.in.reverse {
+	opacity: 1;
+	z-index: 10;
+	-webkit-animation-duration: 300ms;
+	-webkit-animation-name: fadein;
+	-moz-animation-duration: 300ms;
+	-moz-animation-name: fadein;
+}
+
+
+/* for 3d supporting browsers, use flip */
+
+.ui-supported-csstransform3d .viewport-flip {
+	-webkit-perspective: 1000;
+	-moz-perspective: 1000;
+	position: absolute;
+}
+
+.ui-supported-csstransform3d .flip {
+	-webkit-animation-duration: .65s;
+	-webkit-backface-visibility:hidden;
+	-webkit-transform:translateX(0); /* Needed to work around an iOS 3.1 bug that causes listview thumbs to disappear when -webkit-visibility:hidden is used. */
+	-moz-animation-duration: .65s;
+	-moz-backface-visibility:hidden;
+	-moz-transform:translateX(0); /* Needed to work around an iOS 3.1 bug that causes listview thumbs to disappear when -webkit-visibility:hidden is used. */
+}
+
+.ui-supported-csstransform3d .flip.out {
+	-webkit-transform: rotateY(-180deg) scale(.8);
+	-webkit-animation-name: flipouttoleft;
+	-moz-transform: rotateY(-180deg) scale(.8);
+	-moz-animation-name: flipouttoleft;
+}
+
+.ui-supported-csstransform3d .flip.in {
+	opacity: 1;
+	z-index: 10;
+	-webkit-animation-duration: 150ms;
+	-webkit-animation-name: fadein;
+	-moz-animation-duration: 150ms;
+	-moz-animation-name: fadein;
+}
+
+.ui-supported-csstransform3d .flip.out.reverse {
+	-webkit-transform: rotateY(180deg) scale(.8);
+	-webkit-animation-name: flipouttoright;
+	-moz-transform: rotateY(180deg) scale(.8);
+	-moz-animation-name: flipouttoright;
+}
+
+.ui-supported-csstransform3d .flip.in.reverse {
+	opacity: 1;
+	z-index: 10;
+	-webkit-animation-duration: 300ms;
+	-webkit-animation-name: fadein;
+	-moz-animation-duration: 300ms;
+	-moz-animation-name: fadein;
+}
+
+
+
 @-webkit-keyframes flipouttoleft {
     from { -webkit-transform: rotateY(0); }
     to { -webkit-transform: rotateY(-180deg); }