Fixes #2842 - Fixing EmbedLiveSample errors for fr docs (#2851)

* Fixes #2842 for CSS pages

* Fixes #2842 for Web API pages

* Fixes #2842 for other sections

* Fix EmbedLiveSample for moved CSS page

* Fixes #2842 for conflicting / orphaned docs

3 files changed, 0 insertions, 404 deletions

diff --git a/files/fr/orphaned/web/api/body/index.html b/files/fr/orphaned/web/api/body/index.html
deleted file mode 100644
index 89c70bbba0..0000000000
--- a/files/fr/orphaned/web/api/body/index.html
+++ /dev/null
@@ -1,97 +0,0 @@
----
-title: Body
-slug: orphaned/Web/API/Body
-tags:
-  - API
-  - BODY
-  - Experimental
-  - Fetch
-  - Fetch API
-  - Interface
-  - Reference
-  - TopicStub
-  - request
-translation_of: Web/API/Body
-original_slug: Web/API/Body
----
-<div>{{ APIRef("Fetch") }}</div>
-
-<p><span class="seoSummary">Le {{glossary("mixin")}} <strong><code>Body</code></strong> de l'<a href="/fr/docs/Web/API/Fetch_API">API Fetch</a> représente le corps de d'une requête ou d'une réponse, vous permettant de déclarer le type de son contenu et comment le manipuler.</span></p>
-
-<p><code>Body</code> est implémenté par {{domxref("Request")}} et {{domxref("Response")}}. Ces derniers fournissent un objet avec un un corps associé (un <a href="/fr/docs/Web/API/Streams_API">stream</a>), un drapeaux pour indiquer si le corps a déjà été utilisé (initialisé à faux), et un type MIME (au début, une séquence vide d'octet).</p>
-
-<h2 id="Propriétés">Propriétés</h2>
-
-<dl>
- <dt>{{domxref("Body.body")}} {{readonlyInline}}</dt>
- <dd>Un simple <em>getter</em> utilisé pour obtenir un {{domxref("ReadableStream")}} du contenu.</dd>
- <dt>{{domxref("Body.bodyUsed")}} {{readonlyInline}}</dt>
- <dd>Un {{jsxref("Boolean")}} qui indique si le corps a déjà été lu.</dd>
-</dl>
-
-<h2 id="Méthodes">Méthodes</h2>
-
-<dl>
- <dt>{{domxref("Body.arrayBuffer()")}}</dt>
- <dd>Prend un flux {{domxref("Response")}}, le lit en entier, et le retourne sous forme d'un {{jsxref("ArrayBuffer")}} au travers d'une promesse.</dd>
- <dt>{{domxref("Body.blob()")}}</dt>
- <dd>Prends un flux {{domxref("Response")}}, le lit en entier, et le retourne dans un {{domxref("Blob")}} au travers d'une promesse.</dd>
- <dt>{{domxref("Body.formData()")}}</dt>
- <dd>Prends un flux {{domxref("Response")}}, le lit en entier, et le retourne dans un objet {{domxref("FormData")}} au travers d'une promesse.</dd>
- <dt>{{domxref("Body.json()")}}</dt>
- <dd>Prends un flux {{domxref("Response")}}, le lit en entier et retourne une promesse résolue avec le résultat textuel interprété comme du {{jsxref("JSON")}}.</dd>
- <dt>{{domxref("Body.text()")}}</dt>
- <dd>Prend un flux {{domxref("Response")}}, le lit en entier, et le retourne dans une {{domxref("USVString")}} (texte) au travers d'une promesse. La réponse est <em>toujours</em> décodée en utilisant l'UTF-8.</dd>
-</dl>
-
-<h2 id="Exemples">Exemples</h2>
-
-<p>L'exemple suivant utilise un simple appel <code>fetch</code> pour récupérer une image et l'afficher dans un élément {{htmlelement("img")}}. Notez qu'une fois l'image téléchargée, nous devons appeler {{domxref("Body.blob","Body.blob()")}} ({{domxref("Response")}} implémente body) pour connaître le MIME type correcte.</p>
-
-<h3 id="Code_HTML">Code HTML</h3>
-
-<pre class="brush: html notranslate">&lt;img class="my-image" src="https://wikipedia.org/static/images/project-logos/frwiki-1.5x.png"&gt;
-</pre>
-
-<h3 id="Code_JavaScript">Code JavaScript</h3>
-
-<pre class="brush: js notranslate">const myImage = document.querySelector('.my-image');
-fetch('https://upload.wikimedia.org/wikipedia/commons/7/77/Delete_key1.jpg')
-	.then(res =&gt; res.blob())
-	.then(res =&gt; {
-		const objectURL = URL.createObjectURL(res);
-		myImage.src = objectURL;
-});</pre>
-
-<p>{{ EmbedLiveSample('Examples', '100%', '250px') }}</p>
-
-<h2 id="Spécifications">Spécifications</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Spécifications</th>
-   <th scope="col">Status</th>
-   <th scope="col">Commentaire</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('Fetch','#body-mixin','Body')}}</td>
-   <td>{{Spec2('Fetch')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2>
-
-
-
-<p>{{Compat("api.Body")}}</p>
-
-<h2 id="Voir_aussi">Voir aussi</h2>
-
-<ul>
- <li><a href="/fr/docs/Web/API/ServiceWorker_API">ServiceWorker API</a></li>
- <li><a href="/fr/docs/Web/HTTP/CORS">HTTP access control (CORS)</a></li>
- <li><a href="/fr/docs/Web/HTTP">HTTP</a></li>
-</ul>
diff --git a/files/fr/orphaned/web/api/body/json/index.html b/files/fr/orphaned/web/api/body/json/index.html
deleted file mode 100644
index 923ef65ebf..0000000000
--- a/files/fr/orphaned/web/api/body/json/index.html
+++ /dev/null
@@ -1,87 +0,0 @@
----
-title: Body.json()
-slug: orphaned/Web/API/Body/json
-tags:
-  - API
-  - BODY
-  - Experimental
-  - Fetch
-  - JSON
-  - Méthode
-  - Reference
-translation_of: Web/API/Body/json
-original_slug: Web/API/Body/json
----
-<div>{{APIRef("Fetch")}}</div>
-
-<p>La méthode <strong><code>json()</code></strong> de {{domxref("Body")}} lit un Stream {{domxref("Response")}} jusqu'au bout. Elle retourne une promesse qui s'auto-résout en renvoyant le corps de la requête parsée au format {{jsxref("JSON")}}.</p>
-
-<h2 id="Syntaxe">Syntaxe</h2>
-
-<pre class="brush: js">response.json().then(function(data) {
-  // faire quelque chose avec les données
-});</pre>
-
-<h3 id="Paramètres">Paramètres</h3>
-
-<p>Aucun.</p>
-
-<h3 id="Valeur_de_retour">Valeur de retour</h3>
-
-<p>Une promesse résolue contenant le corps de la requête (au format JSON) converti sous la forme d'un objet JavaScript. Cet objet peut correspondre à n'importe quel contenu représentable dans le format JSON -- un objet, un tableau, une chaîne de caractère, un nombre…</p>
-
-<h2 id="Exemple">Exemple</h2>
-
-<p>Dans l'exemple <a href="https://github.com/mdn/fetch-examples/tree/master/fetch-json">fetch json</a> (lancer <a href="http://mdn.github.io/fetch-examples/fetch-json/">cet exemple</a>), nous créons une nouvelle requête en utilisant le constructeur {{domxref("Request.Request", "Request()")}}, puis utilisons celle-ci pour récupérer un fichier <code>.json</code>. Lorsque l'appel à <strong>fetch </strong>réussit, on lit les données et on les parse en utilisant <code>json()</code> pour les convertir en un objet JS, puis enfin on utilise les valeurs de l'objet obtenu pour les insérer dans une liste de noeuds, de manière à afficher nos produits. </p>
-
-<pre>const myList = document.querySelector('ul');
-const myRequest = new Request('products.json');
-
-fetch(myRequest)
-  .then(response =&gt; response.json())
-  .then(data =&gt; {
-    for (const product of data.products) {
-      let listItem = document.createElement('li');
-      listItem.appendChild(
-        document.createElement('strong')
-      ).textContent = product.Name;
-      listItem.append(
-        ` can be found in ${
-          product.Location
-        }. Cost: `
-      );
-      listItem.appendChild(
-        document.createElement('strong')
-      ).textContent = `£${product.Price}`;
-      myList.appendChild(listItem);
-    }
-  });</pre>
-
-<h2 id="Spécifications">Spécifications</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Spécification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('Fetch','#dom-body-json','Body.json()')}}</td>
-   <td>{{Spec2('Fetch')}}</td>
-   <td>Définition initiale</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2>
-
-<p>{{Compat("api.Body.json")}}</p>
-
-<h2 id="Voir_aussi">Voir aussi</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/API/ServiceWorker_API">ServiceWorker API</a></li>
- <li><a href="/en-US/docs/Web/HTTP/Access_control_CORS">HTTP access control (CORS)</a></li>
- <li><a href="/en-US/docs/Web/HTTP">HTTP</a></li>
-</ul>
diff --git a/files/fr/orphaned/web/api/detecting_device_orientation/index.html b/files/fr/orphaned/web/api/detecting_device_orientation/index.html
deleted file mode 100644
index 42b8cec296..0000000000
--- a/files/fr/orphaned/web/api/detecting_device_orientation/index.html
+++ /dev/null
@@ -1,220 +0,0 @@
----
-title: Détecter l'orientation de l'appareil
-slug: orphaned/Web/API/Detecting_device_orientation
-tags:
-  - Device Orientation
-  - Firefox OS
-  - Mobile
-  - Motion
-  - Orientation
-translation_of: Web/API/Detecting_device_orientation
-original_slug: Web/API/Detecting_device_orientation
----
-<p>{{SeeCompatTable}}</p>
-
-<h2 id="Résumé">Résumé</h2>
-
-<p>De plus en plus d'appareils connectés à Internet sont capable de déterminer leur <strong>orientation</strong>. C'est-à-dire qu'ils peuvent fournir des données indiquant des changements dans leur orientation par rapport à la gravité. En particulier les appareils portables, comme les téléphones mobiles, peuvent utiliser cette information pour effectuer automatiquement une rotation de l'écran, afin de toujours proposer la meilleure disposition possible pour le contenu à afficher.</p>
-
-<p>Il existe deux événements JavaScript pour gérer l'orientation. Le premier est {{domxref("DeviceOrientationEvent")}}, qui est envoyé quand l'accéléromètre détecte un changement d'orientation de l'appareil. En recevant et en analysant les données fournies par ces événements d'orientation, il est possible de répondre de manière interactive aux changements d'orientation et d'élévation causés par les mouvements imprimés à l'appareil par l'utilisateur.</p>
-
-<p>Le second événement est {{ domxref("DeviceMotionEvent") }}, qui est envoyé quand un changement d’accélération est ajouté. Il est différent de {{domxref("DeviceOrientationEvent")}}, car il écoute les changements d'accélération par opposition à l'orientation. Parmi les capteurs capables de détecter {{ domxref("DeviceMotionEvent") }}, on trouve les capteurs des ordinateurs portables utilisés pour protéger des chutes les périphériques de stockage. Ils sont communément présents dans les appareils mobiles (tablettes, téléphones intelligents).</p>
-
-<h2 id="Traitement_des_événements_d'orientation">Traitement des événements d'orientation</h2>
-
-<p>Tout ce dont vous avez besoin pour commencer à recevoir les changements d'orientation est d’écouter l’événement {{ event("deviceorientation") }} :</p>
-
-<div class="note">
-<p><strong>Note</strong>: <a href="https://github.com/dorukeker/gyronorm.js">gyronorm.js</a> est un polyfill <span id="result_box" lang="fr"><span>pour normaliser les données de l'accéléromètre et du gyroscope sur les appareils mobiles.</span> C'<span>est utile pour surmonter certaines différences dans la prise en charge des périphériques pour l'orientation du périphérique.</span></span></p>
-</div>
-
-<pre class="brush: js">window.addEventListener("deviceorientation", handleOrientation, true);
-</pre>
-
-<p>Après l’enregistrement de votre gestionnaire d'événements (<em>event listener</em> en anglais), dans ce cas, une fonction JS appelée handleOrientation(), votre fonction d'écoute est appelée périodiquement pour récupérer les données de l'orientation mise à jour.</p>
-
-<p>L'événement d'orientation contient quatre valeurs ::</p>
-
-<ul>
- <li>{{domxref("DeviceOrientationEvent.absolute")}}</li>
- <li>{{domxref("DeviceOrientationEvent.alpha")}}</li>
- <li>{{domxref("DeviceOrientationEvent.beta")}}</li>
- <li>{{domxref("DeviceOrientationEvent.gamma")}}</li>
-</ul>
-
-<p>La fonction gérant l’événement pourrait ressembler à ceci :</p>
-
-<pre class="brush: js">function handleOrientation(event) {
-  var absolute = event.absolute;
-  var alpha    = event.alpha;
-  var beta     = event.beta;
-  var gamma    = event.gamma;
-
-  // Faites quelque chose avec les données acquises. ;)
-}
-</pre>
-
-<h3 id="Détail_des_valeurs_d'orientation">Détail des valeurs d'orientation</h3>
-
-<p>La valeur reportée pour chaque axe indique l'angle de rotation autour d'un axe donné, en référence à un système de coordonnées standard. Ces valeurs sont décrites de façon plus détaillée dans cet article <a href="/en-US/DOM/Orientation_and_motion_data_explained" title="Orientation et déplacement expliquée">Orientation et déplacement expliquée</a>.</p>
-
-<ul>
- <li>La valeur {{ domxref("DeviceOrientationEvent.alpha") }} représente le mouvement de l'appareil, autour de l'axe « z », en degrés sur une échelle de 0° à 360° ;</li>
- <li>La valeur {{ domxref("DeviceOrientationEvent.beta") }} représente le mouvement de l'appareil autour de l'axe « y » en degrés, sur une échelle de -180° à 180°.  Cela représente le mouvement d'avant en arrière de l'appareil ;</li>
- <li>La valeur {{ domxref("DeviceOrientationEvent.gamma") }} représente le mouvement de l'appareil autour de l'axe « x », exprimée en degrés sur une échelle de -90° à 90°. Cela représente le mouvement de gauche à droite de l'appareil.</li>
-</ul>
-
-<h3 id="Exemple_d'orientation">Exemple d'orientation</h3>
-
-<p>Cet exemple fonctionne sur tout navigateur supportant l’événement {{event("deviceorientation")}} et sur tout appareil capable de détecter son orientation.</p>
-
-<p>Imaginons une balle dans un jardin :</p>
-
-<pre class="brush: html">&lt;div class="jardin"&gt;
-  &lt;div class="balle"&gt;&lt;/div&gt;
-&lt;/div&gt;
-
-&lt;pre class="resultat"&gt;&lt;/pre&gt;
-</pre>
-
-<p>Ce jardin fait 200 pixels de long (Oui c'est un « petit » jardin !), et la balle est au centre :</p>
-
-<pre class="brush: css">.jardin {
-  position: relative;
-  width : 200px;
-  height: 200px;
-  border: 5px solid #CCC;
-  border-radius: 10px;
-}
-
-.balle {
-  position: absolute;
-  top   : 90px;
-  left  : 90px;
-  width : 20px;
-  height: 20px;
-  background: green;
-  border-radius: 100%;
-}
-</pre>
-
-<p>Maintenant, on définit le déplacement de la balle en fonction de celui de l'appareil :</p>
-
-<pre class="brush: js">var jardin = document.querySelector('.jardin'),
-    balle = document.querySelector('.balle'),
-    resultat = document.querySelector('.resultat'),
-    maxX = jardin.clientWidth  - balle.clientWidth,
-    maxY = jardin.clientHeight - balle.clientHeight;
-
-function handleOrientation(event) {
-  var x = event.beta,  // En degré sur l'interval [-180,180].
-      y = event.gamma; // En degré sur l'interval [-90,90].
-
-  resultat.innerHTML  = "beta : " + x + "&lt;br /&gt;";
-  resultat.innerHTML += "gamma: " + y + "&lt;br /&gt;";
-
-  // Parce-que l'on ne veut pas avoir l'appareil à l'envers.
-  // On restreint les valeurs de x à l'intervalle [-90,90].
-  if (x &gt;  90) { x =  90};
-  if (x &lt; -90) { x = -90};
-  // Pour rendre le calcul plus simple.
-  // On délimite l'intervalle de x et y sur [0, 180].
-  x += 90;
-  y += 90;
-
-  // 10 est la moitié de la taille de la balle.
-  // Cela centre le point de positionnement au centre de la balle.
-
-  balle.style.top  = (maxX * x / 180 - 10) + "px";
-  balle.style.left = (maxY * y / 180 - 10) + "px";
-}
-
-window.addEventListener('deviceorientation', handleOrientation);
-</pre>
-
-<p>Et voici le résultat en temps réel :</p>
-
-<div>{{EmbedLiveSample("Exemple_d'orientation", '230', '260')}}</div>
-
-<div> </div>
-
-<div>{{LiveSampleLink("Exemple_d'orientation", "Cliquez ici")}} pour ouvrir cet exemple dans une nouvelle fenêtre;  l'événement {{event("deviceorientation")}} ne marche pas dans les {{HTMLElement("iframe", "iframes")}} cross-origin dans tous les navigateurs.</div>
-
-<div> </div>
-
-<div class="warning">
-<p><strong>Attention :</strong> Chrome et Firefox ne gèrent pas les angles de la même façon, certaines directions sur les axes sont inversées.</p>
-</div>
-
-<h2 id="Traiter_les_événement_de_mouvement">Traiter les événement de mouvement</h2>
-
-<p>Les événements de mouvement gèrent l'orientation de la même façon à l'exception près qu’ils portent un nom d’événement différent : {{event("devicemotion")}}</p>
-
-<pre class="brush: js">window.addEventListener("devicemotion", <em>handleMotion</em>, true);
-</pre>
-
-<p>Ce qui change réellement est l'information fournie par l'objet {{ domxref("DeviceMotionEvent") }} passée comme paramètre par la fonction <em>HandleMotion</em>.</p>
-
-<p>Les événements de mouvement contiennent quatre propriétés :</p>
-
-<ul>
- <li>{{domxref("DeviceMotionEvent.acceleration")}}</li>
- <li>{{domxref("DeviceMotionEvent.accelerationIncludingGravity")}}</li>
- <li>{{domxref("DeviceMotionEvent.rotationRate")}}</li>
- <li>{{domxref("DeviceMotionEvent.interval")}}</li>
-</ul>
-
-<h3 id="Explication_des_valeurs_de_mouvement">Explication des valeurs de mouvement</h3>
-
-<p>L'objet {{ domxref("DeviceMotionEvent") }} fourni aux développeurs Web des informations sur la vitesse de changement d'orientation et de position de l'appareil. Les changements rapportés sont fournis pour les trois axes (voir <a href="/en-US/docs/Web/Guide/DOM/Events/Orientation_and_motion_data_explained" title="/en-US/docs/Web/Guide/DOM/Events/Orientation_and_motion_data_explained">Orientation et déplacement expliquées</a> pour les détails).</p>
-
-<p>Pour {{domxref("DeviceMotionEvent.acceleration","acceleration")}} et {{domxref("DeviceMotionEvent.accelerationIncludingGravity","accelerationIncludingGravity")}}, Les axes correspondent à :</p>
-
-<ul>
- <li><code>x</code> : représente l'axe d'Ouest en Est ;</li>
- <li><code>y</code> : représente l'axe Sud vers Nord :</li>
- <li><code>z</code> : représente l'axe perpendiculaire au sol.</li>
-</ul>
-
-<p>Pour {{domxref("DeviceMotionEvent.rotationRate","rotationRate")}}, c'est un peu différent. L'information correspond à :</p>
-
-<ul>
- <li><code>alpha</code> : représente le ratio de rotation le long de l'axe perpendiculaire à l'écran (ou du clavier au bureau) ;</li>
- <li><code>bêta</code> : représente le ratio de rotation le long de l'axe allant de la gauche vers la droite de l'écran (ou du clavier au bureau) ;</li>
- <li><code>gamma</code> : représente le ratio de rotation le long de l'axe allant du bas vers le haut de l'écran (ou clavier vers le bureau).</li>
-</ul>
-
-<p>Au final, {{domxref("DeviceMotionEvent.interval","interval")}} représente l'intervalle de temps, en millisecondes, pour les données générées par l'appareil.</p>
-
-<h2 id="Spécifications">Spécifications</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Spécification</th>
-   <th scope="col">Statut</th>
-   <th scope="col">Commentaires</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('Device Orientation')}}</td>
-   <td>{{Spec2('Device Orientation')}}</td>
-   <td>Spécification initiale.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2>
-
-<p>{{Compat("api.DeviceOrientationEvent")}}</p>
-
-<h2 id="Voir_aussi">Voir aussi</h2>
-
-<ul>
- <li>{{domxref("DeviceOrientationEvent")}}</li>
- <li>{{domxref("DeviceMotionEvent")}}</li>
- <li>The legacy <code><a href="/en-US/DOM/MozOrientation" title="en-US/DOM/MozOrientation">MozOrientation</a></code> event.</li>
- <li><a href="/en-US/docs/Web/Guide/DOM/Events/Orientation_and_motion_data_explained" title="Orientation and motion data explained">Orientation and motion data explained</a></li>
- <li><a href="/en-US/docs/Web/Guide/DOM/Events/Using_device_orientation_with_3D_transforms" title="Using Deviceorientation In 3D Transforms">Using deviceorientation in 3D Transforms</a></li>
-</ul>