Prepare SVG section for Markdown conversion (#2570)

* Remove summary classes

* Remove hidden classes out of pre

* Remove spans

* Remove notranslate class

* Remove ids out of headings

* missed 2 ids with regex

* clean note and warning cards

* fix headings errors

* Fix dls and as

* fix imgs

* lint stuff (absolute urls, english links)

* Temporarily readding file

* delete inexisting doc in en-US with flaws

* Fixes #2842 for SVG

1 files changed, 51 insertions, 23 deletions

diff --git a/files/fr/web/svg/attribute/fill/index.html b/files/fr/web/svg/attribute/fill/index.html
index c798d383fd..bca17a20a8 100644
--- a/files/fr/web/svg/attribute/fill/index.html
+++ b/files/fr/web/svg/attribute/fill/index.html
@@ -14,10 +14,9 @@ translation_of: Web/SVG/Attribute/fill
 
 <p>Pour les animations, il s'applique à cinq éléments: {{SVGElement('animate')}}, {{SVGElement('animateColor')}}, {{SVGElement('animateMotion')}}, {{SVGElement('animateTransform')}}, et {{SVGElement('set')}}</p>
 
-<div id="topExample">
-<div class="hidden">
-<pre class="brush: css">html,body,svg { height:100% }</pre>
-</div>
+<h2>Exemple</h2>
+
+<pre class="brush: css hidden">html,body,svg { height:100% }</pre>
 
 <pre class="brush: html">&lt;svg viewBox="0 0 300 100" xmlns="http://www.w3.org/2000/svg"&gt;
   &lt;!-- Remplir avec une simple couleur --&gt;
@@ -42,12 +41,13 @@ translation_of: Web/SVG/Attribute/fill
 &lt;/svg&gt;
 </pre>
 
-<p>{{EmbedLiveSample('topExample', '100%', 200)}}</p>
-</div>
+<p>{{EmbedLiveSample('exemple', '100%', 200)}}</p>
 
 <h2 id="altGlyph">altGlyph</h2>
 
-<p class="warning"><strong>Attention:</strong> {{SVGElement('altGlyph')}} est déprécié en SVG2 et ne devrait pas être utilisé.</p>
+<div class="warning">
+  <p><strong>Attention :</strong> {{SVGElement('altGlyph')}} est déprécié en SVG2 et ne devrait pas être utilisé.</p>
+</div>
 
 <p>Pour {{SVGElement('altGlyph')}}, <code>fill</code> est un attribut de présentation qui définit la couleur du glyphe.</p>
 
@@ -68,7 +68,9 @@ translation_of: Web/SVG/Attribute/fill
  </tbody>
 </table>
 
-<p class="note"><strong>Note:</strong> <code>fill</code> étant un attribut de présentation, il peut être utilisé comme propriété CSS.</p>
+<div class="note">
+  <p><strong>Note :</strong> <code>fill</code> étant un attribut de présentation, il peut être utilisé comme propriété CSS.</p>
+</div>
 
 <h2 id="animate">animate</h2>
 
@@ -93,7 +95,9 @@ translation_of: Web/SVG/Attribute/fill
 
 <h2 id="animateColor">animateColor</h2>
 
-<p class="warning"><strong>Attention:</strong> {{SVGElement('animateColor')}} est déprécié en SVG2 et ne devrait pas être utilisé. Utiliser {{SVGElement('animate')}} à la place.</p>
+<div class="warning">
+  <p><strong>Attention :</strong> {{SVGElement('animateColor')}} est déprécié en SVG2 et ne devrait pas être utilisé. Utiliser {{SVGElement('animate')}} à la place.</p>
+</div>
 
 <p>Pour {{SVGElement('animateColor')}}, <code>fill</code> définit l'état final de l'animation.</p>
 
@@ -177,7 +181,9 @@ translation_of: Web/SVG/Attribute/fill
  </tbody>
 </table>
 
-<p class="note"><strong>Note:</strong> <code>fill</code> étant un attribut de présentation, il peut être utilisé comme propriété CSS.</p>
+<div class="note">
+  <p><strong>Note :</strong> <code>fill</code> étant un attribut de présentation, il peut être utilisé comme propriété CSS.</p>
+</div>
 
 <h2 id="ellipse">ellipse</h2>
 
@@ -200,7 +206,9 @@ translation_of: Web/SVG/Attribute/fill
  </tbody>
 </table>
 
-<p class="note"><strong>Note:</strong> <code>fill</code> étant un attribut de présentation, il peut être utilisé comme propriété CSS.</p>
+<div class="note">
+  <p><strong>Note :</strong> <code>fill</code> étant un attribut de présentation, il peut être utilisé comme propriété CSS.</p>
+</div>
 
 <h2 id="path">path</h2>
 
@@ -223,7 +231,9 @@ translation_of: Web/SVG/Attribute/fill
  </tbody>
 </table>
 
-<p class="note"><strong>Note:</strong> <code>fill</code> étant un attribut de présentation, il peut être utilisé comme propriété CSS.</p>
+<div class="note">
+  <p><strong>Note :</strong> <code>fill</code> étant un attribut de présentation, il peut être utilisé comme propriété CSS.</p>
+</div>
 
 <h2 id="polygon">polygon</h2>
 
@@ -246,7 +256,9 @@ translation_of: Web/SVG/Attribute/fill
  </tbody>
 </table>
 
-<p class="note"><strong>Note:</strong> <code>fill</code> étant un attribut de présentation, il peut être utilisé comme propriété CSS.</p>
+<div class="note">
+  <p><strong>Note :</strong> <code>fill</code> étant un attribut de présentation, il peut être utilisé comme propriété CSS.</p>
+</div>
 
 <h2 id="polyline">polyline</h2>
 
@@ -269,7 +281,9 @@ translation_of: Web/SVG/Attribute/fill
  </tbody>
 </table>
 
-<p class="note"><strong>Note:</strong> <code>fill</code> étant un attribut de présentation, il peut être utilisé comme propriété CSS.</p>
+<div class="note">
+  <p><strong>Note :</strong> <code>fill</code> étant un attribut de présentation, il peut être utilisé comme propriété CSS.</p>
+</div>
 
 <h2 id="rect">rect</h2>
 
@@ -292,7 +306,9 @@ translation_of: Web/SVG/Attribute/fill
  </tbody>
 </table>
 
-<p class="note"><strong>Note:</strong> <code>fill</code> étant un attribut de présentation, il peut être utilisé comme propriété CSS.</p>
+<div class="note">
+  <p><strong>Note :</strong> <code>fill</code> étant un attribut de présentation, il peut être utilisé comme propriété CSS.</p>
+</div>
 
 <h2 id="set">set</h2>
 
@@ -336,7 +352,9 @@ translation_of: Web/SVG/Attribute/fill
  </tbody>
 </table>
 
-<p class="note"><strong>Note:</strong> <code>fill</code> étant un attribut de présentation, il peut être utilisé comme propriété CSS.</p>
+<div class="note">
+  <p><strong>Note :</strong> <code>fill</code> étant un attribut de présentation, il peut être utilisé comme propriété CSS.</p>
+</div>
 
 <h2 id="textPath">textPath</h2>
 
@@ -359,11 +377,15 @@ translation_of: Web/SVG/Attribute/fill
  </tbody>
 </table>
 
-<p class="note"><strong>Note:</strong> <code>fill</code> étant un attribut de présentation, il peut être utilisé comme propriété CSS.</p>
+<div class="note">
+  <p><strong>Note :</strong> <code>fill</code> étant un attribut de présentation, il peut être utilisé comme propriété CSS.</p>
+</div>
 
 <h2 id="tref">tref</h2>
 
-<p class="warning"><strong>Attention:</strong> {{SVGElement('tref')}} est déprécié en SVG2 et ne devrait pas être utilisé.</p>
+<div class="warning">
+  <p><strong>Attention :</strong> {{SVGElement('tref')}} est déprécié en SVG2 et ne devrait pas être utilisé.</p>
+</div>
 
 <p>Pour {{SVGElement('tref')}}, <code>fill</code> est un attribut de présentation qui définit la couleur du texte.</p>
 
@@ -384,7 +406,9 @@ translation_of: Web/SVG/Attribute/fill
  </tbody>
 </table>
 
-<p class="note"><strong>Note:</strong> <code>fill</code> étant un attribut de présentation, il peut être utilisé comme propriété CSS.</p>
+<div class="note">
+  <p><strong>Note :</strong> <code>fill</code> étant un attribut de présentation, il peut être utilisé comme propriété CSS.</p>
+</div>
 
 <h2 id="tspan">tspan</h2>
 
@@ -407,7 +431,9 @@ translation_of: Web/SVG/Attribute/fill
  </tbody>
 </table>
 
-<p class="note"><strong>Note:</strong> <code>fill</code> étant un attribut de présentation, il peut être utilisé comme propriété CSS.</p>
+<div class="note">
+  <p><strong>Note :</strong> <code>fill</code> étant un attribut de présentation, il peut être utilisé comme propriété CSS.</p>
+</div>
 
 <h2 id="Spécifications">Spécifications</h2>
 
@@ -429,7 +455,7 @@ translation_of: Web/SVG/Attribute/fill
    <td>{{SpecName("SVG2", "painting.html#FillProperty", "fill")}}</td>
    <td>{{Spec2("SVG2")}}</td>
    <td>Définition pour les formes et le texte.<br>
-    Ajoute <code style="white-space: nowrap;">context-fill</code> et <code style="white-space: nowrap;">context-stroke</code>.</td>
+    Ajoute <code>context-fill</code> et <code>context-stroke</code>.</td>
   </tr>
   <tr>
    <td>{{SpecName("SVG1.1", "animate.html#FillAttribute", "fill")}}</td>
@@ -444,8 +470,10 @@ translation_of: Web/SVG/Attribute/fill
  </tbody>
 </table>
 
-<h2 id="Browser_Compatibility" name="Browser_Compatibility">Compatibilité des navigateurs</h2>
+<h2 id="Browser_Compatibility">Compatibilité des navigateurs</h2>
 
 <p>{{Compat("svg.attributes.presentation.fill")}}</p>
 
-<p class="note"><strong>Note:</strong> Pour plus d'informations sur les valeurs de <code style="white-space: nowrap;">context-fill</code> (et <code style="white-space: nowrap;">context-stroke</code>) dans des documents HTML, voir la documentation pour la propriété non-standard <span style="white-space: nowrap;">{{cssxref("-moz-context-properties")}}</span>.</p>
+<div class="note">
+  <p><strong>Note :</strong> Pour plus d'informations sur les valeurs de <code>context-fill</code> (et <code>context-stroke</code>) dans des documents HTML, voir la documentation pour la propriété non-standard {{cssxref("-moz-context-properties")}}.</p>
+</div>