From 61d9e9b9094f37959fce80039536a9cf03ef468e Mon Sep 17 00:00:00 2001
From: "Yann Esposito (Yogsototh)" <Yann.Esposito@gmail.com>
Date: Wed, 10 Aug 2011 00:15:22 +0200
Subject: [PATCH] Far better form.

---
 content/html/en/support.md         | 21 ++++++++++++++++++---
 content/html/fr/support.md         | 21 ++++++++++++++++++---
 multi/support.md                   | 21 ++++++++++++++++++---
 site/Scratch/en/blog/feed/feed.xml |  4 ++++
 site/Scratch/en/support/index.html | 22 ++++++++++++++++++----
 site/Scratch/fr/blog/feed/feed.xml |  4 ++++
 site/Scratch/fr/support/index.html | 22 ++++++++++++++++++----
 site/Scratch/sitemap.xml           | 24 ++++++++++++------------
 site/css/main.css                  | 30 ++++++++++++++++++------------
 site/src/main.sass                 | 14 +++++++++++---
 10 files changed, 139 insertions(+), 44 deletions(-)

diff --git a/content/html/en/support.md b/content/html/en/support.md
index 5d1f619..8788fbe 100644
--- a/content/html/en/support.md
+++ b/content/html/en/support.md
@@ -5,13 +5,28 @@ no_entete: true
 menupriority: 4
 ---
 <% content_for :bodyclass do %>std support<% end %>
+<% content_for :js do %>
+    <script>
+        $.fn.clearOnFocus = function() {
+            return this.focus(function(){
+                var v = $(this).val();
+                $(this).val( v === this.defaultValue ? '' : v );
+            }).blur(function(){
+                var v = $(this).val();
+                $(this).val( v.match(/^\s*$/) ? this.defaultValue : v );
+            });
+        };
+        $('input[type=text]').clearOnFocus();
+        $('textarea').clearOnFocus();
+    </script>
+<% end %>
 
 ## A problem? A remark? 
 
 <form name="email" id="email" action="/contact" method="post">
-<input type="text" name="name" value="Your name" onfocus="this.value=''" style="display: block;width=20em"/>
-<input type="text" name="mail" value="Your email"  onfocus="this.value=''" style="display: block; width=20em"/>
-<textarea name="body" id="bodytextarea" value=""  onfocus="this.value=''" style="display: block; height: 10em; width: 30em;">Enter your comment here</textarea>
+<input type="text" name="name" value="Your Name"/>
+<input type="text" name="mail" value="Your email"/>
+<textarea name="body" id="bodytextarea" value="">Enter your comment here</textarea>
 <input type="submit" value="Send"/>
 </form>
 
diff --git a/content/html/fr/support.md b/content/html/fr/support.md
index 596ca85..058d428 100644
--- a/content/html/fr/support.md
+++ b/content/html/fr/support.md
@@ -5,13 +5,28 @@ no_entete: true
 menupriority: 4
 ---
 <% content_for :bodyclass do %>std support<% end %>
+<% content_for :js do %>
+    <script>
+        $.fn.clearOnFocus = function() {
+            return this.focus(function(){
+                var v = $(this).val();
+                $(this).val( v === this.defaultValue ? '' : v );
+            }).blur(function(){
+                var v = $(this).val();
+                $(this).val( v.match(/^\s*$/) ? this.defaultValue : v );
+            });
+        };
+        $('input[type=text]').clearOnFocus();
+        $('textarea').clearOnFocus();
+    </script>
+<% end %>
 
 ## A problem? A remark? 
 
 <form name="email" id="email" action="/contact" method="post">
-<input type="text" name="name" value="Your name" onfocus="this.value=''" style="display: block;width=20em"/>
-<input type="text" name="mail" value="Your email"  onfocus="this.value=''" style="display: block; width=20em"/>
-<textarea name="body" id="bodytextarea" value=""  onfocus="this.value=''" style="display: block; height: 10em; width: 30em;">Enter your comment here</textarea>
+<input type="text" name="name" value="Your Name"/>
+<input type="text" name="mail" value="Your email"/>
+<textarea name="body" id="bodytextarea" value="">Enter your comment here</textarea>
 <input type="submit" value="Send"/>
 </form>
 
diff --git a/multi/support.md b/multi/support.md
index 9b67294..c6a51a2 100644
--- a/multi/support.md
+++ b/multi/support.md
@@ -6,13 +6,28 @@ no_entete: true
 menupriority: 4
 ---
 <% content_for :bodyclass do %>std support<% end %>
+<% content_for :js do %>
+    <script>
+        $.fn.clearOnFocus = function() {
+            return this.focus(function(){
+                var v = $(this).val();
+                $(this).val( v === this.defaultValue ? '' : v );
+            }).blur(function(){
+                var v = $(this).val();
+                $(this).val( v.match(/^\s*$/) ? this.defaultValue : v );
+            });
+        };
+        $('input[type=text]').clearOnFocus();
+        $('textarea').clearOnFocus();
+    </script>
+<% end %>
 
 ## A problem? A remark? 
 
 <form name="email" id="email" action="/contact" method="post">
-<input type="text" name="name" value="Your name" onfocus="this.value=''" style="display: block;width=20em"/>
-<input type="text" name="mail" value="Your email"  onfocus="this.value=''" style="display: block; width=20em"/>
-<textarea name="body" id="bodytextarea" value=""  onfocus="this.value=''" style="display: block; height: 10em; width: 30em;">Enter your comment here</textarea>
+<input type="text" name="name" value="Your Name"/>
+<input type="text" name="mail" value="Your email"/>
+<textarea name="body" id="bodytextarea" value="">Enter your comment here</textarea>
 <input type="submit" value="Send"/>
 </form>
 
diff --git a/site/Scratch/en/blog/feed/feed.xml b/site/Scratch/en/blog/feed/feed.xml
index 3d6b2f9..f21194f 100644
--- a/site/Scratch/en/blog/feed/feed.xml
+++ b/site/Scratch/en/blog/feed/feed.xml
@@ -14,6 +14,10 @@
     <title type="html">Screenshots</title>
     <published>2011-05-05T09:27:11Z</published>
     <updated>2011-05-05T09:27:11Z</updated>
+    <author>
+      <name>Yann Esposito</name>
+      <uri>yannesposito.com</uri>
+    </author>
     <link href="http://ypassword.espozito.com/Scratch/en/blog/2011-05-05-Screenshots/" rel="alternate"/>
     <content type="html">
 &lt;div class="intro"&gt;
diff --git a/site/Scratch/en/support/index.html b/site/Scratch/en/support/index.html
index 1753805..0bf79a1 100644
--- a/site/Scratch/en/support/index.html
+++ b/site/Scratch/en/support/index.html
@@ -58,9 +58,9 @@
 <h2 class="first" id="a-problem-a-remark">A problem? A remark?</h2>
 
 <form name="email" id="email" action="/contact" method="post">
-<input type="text" name="name" value="Your name" onfocus="this.value=<code>" style="display: block;width=20em" />
-<input type="text" name="mail" value="Your email" onfocus="this.value=</code>" style="display: block; width=20em" />
-<textarea name="body" id="bodytextarea" value="" onfocus="this.value=''" style="display: block; height: 10em; width: 30em;">Enter your comment here</textarea>
+<input type="text" name="name" value="Your Name" />
+<input type="text" name="mail" value="Your email" />
+<textarea name="body" id="bodytextarea" value="">Enter your comment here</textarea>
 <input type="submit" value="Send" />
 </form>
 
@@ -76,7 +76,7 @@
             </div>
             <footer>
                 <ul class="article_metadata">
-                    <li>Modified: <time>07/12/2011</time></li>
+                    <li>Modified: <time>08/08/2011</time></li>
                 </ul>
             </footer>
         </article>
@@ -106,6 +106,20 @@
   <script src="/js/plugins.js"></script>
   <script src="/js/script.js"></script>
   
+    <script>
+        $.fn.clearOnFocus = function() {
+            return this.focus(function(){
+                var v = $(this).val();
+                $(this).val( v === this.defaultValue ? '' : v );
+            }).blur(function(){
+                var v = $(this).val();
+                $(this).val( v.match(/^\s*$/) ? this.defaultValue : v );
+            });
+        };
+        $('input[type=text]').clearOnFocus();
+        $('textarea').clearOnFocus();
+    </script>
+
   <!-- end scripts-->
   <!--[if lt IE 7 ]>
     <script src="/js/libs/dd_belatedpng.js"></script>
diff --git a/site/Scratch/fr/blog/feed/feed.xml b/site/Scratch/fr/blog/feed/feed.xml
index 3c53f96..d0b9463 100644
--- a/site/Scratch/fr/blog/feed/feed.xml
+++ b/site/Scratch/fr/blog/feed/feed.xml
@@ -14,6 +14,10 @@
     <title type="html">Captures d'&#233;cran</title>
     <published>2011-05-05T09:27:11Z</published>
     <updated>2011-05-05T09:27:11Z</updated>
+    <author>
+      <name>Yann Esposito</name>
+      <uri>yannesposito.com</uri>
+    </author>
     <link href="http://ypassword.espozito.com/Scratch/fr/blog/2011-05-05-Screenshots/" rel="alternate"/>
     <content type="html">
 &lt;div class="intro"&gt;
diff --git a/site/Scratch/fr/support/index.html b/site/Scratch/fr/support/index.html
index 7ddcae5..87e0951 100644
--- a/site/Scratch/fr/support/index.html
+++ b/site/Scratch/fr/support/index.html
@@ -58,9 +58,9 @@
 <h2 class="first" id="a-problem-a-remark">A problem? A remark?</h2>
 
 <form name="email" id="email" action="/contact" method="post">
-<input type="text" name="name" value="Your name" onfocus="this.value=<code>" style="display: block;width=20em" />
-<input type="text" name="mail" value="Your email" onfocus="this.value=</code>" style="display: block; width=20em" />
-<textarea name="body" id="bodytextarea" value="" onfocus="this.value=''" style="display: block; height: 10em; width: 30em;">Enter your comment here</textarea>
+<input type="text" name="name" value="Your Name" />
+<input type="text" name="mail" value="Your email" />
+<textarea name="body" id="bodytextarea" value="">Enter your comment here</textarea>
 <input type="submit" value="Send" />
 </form>
 
@@ -76,7 +76,7 @@
             </div>
             <footer>
                 <ul class="article_metadata">
-                    <li>modifié le : <time>12/07/2011</time></li>
+                    <li>modifié le : <time>08/08/2011</time></li>
                 </ul>
             </footer>
         </article>
@@ -106,6 +106,20 @@
   <script src="/js/plugins.js"></script>
   <script src="/js/script.js"></script>
   
+    <script>
+        $.fn.clearOnFocus = function() {
+            return this.focus(function(){
+                var v = $(this).val();
+                $(this).val( v === this.defaultValue ? '' : v );
+            }).blur(function(){
+                var v = $(this).val();
+                $(this).val( v.match(/^\s*$/) ? this.defaultValue : v );
+            });
+        };
+        $('input[type=text]').clearOnFocus();
+        $('textarea').clearOnFocus();
+    </script>
+
   <!-- end scripts-->
   <!--[if lt IE 7 ]>
     <script src="/js/libs/dd_belatedpng.js"></script>
diff --git a/site/Scratch/sitemap.xml b/site/Scratch/sitemap.xml
index f45cced..4921803 100644
--- a/site/Scratch/sitemap.xml
+++ b/site/Scratch/sitemap.xml
@@ -1,36 +1,36 @@
 <?xml version="1.0" encoding="UTF-8"?>
-<urlset xmlns="http://www.google.com/schemas/sitemap/0.84">
+<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
   <url>
     <loc>http://ypassword.espozito.com/Scratch/fr/blog/2011-05-05-Screenshots/</loc>
     <lastmod>2011-07-12</lastmod>
   </url>
   <url>
     <loc>http://ypassword.espozito.com/Scratch/en/getit/</loc>
-    <lastmod>2011-08-08</lastmod>
+    <lastmod>2011-07-24</lastmod>
   </url>
   <url>
     <loc>http://ypassword.espozito.com/Scratch/fr/blog/</loc>
-    <lastmod>2011-08-08</lastmod>
+    <lastmod>2011-07-27</lastmod>
   </url>
   <url>
     <loc>http://ypassword.espozito.com/Scratch/fr/getit/</loc>
-    <lastmod>2011-08-08</lastmod>
+    <lastmod>2011-07-24</lastmod>
   </url>
   <url>
     <loc>http://ypassword.espozito.com/Scratch/en/support/</loc>
-    <lastmod>2011-08-08</lastmod>
+    <lastmod>2011-08-09</lastmod>
   </url>
   <url>
     <loc>http://ypassword.espozito.com/Scratch/en/blog/feed/feed.xml</loc>
-    <lastmod>2011-05-04</lastmod>
+    <lastmod>2011-05-02</lastmod>
   </url>
   <url>
     <loc>http://ypassword.espozito.com/Scratch/fr/support/</loc>
-    <lastmod>2011-08-08</lastmod>
+    <lastmod>2011-08-09</lastmod>
   </url>
   <url>
     <loc>http://ypassword.espozito.com/Scratch/en/</loc>
-    <lastmod>2011-08-08</lastmod>
+    <lastmod>2011-07-27</lastmod>
   </url>
   <url>
     <loc>http://ypassword.espozito.com/Scratch/en/blog/2011-05-05-Screenshots/</loc>
@@ -38,18 +38,18 @@
   </url>
   <url>
     <loc>http://ypassword.espozito.com/Scratch/sitemap.xml</loc>
-    <lastmod>2011-05-04</lastmod>
+    <lastmod>2011-05-02</lastmod>
   </url>
   <url>
     <loc>http://ypassword.espozito.com/Scratch/fr/blog/feed/feed.xml</loc>
-    <lastmod>2011-05-04</lastmod>
+    <lastmod>2011-05-02</lastmod>
   </url>
   <url>
     <loc>http://ypassword.espozito.com/Scratch/en/blog/</loc>
-    <lastmod>2011-08-08</lastmod>
+    <lastmod>2011-07-27</lastmod>
   </url>
   <url>
     <loc>http://ypassword.espozito.com/Scratch/fr/</loc>
-    <lastmod>2011-08-08</lastmod>
+    <lastmod>2011-07-27</lastmod>
   </url>
 </urlset>
diff --git a/site/css/main.css b/site/css/main.css
index 402db62..f4bdfe5 100644
--- a/site/css/main.css
+++ b/site/css/main.css
@@ -73,7 +73,6 @@ hgroup#maintitle {
   background-image: -webkit-linear-gradient(top, #60646c, #51555c);
   background-image: -moz-linear-gradient(top, #60646c, #51555c);
   background-image: -o-linear-gradient(top, #60646c, #51555c);
-  background-image: -ms-linear-gradient(top, #60646c, #51555c);
   background-image: linear-gradient(top, #60646c, #51555c);
 }
 /* line 75, ../src/main.sass */
@@ -109,7 +108,6 @@ footer {
   background-image: -webkit-linear-gradient(top, #60646c, #51555c);
   background-image: -moz-linear-gradient(top, #60646c, #51555c);
   background-image: -o-linear-gradient(top, #60646c, #51555c);
-  background-image: -ms-linear-gradient(top, #60646c, #51555c);
   background-image: linear-gradient(top, #60646c, #51555c);
 }
 /* line 96, ../src/main.sass */
@@ -729,7 +727,6 @@ body.support #main > article form {
   background-image: -webkit-linear-gradient(top, #60646c, #51555c);
   background-image: -moz-linear-gradient(top, #60646c, #51555c);
   background-image: -o-linear-gradient(top, #60646c, #51555c);
-  background-image: -ms-linear-gradient(top, #60646c, #51555c);
   background-image: linear-gradient(top, #60646c, #51555c);
 }
 /* line 354, ../src/main.sass */
@@ -765,8 +762,11 @@ iframe {
   border-radius: 5px;
 }
 
-/* line 369, ../src/main.sass */
+/* line 371, ../src/main.sass */
 input[type=text], textarea {
+  display: block;
+  width: 28em;
+  font-size: 0.9em;
   -moz-box-shadow: #868b96 0 0 3px inset, #efeff4 0 0 3px;
   -webkit-box-shadow: #868b96 0 0 3px inset, #efeff4 0 0 3px;
   -o-box-shadow: #868b96 0 0 3px inset, #efeff4 0 0 3px;
@@ -784,16 +784,22 @@ input[type=text], textarea {
   margin: 1em 0;
 }
 
-/* line 378, ../src/main.sass */
+/* line 382, ../src/main.sass */
+textarea {
+  height: 17.305em;
+}
+
+/* line 385, ../src/main.sass */
 input[type=submit], .bluebutton {
   display: block;
   text-align: center;
+  font-size: 0.9em;
   padding: 1ex 3ex;
-  margin: 1em 0;
-  -moz-box-shadow: #868b96 0 0 3px, #efeff4 2px 0;
-  -webkit-box-shadow: #868b96 0 0 3px, #efeff4 2px 0;
-  -o-box-shadow: #868b96 0 0 3px, #efeff4 2px 0;
-  box-shadow: #868b96 0 0 3px, #efeff4 2px 0;
+  margin: 0.5em 0;
+  -moz-box-shadow: #66aaff 0 1px 2px inset, #efeff4 2px 0;
+  -webkit-box-shadow: #66aaff 0 1px 2px inset, #efeff4 2px 0;
+  -o-box-shadow: #66aaff 0 1px 2px inset, #efeff4 2px 0;
+  box-shadow: #66aaff 0 1px 2px inset, #efeff4 2px 0;
   -moz-border-radius: 5px;
   -webkit-border-radius: 5px;
   -o-border-radius: 5px;
@@ -801,12 +807,12 @@ input[type=submit], .bluebutton {
   -khtml-border-radius: 5px;
   border-radius: 5px;
   text-shadow: 0 -1px #303237;
-  border: solid 1px #66aaff;
+  border: solid 3px #303237;
   color: #efeff4 !important;
   font-weight: bold;
   background: #4269a7;
 }
-/* line 390, ../src/main.sass */
+/* line 398, ../src/main.sass */
 input[type=submit]:hover, .bluebutton:hover {
   color: #efeff4;
   text-shadow: 0 0 1px #005588;
diff --git a/site/src/main.sass b/site/src/main.sass
index 23396d0..3282978 100644
--- a/site/src/main.sass
+++ b/site/src/main.sass
@@ -366,7 +366,12 @@ iframe
   +box-shadow(rgba(#000,.6) 0 0 15px)
   +border-radius()
 
+$inputWidth: 28em
+
 input[type=text], textarea
+  display: block
+  width: $inputWidth
+  font-size: .9em
   +box-shadow($ycolor3 0 0 3px inset, $ycolorb 0 0 3px)
   +border-radius()
   border: solid 1px $ycolor3
@@ -374,16 +379,19 @@ input[type=text], textarea
   background: $ycolorb
   padding: 1ex
   margin: 1em 0
+textarea
+  height: $inputWidth/1.618
 
 input[type=submit],.bluebutton
   display: block
   text-align: center
+  font-size: .9em
   padding: 1ex 3ex
-  margin: 1em 0
-  +box-shadow($ycolor3 0 0 3px, $ycolorb 2px 0)
+  margin: .5em 0
+  +box-shadow($higlightcolor-reflect 0 1px 2px inset, $ycolorb 2px 0)
   +border-radius()
   text-shadow: 0 -1px $ycolor7
-  border: solid 1px $higlightcolor-reflect
+  border: solid 3px $ycolor7
   color: $ycolorb !important
   font-weight: bold
   background: $higlightcolor