plint

commit 2afffbd7c5dbc5b61f4ed0642b3a19442cb698b7
parent 13a2d91684f39bd6a055e9621e180fcd8bc998b6
Author: Antoine Amarilli <a3nm@a3nm.net>
Date:   Wed, 14 Mar 2012 13:05:50 +0100

improve main form

Diffstat:
static/main.css
 | 
18
+++++++++++++++---
views/index.html
 | 
61
+++++++++++++++++++++++++++++++++++++++----------------------

2 files changed, 54 insertions(+), 25 deletions(-)
diff --git a/static/main.css b/static/main.css
@@ -32,7 +32,7 @@ header {
 
 #poem {
   width: 100%;
-  height: 15em;
+  height: 10em;
 }
 
 body {
@@ -45,16 +45,24 @@ body {
 }
 
 #bigform {
-  max-width: 25em;
+  max-width: 35em;
   border: 3px outset #040;
   padding: 1em;
+  padding-top: 0;
   background: #040;
   color: white;
   margin: auto;
-  margin-top: 4em;
+  margin-top: 2em;
+  margin-bottom: 2em;
   overflow: auto;
 }
 
+dd, #custom_template {
+  font-size: 80%;
+  width:80%;
+  margin-bottom: 0.5em;
+}
+
 #bigform ul {
   list-style-type: none;
   padding: 0px;
@@ -67,6 +75,10 @@ body {
   width: 7em;
 }
 
+#bigform textarea {
+  margin-bottom: 2em;
+}
+
 h2.correct, h2.incorrect {
   font-size: 120%;
   color: white;
diff --git a/views/index.html b/views/index.html
@@ -3,46 +3,63 @@
 {% block body %}
 <form method="POST" action="check" id="bigform">
   <label for="poem">
+  </label><br />
+  <textarea id="poem" name="poem"
   {% if lang == 'fr' %}
-    Poème&nbsp;:
+    placeholder="Entrez votre poème ici."
   {% else %}
-    Poem:
+    placeholder="Input your poem here."
   {% endif %}
-  </label><br />
-  <textarea id="poem" name="poem"></textarea>
+    ></textarea>
   <br/>
   <label for="template">
   {% if lang == 'fr' %}
-    Type de poème&nbsp;:
+    Choisissez un modèle de poème&nbsp;:
   {% else %}
-    Poem type:
+    Choose a poem template:
   {% endif %}
 </label><br />
-<ul>
-  <li><input type="radio" name="template" value="classical" checked="yes">
+<dl>
+  <dt><input type="radio" name="template" value="classical" checked="yes">
+  <span class="template">classical</span></input></dt>
+  {% if lang == 'fr' %}
+  <dd>Alexandrins classiques avec césure à l'hémistiche, rimes plates, genres
+  alternés.</dd>
+  {% else %}
+  <dd>Classical alexandrine verse with <em>hémistiche</em>, flat rhymes, alternate
+  rhyme genres.</dd>
+  {% endif %}
+  <dt><input type="radio" name="template" value="sonnet">
+  <span class="template">sonnet</span></input></dt>
   {% if lang == 'fr' %}
-    Alexandrins classiques avec césure à l'hémistiche, rimes plates, genres
-    alternés.
+  <dd>Sonnet classique&nbsp;:deux quatrains d'alexandrins
+  classiques en rimes embrassées et genres alternés, deux tercets d'alexandrins
+  classiques en rimes AAC BBC.</dd>
   {% else %}
-    Classical alexandrine verse with <em>hémistiche</em>, flat rhymes, alternate
-    rhyme genres.
+  <dd>Classical sonnet. TODO BLAH.</dd>
   {% endif %}
-  </input></li>
-  <li><input type="radio" name="template" value="sonnet">
+  <dt><input type="radio" name="template" value="alexandrin">
+  <span class="template">alexandrin</span></input></dt>
   {% if lang == 'fr' %}
-    Sonnet classique.
+  <dd>Alexandrins sans hémistiche, sans vérification de la
+  rime.</dd>
   {% else %}
-    Classical sonnet.
+  <dd>Alexandrine without <em>hémistiche</em> and without
+  rhyme.</dd>
   {% endif %}
-  </input></li>
-  <li><input type="radio" name="template" value="alexandrin">
+  <dt><input type="radio" name="template" value="custom">
+  <span class="template">custom</span> TODO help link TODO make this
+  work</input></dt>
+  <dd>
+  <textarea name="custom_template" id="custom_template"
   {% if lang == 'fr' %}
-    Alexandrins sans hémistiche, sans vérification de la rime.
+  placeholder="modèle personnalisé"
   {% else %}
-    Alexandrine without <em>hémistiche</em> and without rhyme.
+  placeholder="custom template"
   {% endif %}
-  </input></li></ul>
-  <p style="font-style: italic;">More templates coming soon!</p>
+  ></textarea>
+</dd>
+</dl>
   <input id="submit" type="submit"
   {% if lang == 'fr' %}
     value="Valider"