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

7 files changed, 38 insertions, 47 deletions

diff --git a/files/fr/web/api/webglrenderingcontext/enable/index.html b/files/fr/web/api/webglrenderingcontext/enable/index.html
index 9c2d5149ca..3a4a7633b1 100644
--- a/files/fr/web/api/webglrenderingcontext/enable/index.html
+++ b/files/fr/web/api/webglrenderingcontext/enable/index.html
@@ -23,8 +23,7 @@ original_slug: Web/API/WebGLRenderingContext/activer
 
 <dl>
  <dt><code>fon</code></dt>
- <dd>Un {{domxref("GLenum")}} indiquant quelle fonctionnalité WebGL activer. Valeurs possibles :</dd>
- <dd>
+ <dd><p>Un {{domxref("GLenum")}} indiquant quelle fonctionnalité WebGL activer. Valeurs possibles :</p>
  <table class="standard-table">
   <thead>
    <tr>
@@ -71,8 +70,7 @@ original_slug: Web/API/WebGLRenderingContext/activer
    </tr>
   </tbody>
  </table>
- Lors de l'utilisation d'un {{domxref("WebGL2RenderingContext", "WebGL 2 context", "", 1)}}, les valeurs suivantes sont en outre disponibles :
-
+ <p>Lors de l'utilisation d'un {{domxref("WebGL2RenderingContext", "WebGL 2 context", "", 1)}}, les valeurs suivantes sont en outre disponibles :</p>
  <table class="standard-table">
   <thead>
    <tr>
diff --git a/files/fr/web/api/webglrenderingcontext/enablevertexattribarray/index.html b/files/fr/web/api/webglrenderingcontext/enablevertexattribarray/index.html
index 7107acc1c5..a573a50f6c 100644
--- a/files/fr/web/api/webglrenderingcontext/enablevertexattribarray/index.html
+++ b/files/fr/web/api/webglrenderingcontext/enablevertexattribarray/index.html
@@ -22,7 +22,7 @@ translation_of: Web/API/WebGLRenderingContext/enableVertexAttribArray
 <p>La méthode {{domxref ("WebGLRenderingContext")}} <strong><code>enableVertexAttribArray()</code> -</strong> qui fait partie de l'API WebGL - active le tableau générique des attributs de sommet à l'indice spécifié dans la liste des tableaux d'attributs.</p>
 
 <div class="note">
-<p>Vous pouvez désactiver le tableau d'attributs en appelant {{domxref("WebGLRenderingContext.disableVertexAttribArray", "disableVertexAttribArray()")}}.</p>
+<p><strong>Note :</strong> Vous pouvez désactiver le tableau d'attributs en appelant {{domxref("WebGLRenderingContext.disableVertexAttribArray", "disableVertexAttribArray()")}}.</p>
 </div>
 
 <p>Dans WebGL, les valeurs s'appliquant à un sommet particulier sont stockées dans des attributs. Ceux-ci ne sont disponibles que pour le code JavaScript et le shader de sommet. Les attributs sont référencés par un numéro d'indice dans la liste des attributs gérés par la GPU. Certains indices d'attributs de sommet peuvent avoir des buts prédéfinis, suivant la plate-forme et/ou la GPU. D'autres sont affectés par la couche WebGL lorsque vous créez les attributs.</p>
@@ -58,7 +58,7 @@ translation_of: Web/API/WebGLRenderingContext/enableVertexAttribArray
 
 <p>Ce code — un extrait de l'exemple complet <a href="/fr-FR/docs/Web/API/WebGL_API/Basic_2D_animation_example">Un exemple d'animation 2D WebGL de base</a> — montre l'utilisation de <code>enableVertexArray()</code> pour activer l'attribut qui sera utilisé par la couche WebGL pour passer des sommets individuels depuis le tampon des sommets à la fonction shader de sommet.</p>
 
-<pre class="brush: js highlight[6]">gl.bindBuffer(gl.ARRAY_BUFFER, vertexBuffer);
+<pre class="brush: js">gl.bindBuffer(gl.ARRAY_BUFFER, vertexBuffer);
 
 aVertexPosition =
     gl.getAttribLocation(programmeShader, "aVertexPosition");
@@ -69,9 +69,9 @@ gl.vertexAttribPointer(aVertexPosition, vertexNumComponents,
 
 gl.drawArrays(gl.TRIANGLES, 0, vertexCount);</pre>
 
-<div class="callout-box">Cet extrait de code provient de <a href="/fr-FR/docs/Web/API/WebGL_API/Basic_2D_animation_example#Drawing_and_animating_the_scene">la fonction animateScene()</a> dans "Un exemple d'animation WebGL 2D de base". Voir cet article pour l'exemple complet et pour voir l'animation résultante en action.</div>
-
-<p> </p>
+<div class="note">
+  <p><strong>Note :</strong> Cet extrait de code provient de <a href="/fr-FR/docs/Web/API/WebGL_API/Basic_2D_animation_example#Drawing_and_animating_the_scene">la fonction animateScene()</a> dans "Un exemple d'animation WebGL 2D de base". Voir cet article pour l'exemple complet et pour voir l'animation résultante en action.</p>
+</div>
 
 <p>Ce code définit le tampon des sommets qui sera utilisé pour dessiner les triangles de la forme en appelant {{domxref("WebGLRenderingContext.bindBuffer", "bindBuffer()")}}. Ensuite, l'indice de l'attribut de position des sommets est obtenu à partir du programme shader en appelant {{domxref("WebGLRenderingContext.getAttribLocation", "getAttribLocation()")}}.</p>
 
@@ -81,8 +81,6 @@ gl.drawArrays(gl.TRIANGLES, 0, vertexCount);</pre>
 
 <p>Avec l'association définie entre le tampon des sommets de notre forme et l'attribut <code>aVertexPosition</code> utilisé pour fournir les sommets un par un dans le shader de sommet, nous sommes prêts à dessiner la forme en appelant {{domxref ("WebGLRenderingContext.drawArrays", "drawArrays()")}}.</p>
 
-<p> </p>
-
 <h2 id="Spécifications">Spécifications</h2>
 
 <table class="standard-table">
diff --git a/files/fr/web/api/webglrenderingcontext/getuniformlocation/index.html b/files/fr/web/api/webglrenderingcontext/getuniformlocation/index.html
index ee31458f04..89393bd4f7 100644
--- a/files/fr/web/api/webglrenderingcontext/getuniformlocation/index.html
+++ b/files/fr/web/api/webglrenderingcontext/getuniformlocation/index.html
@@ -25,18 +25,18 @@ translation_of: Web/API/WebGLRenderingContext/getUniformLocation
 <div> </div>
 
 <dl>
- <dt><span class="seoSummary">{{domxref ("WebGLRenderingContext.getUniform", "getUniform()")}}</span></dt>
- <dd><span class="seoSummary">Retourne la valeur de l'uniform à l'emplacement indiqué.</span></dd>
+ <dt>{{domxref ("WebGLRenderingContext.getUniform", "getUniform()")}}</dt>
+ <dd>Retourne la valeur de l'uniform à l'emplacement indiqué.</dd>
  <dt><br>
- <span class="seoSummary">{{domxref ("WebGLRenderingContext.uniform", "uniform[1234] [fi] [v]()")}}</span></dt>
- <dd><span class="seoSummary">Affecte à la valeur de l'uniform la valeur spécifiée, qui peut être un nombre flottant ou entier unique, ou un vecteur de 2 à 4 composantes spécifié soit comme une liste de valeurs, soit comme un {{jsxref ("Float32Array")}} ou un {{ jsxref ("Int32Array")}}.</span></dd>
+ {{domxref ("WebGLRenderingContext.uniform", "uniform[1234] [fi] [v]()")}}</dt>
+ <dd>Affecte à la valeur de l'uniform la valeur spécifiée, qui peut être un nombre flottant ou entier unique, ou un vecteur de 2 à 4 composantes spécifié soit comme une liste de valeurs, soit comme un {{jsxref ("Float32Array")}} ou un {{ jsxref ("Int32Array")}}.</dd>
  <dt><br>
- <span class="seoSummary">{{domxref ("WebGLRenderingContext.uniformMatrix", "uniformMatrix[234][fv]()")}}</span></dt>
- <dd><span class="seoSummary">Affecte à la valeur de l'uniforme la matrice spécifiée, éventuellement avec transposition. La valeur est représentée comme une suite de valeurs GLfloat ou comme un Float32Array.</span></dd>
+ {{domxref ("WebGLRenderingContext.uniformMatrix", "uniformMatrix[234][fv]()")}}</dt>
+ <dd>Affecte à la valeur de l'uniforme la matrice spécifiée, éventuellement avec transposition. La valeur est représentée comme une suite de valeurs GLfloat ou comme un Float32Array.</dd>
 </dl>
 
 <p><br>
- <span class="seoSummary">L'uniform lui-même est déclaré dans le programme shader en utilisant GLSL.</span></p>
+ L'uniform lui-même est déclaré dans le programme shader en utilisant GLSL.</p>
 
 <h2 id="Syntaxe">Syntaxe</h2>
 
@@ -59,7 +59,7 @@ translation_of: Web/API/WebGLRenderingContext/getUniformLocation
 <p><code>WebGLUniformLocation</code> est une valeur opaque utilisée pour identifier de manière unique l'emplacement dans la mémoire de la GPU auquel se trouve la variable uniform. Avec cette valeur en main, vous pouvez appeler d'autres méthodes WebGL pour accéder à la valeur de la variable uniform.</p>
 
 <div class="note">
-<p>Le type <code>WebGLUniformLocation</code> est compatible avec le type <code>GLint</code> pour indiquer l'indice ou l'emplacement d'un attribut uniform.</p>
+<p><strong>Note :</strong> Le type <code>WebGLUniformLocation</code> est compatible avec le type <code>GLint</code> pour indiquer l'indice ou l'emplacement d'un attribut uniform.</p>
 </div>
 
 <h3 id="Erreurs">Erreurs</h3>
@@ -77,7 +77,7 @@ translation_of: Web/API/WebGLRenderingContext/getUniformLocation
 
 <p>Dans cet exemple, extrait de la méthode <code>animateScene()</code> dans l'article <a href="/fr-FR/docs/Web/API/WebGL_API/Basic_2D_animation_example#Drawing_and_animating_the_scene">Un exemple d'animation 2D WebGL de base</a>, retrouve les emplacements de trois uniforms du programme d'ombrage, puis définit la valeur de chacun des trois uniforms.</p>
 
-<pre class="brush: js highlight[3-8]">gl.useProgram(programmeShader);
+<pre class="brush: js">gl.useProgram(programmeShader);
 
 uScalingFactor =
     gl.getUniformLocation(programmeShader, "uScalingFactor");
@@ -90,7 +90,9 @@ gl.uniform2fv(uScalingFactor, currentScale);
 gl.uniform2fv(uRotationVector, currentRotation);
 gl.uniform4fv(uGlobalColor, [0.1, 0.7, 0.2, 1.0]);</pre>
 
-<div class="callout-box">Cet extrait de code provient de <a href="/fr-FR/docs/Web/API/WebGL_API/Basic_2D_animation_example#Drawing_and_animating_the_scene">la fonction animateScene()</a> dans "Un exemple d'animation WebGL 2D de base". Voir cet article pour l'exemple complet et pour voir l'animation résultante en action.</div>
+<div class="note">
+  <p><strong>Note :</strong> Cet extrait de code provient de <a href="/fr-FR/docs/Web/API/WebGL_API/Basic_2D_animation_example#Drawing_and_animating_the_scene">la fonction animateScene()</a> dans "Un exemple d'animation WebGL 2D de base". Voir cet article pour l'exemple complet et pour voir l'animation résultante en action.</p>
+</div>
 
 <p>Après avoir défini le programme d'ombrage en cours comme <code>programmeShader</code>, ce code récupère les trois uniforms <code>"uScalingFactor"</code>, <code>"uGlobalColor"</code> et <code>"uRotationVector"</code>, en appelant <code>getUniformLocation()</code> une fois pour chaque uniform.</p>
 
diff --git a/files/fr/web/api/webglrenderingcontext/index.html b/files/fr/web/api/webglrenderingcontext/index.html
index 25ba243a43..437dbe6f19 100644
--- a/files/fr/web/api/webglrenderingcontext/index.html
+++ b/files/fr/web/api/webglrenderingcontext/index.html
@@ -22,7 +22,7 @@ var gl = canvas.getContext('webgl');
 
 <p>Une fois que avez le contexte de rendu WebGL, vous pouvez dessiner à l'intérieur.</p>
 
-<p>Le <a href="/fr/docs/Web/API/WebGL_API/Tutorial" title="Tutoriel WebGL">tutoriel WebGL</a> contient plus d'informations, d'exemples, et de ressources sur comment débuter en WebGL.</p>
+<p>Le <a href="/fr/docs/Web/API/WebGL_API/Tutorial">tutoriel WebGL</a> contient plus d'informations, d'exemples, et de ressources sur comment débuter en WebGL.</p>
 
 <h2 id="Constants">Constants</h2>
 
diff --git a/files/fr/web/api/webglrenderingcontext/teximage2d/index.html b/files/fr/web/api/webglrenderingcontext/teximage2d/index.html
index 75ac660bbf..af95e8f3c8 100644
--- a/files/fr/web/api/webglrenderingcontext/teximage2d/index.html
+++ b/files/fr/web/api/webglrenderingcontext/teximage2d/index.html
@@ -38,7 +38,7 @@ void gl.texImage2D(<var>cible</var>, <var>niveau</var>, <var>formatinterne</var>
 
 <dl>
  <dt><code>cible</code></dt>
- <dd>Un {{domxref ("GLenum")}} indiquant le point de liaison (cible) de la texture active. Valeurs possibles :
+ <dd><p>Un {{domxref ("GLenum")}} indiquant le point de liaison (cible) de la texture active. Valeurs possibles :</p>
  <ul>
   <li><code>gl.TEXTURE_2D</code> : une texture bidimensionnelle ;</li>
   <li><code>gl.TEXTURE_CUBE_MAP_POSITIVE_X</code> : face X positive pour une texture mappée sur un cube ;</li>
@@ -49,13 +49,10 @@ void gl.texImage2D(<var>cible</var>, <var>niveau</var>, <var>formatinterne</var>
   <li><code>gl.TEXTURE_CUBE_MAP_NEGATIVE_Z</code> : face Z négative pour une texture mappée sur un cube.</li>
  </ul>
  </dd>
-</dl>
-
-<dl>
  <dt><code>niveau</code></dt>
  <dd>Un {{domxref ("GLint")}} indiquant le niveau de détail. Le niveau 0 est le niveau de l'image de base et le niveau n est le n-ième niveau de réduction du mipmap.</dd>
  <dt><code>formatinterne</code></dt>
- <dd>Un {{domxref ("GLint")}} indiquant les composantes de couleur dans la texture. Valeurs possibles :
+ <dd><p>Un {{domxref ("GLint")}} indiquant les composantes de couleur dans la texture. Valeurs possibles :</p>
  <ul>
   <li><code>gl.ALPHA</code> : ignore les composantes rouge, vert et bleu, et lit la composante alpha ;</li>
   <li><code>gl.RGB</code> : ignore la composante alpha et lit les composantes rouge, vert et bleu ;</li>
@@ -115,7 +112,7 @@ void gl.texImage2D(<var>cible</var>, <var>niveau</var>, <var>formatinterne</var>
  <dt><code>format</code></dt>
  <dd>Un {{domxref("GLenum")}} indiquant le format des données de texel. En WebGL 1, cela doit être identique à <code>formatinterne</code> (voir ci-dessus). En WebGL 2, les combinaisons sont répertoriées dans <a href="https://www.khronos.org/registry/webgl/specs/latest/2.0/#TEXTURE_TYPES_FORMATS_FROM_DOM_ELEMENTS_TABLE">ce tableau</a>.</dd>
  <dt><code>type</code></dt>
- <dd>Un {{domxref("GLenum")}} indiquant le type de données des données de texel. Valeurs possibles :
+ <dd><p>Un {{domxref("GLenum")}} indiquant le type de données des données de texel. Valeurs possibles :</p>
  <ul>
   <li><code>gl.UNSIGNED_BYTE</code> : 8 bits par canal pour <code>gl.RGBA</code> ;</li>
   <li><code>gl.UNSIGNED_SHORT_5_6_5</code> : 5 bits de rouge, 6 bits de vert, 5 bits de bleu ;</li>
@@ -157,7 +154,7 @@ void gl.texImage2D(<var>cible</var>, <var>niveau</var>, <var>formatinterne</var>
  </ul>
  </dd>
  <dt><code>pixels</code></dt>
- <dd>L'un des objets suivants peut être utilisé comme source de pixels pour la texture :
+ <dd><p>L'un des objets suivants peut être utilisé comme source de pixels pour la texture :</p>
  <ul>
   <li>{{domxref("ArrayBufferView")}},
    <ul>
@@ -176,10 +173,6 @@ void gl.texImage2D(<var>cible</var>, <var>niveau</var>, <var>formatinterne</var>
  </dd>
  <dt><code><strong>decalage</strong></code></dt>
  <dd>(WebGL 2 seulement) Un décalage en octets {{domxref("GLintptr")}} dans le magasin de données du {{domxref("WebGLBuffer")}}. Utilisé pour télécharger des données vers la {{domxref ("WebGLTexture")}} liée, depuis le <code>WebGLBuffer</code> lié à la cible <code>PIXEL_UNPACK_BUFFER</code>.</dd>
- <dd>
- <ul>
- </ul>
- </dd>
 </dl>
 
 <h3 id="Valeur_retournée">Valeur retournée</h3>
diff --git a/files/fr/web/api/webglrenderingcontext/uniform/index.html b/files/fr/web/api/webglrenderingcontext/uniform/index.html
index c2247c102f..cb27eaeb2c 100644
--- a/files/fr/web/api/webglrenderingcontext/uniform/index.html
+++ b/files/fr/web/api/webglrenderingcontext/uniform/index.html
@@ -14,7 +14,7 @@ translation_of: Web/API/WebGLRenderingContext/uniform
 <p>Les méthodes <strong><code>WebGLRenderingContext.uniform[1234][fi][v]()</code></strong> de l'<a href="/fr-FR/docs/Web/API/WebGL_API">API WebGL</a> indiquent les valeurs des variables uniform.</p>
 
 <div class="note">
-<p>Beaucoup des fonctions décrites ici ont des interfaces WebGL 2 étendues, qui peuvent être trouvées en {{domxref("WebGL2RenderingContext.uniform","WebGL2RenderingContext.uniform[1234][uif][v]()")}}.</p>
+<p><strong>Note :</strong> Beaucoup des fonctions décrites ici ont des interfaces WebGL 2 étendues, qui peuvent être trouvées en {{domxref("WebGL2RenderingContext.uniform","WebGL2RenderingContext.uniform[1234][uif][v]()")}}.</p>
 </div>
 
 <h2 id="Syntaxe">Syntaxe</h2>
diff --git a/files/fr/web/api/webglrenderingcontext/vertexattribpointer/index.html b/files/fr/web/api/webglrenderingcontext/vertexattribpointer/index.html
index b40c03e607..93961c4fda 100644
--- a/files/fr/web/api/webglrenderingcontext/vertexattribpointer/index.html
+++ b/files/fr/web/api/webglrenderingcontext/vertexattribpointer/index.html
@@ -11,7 +11,7 @@ translation_of: Web/API/WebGLRenderingContext/vertexAttribPointer
 ---
 <div>{{APIRef("WebGL")}}</div>
 
-<p class="summary">La méthode <strong><code>WebGLRenderingContext.vertexAttribPointer()</code> </strong>de l'<a href="/fr-FR/docs/Web/API/WebGL_API">API WebGL</a> spécifie la disposition en mémoire de l'objet de tampon vertex. Elle doit être appelée une fois pour chaque attribut de sommet.</p>
+<p>La méthode <strong><code>WebGLRenderingContext.vertexAttribPointer()</code> </strong>de l'<a href="/fr-FR/docs/Web/API/WebGL_API">API WebGL</a> spécifie la disposition en mémoire de l'objet de tampon vertex. Elle doit être appelée une fois pour chaque attribut de sommet.</p>
 
 <h2 id="Syntaxe">Syntaxe</h2>
 
@@ -124,18 +124,18 @@ translation_of: Web/API/WebGLRenderingContext/vertexAttribPointer
 
 <p>sera stocké dans le tampon des tableaux comme suit :</p>
 
-<table style="width: auto;">
+<table>
  <tbody>
   <tr>
-   <td style="background-color: #ccf;">00 00 80 3F</td>
-   <td style="background-color: #ddf;">00 00 00 40</td>
-   <td style="background-color: #ccf;">00 00 0C 3F</td>
-   <td style="background-color: #cfc;">7F</td>
-   <td style="background-color: #dfd;">00</td>
-   <td style="background-color: #cfc;">00</td>
-   <td style="background-color: #dfd;">00</td>
-   <td style="background-color: #fcc;">7F FF</td>
-   <td style="background-color: #fdd;">3F FF</td>
+   <td>00 00 80 3F</td>
+   <td>00 00 00 40</td>
+   <td>00 00 0C 3F</td>
+   <td>7F</td>
+   <td>00</td>
+   <td>00</td>
+   <td>00</td>
+   <td>7F FF</td>
+   <td>3F FF</td>
   </tr>
  </tbody>
 </table>
@@ -182,7 +182,7 @@ gl.bufferData(gl.ARRAY_BUFFER, buffer, gl.STATIC_DRAW);
 
 <p>Ensuite, nous spécifions la disposition en mémoire du tampon de tableaux, soit en définissant nous-mêmes l'indice :</p>
 
-<pre class="brush: js, highlight:[3, 6, 9]">// Décrire la disposition du tampon :
+<pre class="brush: js">// Décrire la disposition du tampon :
 //1. position, non normalisé
 gl.vertexAttribPointer(0, 3, gl.FLOAT, false, 20, 0);
 gl.enableVertexAttribArray(0);
@@ -204,7 +204,7 @@ gl.linkProgram(shaderProgram);
 
 <p>soit en utilisant l'indice fourni par la carte graphique, au lieu de le définir nous-mêmes ; cela évite la réédition des liens du programme shader.</p>
 
-<pre class="brush: js, highlight:[2, 6, 10]">const positionLoc = gl.getAttribLocation(shaderProgram, 'position');
+<pre class="brush: js">const positionLoc = gl.getAttribLocation(shaderProgram, 'position');
 gl.vertexAttribPointer(positionLoc, 3, gl.FLOAT, false, 20, 0);
 gl.enableVertexAttribArray(positionLoc);