CHanged back button style on advanced popup examples

Author: toddparker

docs/pages/popup/popup-iframes.html

@@ -28,7 +28,7 @@ <h1>Popups with iframes</h1>
 	<div data-role="content" class="ui-body">
 		<div class="content-primary">
 
-			<p style="margin-bottom:-20px;"><a href="index.html">Popups &#8594;</a></p>
+			<a href="index.html" data-role="button" data-transition="fade" data-icon="arrow-l" data-inline="true">Back to Popups</a>
 			<h2>Working with iframes in popups</h2>
 
 			<p>You may need to embed an iframe into a popup to use a 3rd party widget. Here, we'll walk through a few real-world examples of working with iframes: videos and maps.</p>

docs/pages/popup/popup-images.html

@@ -28,7 +28,7 @@ <h1>Popup images</h1>
 	<div data-role="content" class="ui-body">
 		<div class="content-primary">
 
-			<p style="margin-bottom:-20px;"><a href="index.html">Popups &#8594;</a></p>
+			<a href="index.html" data-role="button" data-transition="fade" data-icon="arrow-l" data-inline="true">Back to Popups</a>
 			<h2>Scaling images: Lightbox examples</h2>
 
 			<p>The framework CSS contains rules that make images that are immediate children of the popup scale to fit the screen. Because of the absolute positioning of the popup container and screen, the height is not adjusted to screen height on all browsers. You can prevent vertical scrolling with a simple script that sets the <code>max-height</code> of the image.</p>

docs/pages/popup/popup-panels.html

@@ -28,7 +28,7 @@ <h1>Popup panels</h1>
 	<div data-role="content" class="ui-body">
 		<div class="content-primary">
 
-			<p style="margin-bottom:-20px;"><a href="index.html">Popups &#8594;</a></p>
+			<a href="index.html" data-role="button" data-transition="fade" data-icon="arrow-l" data-inline="true">Back to Popups</a>
 			<h2>Overlay panels</h2>
 
 			<p>Taking customization further, here is an example of a popup that has been customized to look like a vertical panel with three mini buttons:</p>