From a9cd92a978151fd6237a463ade90898b53b64a14 Mon Sep 17 00:00:00 2001
From: scottjehl <scott@scottjehl.com>
Date: Wed, 11 Jan 2012 10:01:47 +0700
Subject: [PATCH] special case for dialogs - the theme class will apply to the
 page container when a dialog is shown, and that class will be removed when
 the dialog is hidden. This allows the transition to appear to affect only the
 inset window portion of the dialog page.

---
 css/structure/jquery.mobile.dialog.css           | 4 +++-
 css/structure/jquery.mobile.transitions.flow.css | 5 +++++
 js/jquery.mobile.dialog.js                       | 8 ++++++++
 3 files changed, 16 insertions(+), 1 deletion(-)

diff --git a/css/structure/jquery.mobile.dialog.css b/css/structure/jquery.mobile.dialog.css
index 8f27f44e..b80f68f1 100644
--- a/css/structure/jquery.mobile.dialog.css
+++ b/css/structure/jquery.mobile.dialog.css
@@ -1,5 +1,7 @@
 .ui-dialog { width: 92.5%; max-width: 500px; margin: 10% auto 15px auto; padding: 0; }
-
+.ui-dialog-page {
+	 background: none !important; /* this is to ensure that dialog theming does not apply (by default at least) on the page div */
+}
 .ui-dialog .ui-header {
 	margin-top: 15%;
 }
diff --git a/css/structure/jquery.mobile.transitions.flow.css b/css/structure/jquery.mobile.transitions.flow.css
index 641f4395..9a990527 100644
--- a/css/structure/jquery.mobile.transitions.flow.css
+++ b/css/structure/jquery.mobile.transitions.flow.css
@@ -5,6 +5,11 @@
 	-webkit-box-shadow: 0 0 20px rgba(0,0,0,.4);
 	-moz-box-shadow: 0 0 20px rgba(0,0,0,.4);
 }
+.ui-dialog-page.flow {
+	-moz-transform-origin: none;	
+	-webkit-box-shadow: none;
+	-moz-box-shadow: none;
+}
 .flow.out {
 	-webkit-transform: translateX(-100%) scale(.7);
 	-webkit-animation-name: flowouttoleft;
diff --git a/js/jquery.mobile.dialog.js b/js/jquery.mobile.dialog.js
index 27258850..23902b6a 100644
--- a/js/jquery.mobile.dialog.js
+++ b/js/jquery.mobile.dialog.js
@@ -62,6 +62,14 @@ $.widget( "mobile.dialog", $.mobile.widget, {
 		})
 		.bind( "pagehide", function() {
 			$( this ).find( "." + $.mobile.activeBtnClass ).removeClass( $.mobile.activeBtnClass );
+			if( self.options.overlayTheme ){
+				$.mobile.pageContainer.removeClass( "ui-body-" + self.options.overlayTheme );
+			}
+		})
+		.bind( "pagebeforeshow", function(){
+			if( self.options.overlayTheme ){
+				$.mobile.pageContainer.addClass( "ui-body-" + self.options.overlayTheme );
+			}
 		});
 	},