From 7251d58a4043364cc014f0361bc50c1ac663293c Mon Sep 17 00:00:00 2001
From: Erik Montes <zomberik@gmail.com>
Date: Thu, 5 Nov 2015 10:15:38 -0800
Subject: [PATCH] set demo pages form to GET to show submitted values when
 testing

- also added some more cases to test on
- minor styling
---
 index.html     | 18 ++++++++++--------
 simulated.html | 18 ++++++++++--------
 2 files changed, 20 insertions(+), 16 deletions(-)

diff --git a/index.html b/index.html
index a0bffed..abfab8e 100644
--- a/index.html
+++ b/index.html
@@ -6,6 +6,8 @@
 		<style>
 			body { font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; }
 			input, textarea { font-size: 1em; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;}
+			input { width: 250px; }
+			input[type="radio"], input[type="checkbox"] { width: auto }
 			label code { display: inline-block; width: 200px; }
 			textarea { height: 2em; width: 20em;, font-family: sans-serif; }
 			.my-placeholder { color: #aaa; }
@@ -18,14 +20,14 @@ <h1>HTML5 Placeholder jQuery Plugin</h1>
 
 		<a href="/mathiasbynens/jquery-placeholder"><img style="position: absolute; top: 0; right: 0; border: 0;" src="https://camo.githubusercontent.com/38ef81f8aca64bb9a64448d0d70f1308ef5341ab/68747470733a2f2f73332e616d617a6f6e6177732e636f6d2f6769746875622f726962626f6e732f666f726b6d655f72696768745f6461726b626c75655f3132313632312e706e67" alt="Fork me on GitHub" data-canonical-src="https://s3.amazonaws.com/github/ribbons/forkme_right_darkblue_121621.png"></a>
 
-		<form>
-			<input type="radio" name="color" placeholder="This can't be seen"> Red
-			<input type="radio" name="color" placeholder="This can't be seen"> Green
+		<form method="GET" action="">
+			<input type="radio" name="color" value="red" placeholder="This can't be seen"> Red
+			<input type="radio" name="color" value="green" placeholder="This can't be seen"> Green
 
 			<br />
 
-			<input type="checkbox" name="fruits" placeholder="This can't be seen"> Apple
-			<input type="checkbox" name="fruits" placeholder="This can't be seen"> Banana
+			<input type="checkbox" name="fruits" value="apple" placeholder="This can't be seen"> Apple
+			<input type="checkbox" name="fruits" value="banana" placeholder="This can't be seen"> Banana
 
 			<br />
 	
@@ -43,12 +45,12 @@ <h1>HTML5 Placeholder jQuery Plugin</h1>
 			<br />
 			<br />
 
-			<input type="email" name="email" placeholder="type=email">
+			<input type="email" name="email" placeholder="type=email" value="prefilled@example.com">
 
 			<br />
 			<br />
 			
-			<input type="url" name="url" placeholder="type=url">
+			<input type="url" name="url" placeholder="type=url" value="http://prefilled.example.com">
 
 			<br />
 			<br />
@@ -80,7 +82,7 @@ <h1>HTML5 Placeholder jQuery Plugin</h1>
 			<br />
 			<br />
 			
-			<label for="p">Click me to focus password field up above</label>
+			<label for="p">A Label: Click me to focus password field up above</label>
 
 			<br />
 			<br />
diff --git a/simulated.html b/simulated.html
index 365ec77..6c58837 100644
--- a/simulated.html
+++ b/simulated.html
@@ -6,6 +6,8 @@
 		<style>
 			body { font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; }
 			input, textarea { font-size: 1em; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; }
+			input { width: 250px; }
+			input[type="radio"], input[type="checkbox"] { width: auto }
 			label code { display: inline-block; width: 200px; }
 			textarea { height: 2em; width: 20em;, font-family: sans-serif; }
 			.my-placeholder { color: #aaa; }
@@ -18,14 +20,14 @@ <h1>HTML5 Placeholder jQuery Plugin</h1>
 
 		<a href="/mathiasbynens/jquery-placeholder"><img style="position: absolute; top: 0; right: 0; border: 0;" src="https://camo.githubusercontent.com/38ef81f8aca64bb9a64448d0d70f1308ef5341ab/68747470733a2f2f73332e616d617a6f6e6177732e636f6d2f6769746875622f726962626f6e732f666f726b6d655f72696768745f6461726b626c75655f3132313632312e706e67" alt="Fork me on GitHub" data-canonical-src="https://s3.amazonaws.com/github/ribbons/forkme_right_darkblue_121621.png"></a>
 
-		<form>
-			<input type="radio" name="color" placeholder-x="This can't be seen"> Red
-			<input type="radio" name="color" placeholder-x="This can't be seen"> Green
+		<form method="GET" action="">
+			<input type="radio" name="color" value="red" placeholder-x="This can't be seen"> Red
+			<input type="radio" name="color" value="green" placeholder-x="This can't be seen"> Green
 
 			<br />
 
-			<input type="checkbox" name="fruits" placeholder-x="This can't be seen"> Apple
-			<input type="checkbox" name="fruits" placeholder-x="This can't be seen"> Banana
+			<input type="checkbox" name="fruits" value="apple" placeholder-x="This can't be seen"> Apple
+			<input type="checkbox" name="fruits" value="banana" placeholder-x="This can't be seen"> Banana
 
 			<br />
 	
@@ -43,12 +45,12 @@ <h1>HTML5 Placeholder jQuery Plugin</h1>
 			<br />
 			<br />
 
-			<input type="email" name="email" placeholder-x="type=email">
+			<input type="email" name="email" placeholder-x="type=email" value="prefilled@example.com">
 
 			<br />
 			<br />
 			
-			<input type="url" name="url" placeholder-x="type=url">
+			<input type="url" name="url" placeholder-x="type=url" value="http://prefilled.example.com">
 
 			<br />
 			<br />
@@ -80,7 +82,7 @@ <h1>HTML5 Placeholder jQuery Plugin</h1>
 			<br />
 			<br />
 			
-			<label for="p">Click me to focus password field up above</label>
+			<label for="p">A Label: Click me to focus password field up above</label>
 
 			<br />
 			<br />