Prepare Web API section for Markdown conversion (#2464)

* Remove summary classes and ids

* Remove unecessary hidden

* Remove useless span filled with useless attributes / ids

* Remove useless font

* Remove notranslate

* Remove id in other elements than headings

* Remove name attributes

* Remove <pre><code> for JS w/ language-js class

* Remove <pre><code> for HTML w/ language-html class

* Remove <pre><code> for other lang w/ language-* class

* Rm highlighted line in code samples

* fix links, internal, external, absolute URLs

* missing file from last commit

* Fix styles errors apart from table + some classes

* Fix notes and warnings (+ some other :x)

* fix typo during merge which broke a doc

* aand forgot a conflict

* fix remaining classes of errors except dls and images

* Fix dls

* Fix images (deki/mozillademos) and remaining style issues

* Remove script tag from svg file

* Remove script tag from svg fileS

* Compress SVG files for CI

6 files changed, 27 insertions, 29 deletions

diff --git a/files/fr/web/api/idbdatabase/close/index.html b/files/fr/web/api/idbdatabase/close/index.html
index 26473ab2d7..63f025584d 100644
--- a/files/fr/web/api/idbdatabase/close/index.html
+++ b/files/fr/web/api/idbdatabase/close/index.html
@@ -26,7 +26,7 @@ translation_of: Web/API/IDBDatabase/close
 
 <h2 id="Exemple">Exemple</h2>
 
-<pre class="brush: js;highlight:[16]">// ouverture de la connexion à la base de données toDoList
+<pre class="brush: js">// ouverture de la connexion à la base de données toDoList
   var DBOpenRequest = window.indexedDB.open("toDoList", 4);
 
   // deux gestionnaires d’événements effectuant les
diff --git a/files/fr/web/api/idbdatabase/index.html b/files/fr/web/api/idbdatabase/index.html
index 6a9bfb1fd7..9be924fb0b 100644
--- a/files/fr/web/api/idbdatabase/index.html
+++ b/files/fr/web/api/idbdatabase/index.html
@@ -15,7 +15,7 @@ translation_of: Web/API/IDBDatabase
 <p>{{AvailableInWorkers}}</p>
 
 <div class="note">
-<p><strong>Note : </strong>Tout ce qui est fait dans une base de données indexée s'inscrit dans le contexte d'une transaction qui représente un interaction avec les données dans la base. Tout les objets de l'interface IndexedDB (incluant les accès aux magasins d'objets, indexes et curseurs) sont liés à une transaction en particulier. Aussi, on ne peut pas exécuter une commande, accéder aux données ou ouvrir quoi que ce soit, en dehors d'une transaction.</p>
+<p><strong>Note :</strong> Tout ce qui est fait dans une base de données indexée s'inscrit dans le contexte d'une transaction qui représente un interaction avec les données dans la base. Tout les objets de l'interface IndexedDB (incluant les accès aux magasins d'objets, indexes et curseurs) sont liés à une transaction en particulier. Aussi, on ne peut pas exécuter une commande, accéder aux données ou ouvrir quoi que ce soit, en dehors d'une transaction.</p>
 </div>
 
 <h2 id="Méthodes">Méthodes</h2>
@@ -53,14 +53,13 @@ translation_of: Web/API/IDBDatabase
  <dd>S’exécute au déclenchement de l'événement <code>error</code> quand la connexion à la base de donnée échoue.</dd>
  <dt>{{domxref("IDBDatabase.onversionchange")}}</dt>
  <dd>S’exécute au déclenchement de l'événement <code>versionchange</code> quand la structure de la base de donnée change (l'événement {{domxref("IDBOpenDBRequest.onupgradeneeded")}} ou {{domxref("IDBFactory.deleteDatabase")}} à été demandé ailleurs (probablement dans une autre fenêtre ou onglet sur le même ordinateur). Cela est différent de la transaction correspondant à un changement de version (cf. {{domxref("IDBVersionChangeEvent")}}) mais les concepts sont liés.</dd>
- <dt>
- <h2 id="Exemples">Exemples</h2>
- </dt>
 </dl>
 
+<h2 id="Exemples">Exemples</h2>
+
 <p>Dans le fragment de code suivant, on ouvre une base de données de façon asynchrone avec {{domxref("IDBFactory")}} puis on gère les cas de succès et d'erreur avant de créer un nouveau magasin d'objet au cas où une mise à jour est nécessaire ({{domxref("IDBdatabase")}}). Pour étudier un exemple complet et fonctionnel, voir notre application <a href="https://github.com/mdn/to-do-notifications/">To-do Notifications</a> (<a href="https://mdn.github.io/to-do-notifications/">voir l'exemple <em>live</em></a>).</p>
 
-<pre class="brush: js;highlight:[13,24,26,27,28,32]">// On ouvre la base de données
+<pre class="brush: js">// On ouvre la base de données
   var DBOpenRequest = window.indexedDB.open("toDoList", 4);
 
   // On ajoute les deux gestionnaires d'événements
diff --git a/files/fr/web/api/idbdatabase/name/index.html b/files/fr/web/api/idbdatabase/name/index.html
index c2247da499..635a6ae383 100644
--- a/files/fr/web/api/idbdatabase/name/index.html
+++ b/files/fr/web/api/idbdatabase/name/index.html
@@ -26,7 +26,7 @@ translation_of: Web/API/IDBDatabase/name
 
 <p>Cet exemple affiche le nom de la base de données qui est ouverte. La connexion (l'objet {{domxref("IDBDatabase")}}) est affectée à la variable <code>db</code>, puis sa propriété <code>name</code> est affichée dans la console.</p>
 
-<pre class="brush: js;highlight:[16]">// Connexion à la base de données
+<pre class="brush: js">// Connexion à la base de données
 var DBOpenRequest = window.indexedDB.open("toDoList", 4);
 
 // Les deux gestionnaires d'événement activés pour
@@ -48,7 +48,9 @@ DBOpenRequest.onsuccess = function(event) {
   console.log(db.name);
 };</pre>
 
-<p class="note">Pour un exemple fonctionnel complet, voir notre <a href="https://github.com/mdn/to-do-notifications/">To-do Notifications</a> (<a href="https://mdn.github.io/to-do-notifications/">voir l'exemple <em>live</em></a>).</p>
+<div class="note">
+  <p><strong>Note :</strong> Pour un exemple fonctionnel complet, voir notre <a href="https://github.com/mdn/to-do-notifications/">To-do Notifications</a> (<a href="https://mdn.github.io/to-do-notifications/">voir l'exemple <em>live</em></a>).</p>
+</div>
 
 <h2 id="Spécifications">Spécifications</h2>
 
diff --git a/files/fr/web/api/idbdatabase/objectstorenames/index.html b/files/fr/web/api/idbdatabase/objectstorenames/index.html
index 95de1826a2..f9263bdf33 100644
--- a/files/fr/web/api/idbdatabase/objectstorenames/index.html
+++ b/files/fr/web/api/idbdatabase/objectstorenames/index.html
@@ -45,7 +45,9 @@ DBOpenRequest.onsuccess = function(event) {
   console.log(db.objectStoreNames);
 };</pre>
 
-<p class="note">Pour un exemple fonctionnel complet, voir notre application de démo <a href="https://github.com/mdn/to-do-notifications/">To-do Notifications</a> (<a href="https://mdn.github.io/to-do-notifications/">l'exemple <em>live</em></a>).</p>
+<div class="note">
+  <p><strong>Note :</strong>Pour un exemple fonctionnel complet, voir notre application de démo <a href="https://github.com/mdn/to-do-notifications/">To-do Notifications</a> (<a href="https://mdn.github.io/to-do-notifications/">l'exemple <em>live</em></a>).</p>
+</div>
 
 <h2 id="Spécifications">Spécifications</h2>
 
diff --git a/files/fr/web/api/idbdatabase/transaction/index.html b/files/fr/web/api/idbdatabase/transaction/index.html
index 501c1fe7a3..531edfbdb2 100644
--- a/files/fr/web/api/idbdatabase/transaction/index.html
+++ b/files/fr/web/api/idbdatabase/transaction/index.html
@@ -19,18 +19,14 @@ translation_of: Web/API/IDBDatabase/transaction
 
 <dl>
  <dt>storeNames</dt>
- <dd>un tableau de noms de magasins d'objets entrant dans le cadre de cette transaction. Indique seulement les magasins d'objets dont on a besoin.<br>
- Si l’on n’a besoin que d’un seul magasin d'objet, on peut simplement passer son nom. Les lignes suivantes sont équivalentes :
+ <dd><p>un tableau de noms de magasins d'objets entrant dans le cadre de cette transaction. Indique seulement les magasins d'objets dont on a besoin. Si l’on n’a besoin que d’un seul magasin d'objet, on peut simplement passer son nom. Les lignes suivantes sont équivalentes :</p>
  <pre class="brush: js">var transaction = db.transaction(['my-store-name']);
 var transaction = db.transaction('my-store-name');</pre>
- Pour utiliser tous les magasins d'objets de la base de donnée, on peut appeler la methode {{domxref("IDBDatabase.objectStoreNames")}}:
-
+ <p>Pour utiliser tous les magasins d'objets de la base de donnée, on peut appeler la methode {{domxref("IDBDatabase.objectStoreNames")}}:</p>
  <pre class="brush:js;">var transaction = db.transaction(db.objectStoreNames);</pre>
- Passer un tableau vide lèvera une exception.</dd>
+ <p>Passer un tableau vide lèvera une exception.</p></dd>
  <dt>mode {{optional_inline}}</dt>
- <dd>
- <p>Le {{domxref("IDBTransactionMode","mode")}} d’{{domxref("IDBObjectStore","accès aux magasins d'objets")}} à la base de données (par default <code>readonly</code>):</p>
-
+ <dd><p>Le {{domxref("IDBTransactionMode","mode")}} d’{{domxref("IDBObjectStore","accès aux magasins d'objets")}} à la base de données (par default <code>readonly</code>):</p>
  <table class="standard-table">
   <thead>
    <tr>
@@ -40,32 +36,30 @@ var transaction = db.transaction('my-store-name');</pre>
   </thead>
   <tbody>
    <tr>
-    <td id="readonly"><code>readonly</code></td>
+    <td><code>readonly</code></td>
     <td>permet de prendre des objets dans les magasins d'objets, de lire les index et de faire des curseurs.</td>
    </tr>
    <tr>
-    <td id="readwrite"><code>readwrite</code></td>
+    <td><code>readwrite</code></td>
     <td>Permet en plus de que l'on peut faire en readonly, d’ajouter et mettre à jour des objets dans les magasins d'objets.</td>
    </tr>
-   <tr id="versionchange">
+   <tr>
     <td><code>versionchange</code></td>
     <td>Permet toute les opérations, y compris celles qui suppriment ou ajoutent des {{domxref("IDBOjectStore","magasins d'objets")}} ou des {{domxref("IDBIndex","index")}}. Ce mode met à jour le numéro de version de la base de données, il se sert au début de {{domxref ("IDBDatabase.setVersion")}}. Les {{domxref("IDBTransaction","transactions")}} dans ce mode ne peuvent pas fonctionner en même temps que d'autres.</td>
    </tr>
    <tr>
-    <td id="readwriteflush "><code>readwriteflush</code></td>
+    <td><code>readwriteflush</code></td>
     <td>
      <p>Si vous devez vous assurer de l'efficacité d'une transaction pour une raison quelconque (par exemple, vous stockez des données critiques qui ne peuvent être recalculées plus tard), vous pouvez forcer l’enregistrement complet sur disque avant de déclencher l’événement <code>complete</code> en utilisant le mode <code>readwriteflush</code> (non standard) expérimental ( voir {{domxref("IDBDatabase.transaction")}} ). C'est expérimental, et ne peut être utilisé que si le <code> dom.indexedDB.experimental </code> pref est réglé sur <code> true </code> dans <code> about:config.</code></p>
 
-     <p class="note">Depuis Firefox 40, les transactions IndexedDB diminuent en efficacité pour gagner en efficience (voir {{Bug ( "1112702")}}.) Auparavant, dans une transaction en <code><a href="#const_read_write">readwrite</a></code> l'événement complete était déclanché seulement lorsque toutes les données étaient écrites sur le disque. Maintenant l'événement <code>complete</code> est déclenché après que l'OS ai envoyé l'ordre d'écrire les données, mais potentiellement avant qu'elles aient été écrites sur le disque. L'événement <code>complete</code> peut ainsi se déclancher plus rapidement qu'auparavant, cependant, il existe une chance infime pour que l'ensemble de la transaction soit perdue si le système d'exploitation plante ou s'il y a une perte de courant avant que les données aient été écites sur le disque. Étant donné que ces événements catastrophiques sont rares la plupart des utilisateurs ne devraient pas avoir à s'en préoccuper davantage.</p>
+     <div class="note"><p><strong>Note :</strong> Depuis Firefox 40, les transactions IndexedDB diminuent en efficacité pour gagner en efficience (voir {{Bug ( "1112702")}}.) Auparavant, dans une transaction en <code><a href="#const_read_write">readwrite</a></code> l'événement complete était déclanché seulement lorsque toutes les données étaient écrites sur le disque. Maintenant l'événement <code>complete</code> est déclenché après que l'OS ai envoyé l'ordre d'écrire les données, mais potentiellement avant qu'elles aient été écrites sur le disque. L'événement <code>complete</code> peut ainsi se déclancher plus rapidement qu'auparavant, cependant, il existe une chance infime pour que l'ensemble de la transaction soit perdue si le système d'exploitation plante ou s'il y a une perte de courant avant que les données aient été écites sur le disque. Étant donné que ces événements catastrophiques sont rares la plupart des utilisateurs ne devraient pas avoir à s'en préoccuper davantage.</p></div>
     </td>
    </tr>
   </tbody>
  </table>
- {{note("Pour éviter des pertes de performance, n’utilisez le mode <code>readwrite</code> que si vous avez effectivement besoin d’écrire ou de mettre à jour des données sur la base.")}} Si on a besoin d’accéder à un magasin d'objets pour écrire ou mettre à jour des enregistrement, on utilise la sytaxe:
-
+ <p>Pour éviter des pertes de performance, n’utilisez le mode <code>readwrite</code> que si vous avez effectivement besoin d’écrire ou de mettre à jour des données sur la base.")}} Si on a besoin d’accéder à un magasin d'objets pour écrire ou mettre à jour des enregistrement, on utilise la sytaxe:</p>
  <pre class="brush:js">var transaction = db.transaction('monMagasin','readwrite');</pre>
  </dd>
- <dd> </dd>
 </dl>
 
 <h2 id="Renvoie">Renvoie</h2>
@@ -121,7 +115,8 @@ transaction.onerror = function(event) {
 var objectStore = transaction.objectStore("toDoList");
 // etc.</pre>
 
-<p class="note">Pour un exemple de travail complet, voir notre <a href="https://github.com/mdn/to-do-notifications/">To-do Notifications</a> app (<a href="http://mdn.github.io/to-do-notifications/">view example live</a>).</p>
+<div class="note"><p><strong>Note :</strong>Pour un exemple de travail complet, voir notre <a href="https://github.com/mdn/to-do-notifications/">To-do Notifications</a> app (<a href="http://mdn.github.io/to-do-notifications/">view example live</a>).</p>
+</div>
 
 <h2 id="Spécification">Spécification</h2>
 
@@ -153,5 +148,5 @@ var objectStore = transaction.objectStore("toDoList");
  <li>{{domxref("IDBKeyRange","Définir l'intervalle des clés")}}</li>
  <li>{{domxref("IDBObjectStore","Accès aux magasins d'objets")}}</li>
  <li>{{domxref("IDBCursor","Utiliser les curseur")}}</li>
- <li>Exemple de référence: <a class="external" href="https://github.com/mdn/to-do-notifications/tree/gh-pages">To-do Notifications</a> (<a class="external" href="http://mdn.github.io/to-do-notifications/">view example live</a>.)</li>
+ <li>Exemple de référence: <a href="https://github.com/mdn/to-do-notifications/tree/gh-pages">To-do Notifications</a> (<a href="http://mdn.github.io/to-do-notifications/">view example live</a>.)</li>
 </ul>
diff --git a/files/fr/web/api/idbdatabase/version/index.html b/files/fr/web/api/idbdatabase/version/index.html
index c692965224..81289060e2 100644
--- a/files/fr/web/api/idbdatabase/version/index.html
+++ b/files/fr/web/api/idbdatabase/version/index.html
@@ -25,7 +25,7 @@ translation_of: Web/API/IDBDatabase/version
 
 <h2 id="Exemples">Exemples</h2>
 
-<pre class="brush: js;highlight:[16]">// On ouvre la base de données
+<pre class="brush: js">// On ouvre la base de données
 var DBOpenRequest = window.indexedDB.open("toDoList", 4);
 
 //  On déclare des gestionnaires d'évènements pour l'ouverture
@@ -73,5 +73,5 @@ DBOpenRequest.onsuccess = function(event) {
  <li>Définir un intervalle de clés : {{domxref("IDBKeyRange")}}</li>
  <li>Récupérer et modifier les données : {{domxref("IDBObjectStore")}}</li>
  <li>Utiliser les curseurs {{domxref("IDBCursor")}}</li>
- <li>Exemple de référence : <a class="external" href="https://github.com/mdn/to-do-notifications/tree/gh-pages">To-do Notifications</a> (<a class="external" href="https://mdn.github.io/to-do-notifications/">exemple <em>live</em></a>).</li>
+ <li>Exemple de référence : <a href="https://github.com/mdn/to-do-notifications/tree/gh-pages">To-do Notifications</a> (<a href="https://mdn.github.io/to-do-notifications/">exemple <em>live</em></a>).</li>
 </ul>