Nouvel article sur l’écriture en tengwar

1 files changed, 83 insertions, 48 deletions

diff --git a/content/pages/tengwar/tengwar.rst b/content/pages/tengwar/tengwar.rst
index aeaba15..eacfa27 100644
--- a/content/pages/tengwar/tengwar.rst
+++ b/content/pages/tengwar/tengwar.rst
@@ -12,19 +12,38 @@
 .. raw:: html
 
   <style>
-  input[type='text'] {
-    font-size: 24px;
+
+  @media screen and (min-width:800px) {
+    fieldset div {
+      display: flex;
+    }
+  }
+  fieldset label {
+    flex: 1;
+    max-width: 6em;
+  }
+  fieldset input, fieldset select{
+    flex: 1;
     width: 100%;
+    box-sizing: border-box;
+    font-size: 24px;
   }
 
   @font-face {
     font-family: "Tengwar Annatar" ;
     src: url("/pages/tengwar/tngan.ttf") format("truetype");
   }
+  @font-face {
+    font-family: "Tengwar Telcontar" ;
+    src: url("/pages/tengwar/tengtelc.ttf") format("truetype");
+  }
 
-  .tengwar {
+  .annatar {
     font-family: "Tengwar Annatar" ;
   }
+  .telcontar {
+    font-family: "Tengwar Telcontar"
+  }
 
 
   </style>
@@ -33,20 +52,36 @@
     <script>
       var script = document.getElementById('lib');
       script.addEventListener('load', function() {
-        lib.run("source", "phono", "tengwar");
+        lib.run("source", "phono", "tengwar", "font");
       });
     </script>
 
- <form>
-  <label for="source">Entrée :</label>
-  <input type="text" id="source" name="source"><br><br>
+.. role:: annatar
+
+.. raw:: html
+
+ <fieldset>
+  <div>
+    <label for="source">Entrée :</label>
+    <input type="text" id="source" name="source" class="telcontar">
+  </div>
+  <div>
   <label for="output">Phonétique :</label>
-  <input type="text" id="phono" name="output"><br><br>
+  <input type="text" id="phono" name="output">
+  </div>
+  <div>
+  <label for="font">Rendu :</label>
+  <select id="font">
+    <option value="annatar">Tengwar Annatar</option>
+    <option selected value="telcontar">Tengwar Telcontar</option>
+  </select>
+  </div>
+  <div>
   <label for="output">Tengwar :</label>
-  <input type="text" id="tengwar" class="tengwar" name="output"><br><br>
- </form>
+  <input type="text" id="tengwar" class="telcontar" name="output">
+  </div>
+ </fieldset>
 
-.. role:: tengwar
 
 Saisie
 ======
@@ -72,7 +107,7 @@ La transcription est réalisée en suivant le mode français du Tengwar qui est
 dérit sur cette page : http://www.simonrousseau.free.fr/tolkien/
 
 Il s’agit d’un mode dans lequel la voyelle est écrite au dessus de la consonne
-qu’elle précède : :tengwar:`7Y` va se lire *or*.
+qu’elle précède : :annatar:`7Y` va se lire *or*.
 
 Sons
 ====
@@ -88,28 +123,28 @@ Voyelles
 --------
 
 .. table::
-    :widths: 5 20 10 5
+    :widths: 5 20 10 10
 
     ======= =========== =========================== ==============
     Code    Exemple     Son                         Représentation
     ======= =========== =========================== ==============
-    a       bat, plat   a                           :tengwar:`\`C`
-    i       lit, émis   i                           :tengwar:`\`B`
-    y       lu          u                           :tengwar:`\`Û`
-    u       roue        ou                          :tengwar:`\`M`
-    o       peau, fort  o                           :tengwar:`\`N`
-    e       été         e fermé                     :tengwar:`\`V`
-    E       pair        e ouvert                    :tengwar:`\`V`
-    °       abordera    schwa                       :tengwar:`\`Ë`
-    2       deux        e fermé                     :tengwar:`\`ß`
-    9       neuf        e ouvert                    :tengwar:`\`ß`
-    5       cinq        in                          :tengwar:`5%`  [#nasal]_
-    1       parfum      un                          :tengwar:`5Ø`  [#nasal]_
-    @       ange        an                          :tengwar:`5#`  [#nasal]_
-    §       savon       on                          :tengwar:`5^`  [#nasal]_
-    j [#d]_ famille     y (semi-voyelle)            :tengwar:`l` [#next]_
-    8 [#d]_ huit        ui (semi-voyelle)           :tengwar:`]` [#next]_
-    w [#d]_ nouer       w (semi-voyelle)            :tengwar:`.` [#next]_
+    a       bat, plat   a                           :annatar:`\`C`
+    i       lit, émis   i                           :annatar:`\`B`
+    y       lu          u                           :annatar:`\`Û`
+    u       roue        ou                          :annatar:`\`M`
+    o       peau, fort  o                           :annatar:`\`N`
+    e       été         e fermé                     :annatar:`\`V`
+    ɛ       pair        e ouvert                    :annatar:`\`V`
+    ə       abordera    schwa                       :annatar:`\`Ë`
+    ø       deux        e fermé                     :annatar:`\`ß`
+    œ       neuf        e ouvert                    :annatar:`\`ß`
+    ɛ̃       cinq        in                          :annatar:`5%`  [#nasal]_
+    œ̃       parfum      un                          :annatar:`5Ø`  [#nasal]_
+    ɑ̃       ange        an                          :annatar:`5#`  [#nasal]_
+    ɔ̃       savon       on                          :annatar:`5^`  [#nasal]_
+    j [#d]_ famille     y (semi-voyelle)            :annatar:`l` [#next]_
+    ɥ [#d]_ huit        ui (semi-voyelle)           :annatar:`]` [#next]_
+    w [#d]_ nouer       w (semi-voyelle)            :annatar:`.` [#next]_
     ======= =========== =========================== ==============
 
 .. [#nasal] Les voyelles nasales sont représentées à l’aide de la voyelle et
@@ -125,28 +160,28 @@ Consonnes
 ---------
 
 .. table::
-    :widths: 5 20 10 5
+    :widths: 5 20 10 10
 
     ======= =========== =============== ==============
     Code    Exemple     Son             Représentation
     ======= =========== =============== ==============
-    p       soupe       p (occlusive)   :tengwar:`q` (:tengwar:`y`) [#m]_
-    b       bon, robe   b (occlusive)   :tengwar:`w` (:tengwar:`y`) [#m]_
-    t       terre, vite t (occlusive)   :tengwar:`1` (:tengwar:`6`) [#m]_
-    d       dans, aide  d (occlusive)   :tengwar:`2` (:tengwar:`6`) [#m]_
-    k       carré       k (occlusive)   :tengwar:`a`
-    g       gare        g (occlusive)   :tengwar:`s`
-    f       feu, éfrit  f (fricative)   :tengwar:`e`
-    v       vous        v (fricative)   :tengwar:`r`
-    s       soucis      s (fricative)   :tengwar:`3` (:tengwar:`i`) [#m]_
-    z       maison      z (fricative)   :tengwar:`4`
-    S       chat, pèche ch (fricative)  :tengwar:`d`
-    Z       mijoter     ge (fricative)  :tengwar:`f`
-    n       nous        n (nasale)      :tengwar:`5`
-    m       main        m (nasale)      :tengwar:`t`
-    N       agneau      gn (nasale)     :tengwar:`b`
-    l       sol, lent   l (liquide)     :tengwar:`j`
-    r       rue, venir  r (liquide)     :tengwar:`7` (:tengwar:`u`) [#m]_
+    p       soupe       p (occlusive)   :annatar:`q` (:annatar:`y`) [#m]_
+    b       bon, robe   b (occlusive)   :annatar:`w` (:annatar:`y`) [#m]_
+    t       terre, vite t (occlusive)   :annatar:`1` (:annatar:`6`) [#m]_
+    d       dans, aide  d (occlusive)   :annatar:`2` (:annatar:`6`) [#m]_
+    k       carré       k (occlusive)   :annatar:`a`
+    g       gare        g (occlusive)   :annatar:`s`
+    f       feu, éfrit  f (fricative)   :annatar:`e`
+    v       vous        v (fricative)   :annatar:`r`
+    s       soucis      s (fricative)   :annatar:`3` (:annatar:`i`) [#m]_
+    z       maison      z (fricative)   :annatar:`4`
+    ʃ       chat, pèche ch (fricative)  :annatar:`d`
+    ʒ       mijoter     ge (fricative)  :annatar:`f`
+    n       nous        n (nasale)      :annatar:`5`
+    m       main        m (nasale)      :annatar:`t`
+    ɲ       agneau      gn (nasale)     :annatar:`b`
+    l       sol, lent   l (liquide)     :annatar:`j`
+    ʁ       rue, venir  r (liquide)     :annatar:`7` (:annatar:`u`) [#m]_
     ======= =========== =============== ==============
 
 .. [#m]     La lettre entre parenthèse correspond à la consonne muette pouvant