From e19ee8d953854f51e71b87c7b8e48eaeee453701 Mon Sep 17 00:00:00 2001
From: zachleat <zachleatherman@gmail.com>
Date: Tue, 27 Dec 2011 16:29:53 -0600
Subject: [PATCH] Fix for browsers with JavaScript but without box-shadow
 enabled. outline: 0; outline-width: 2px; doesn't work, requires an
 outline-style to be set.

---
 css/themes/default/jquery.mobile.theme.css |  7 ++++---
 js/jquery.mobile.forms.slider.js           | 23 +++++++++++++---------
 2 files changed, 18 insertions(+), 12 deletions(-)

diff --git a/css/themes/default/jquery.mobile.theme.css b/css/themes/default/jquery.mobile.theme.css
index e4adb8ba..1a2a1ec9 100644
--- a/css/themes/default/jquery.mobile.theme.css
+++ b/css/themes/default/jquery.mobile.theme.css
@@ -1125,7 +1125,7 @@ a.ui-link-inherit {
 	box-shadow: 0px 1px 0 					rgba(255,255,255,.4);
 }
 
-/* Focus state - set here for specificity
+/* Focus state - set here for specificity (note: these classes are added by JavaScript)
 -----------------------------------------------------------------------------------------------------------*/
 
 .ui-btn:focus {
@@ -1151,5 +1151,6 @@ a.ui-link-inherit {
 /* ...and bring back focus */
 .ui-mobile-nosupport-boxshadow .ui-focus,
 .ui-mobile-nosupport-boxshadow .ui-btn:focus {
-	outline-width: 2px;
-}
+	outline-width: 1px;
+	outline-style: dotted;
+}
\ No newline at end of file
diff --git a/js/jquery.mobile.forms.slider.js b/js/jquery.mobile.forms.slider.js
index 9a720694..01ae704f 100644
--- a/js/jquery.mobile.forms.slider.js
+++ b/js/jquery.mobile.forms.slider.js
@@ -183,16 +183,21 @@ $.widget( "mobile.slider", $.mobile.widget, {
 
 		slider.insertAfter( control );
 
-		// NOTE force focus on handle
+		// Only add focus class to toggle switch, sliders get it automatically from ui-btn
+		if( cType == 'select' ) {
+			this.handle.bind({
+				focus: function() {
+					( $.support.boxShadow ? slider : $( this ) ).addClass( $.mobile.focusClass );
+				},
+
+				blur: function() {
+					( $.support.boxShadow ? slider : $( this ) ).removeClass( $.mobile.focusClass );
+				}
+			});
+		}
+
 		this.handle.bind({
-			focus: function() {
-				( cType == 'select' ? slider : $( this ) ).addClass( $.mobile.focusClass );
-			},
-
-			blur: function() {
-				( cType == 'select' ? slider : $( this ) ).removeClass( $.mobile.focusClass );
-			},
-
+			// NOTE force focus on handle
 			vmousedown: function() {
 				$( this ).focus();
 			},