Merge branch 'main' into ja/prettier/mozilla/add-ons

.prettierignore

@@ -39,13 +39,10 @@ build/
 /files/es/web/javascript/reference/**/*.md
 
 # fr
-/files/fr/web/css/**/*.md
 /files/fr/web/javascript/**/*.md
 
 # ja
-/files/ja/learn/css/**/*.md
 /files/ja/learn/javascript/**/*.md
-/files/ja/learn/server-side/**/*.md
 /files/ja/mdn/**/*.md
 /files/ja/web/api/**/*.md
 /files/ja/web/css/**/*.md

files/fr/web/css/_colon_-moz-broken/index.md

@@ -13,7 +13,8 @@ Ce sélecteur est principalement destiné à être utilisé par les développeur
 ## Syntaxe
 
 ```css
-:-moz-broken {}
+:-moz-broken {
+}
 ```
 
 ## Exemples

files/fr/web/css/_colon_-moz-loading/index.md

@@ -13,7 +13,8 @@ Cette pseudo-classe est principalement destinée aux développeurs de thèmes.
 ## Syntaxe
 
 ```css
-:-moz-loading {}
+:-moz-loading {
+}
 ```
 
 ## Exemples

files/fr/web/css/_colon_-moz-submit-invalid/index.md

@@ -13,7 +13,8 @@ Par défaut, aucun style n'est appliqué. Vous pouvez utiliser cette pseudo-clas
 ## Syntaxe
 
 ```css
-:-moz-submit-invalid {}
+:-moz-submit-invalid {
+}
 ```
 
 ## Spécifications

files/fr/web/css/_colon_-moz-suppressed/index.md

@@ -13,7 +13,8 @@ Ce sélecteur est principalement destiné aux développeurs de thèmes.
 ## Syntaxe
 
 ```css
-:-moz-suppressed {}
+:-moz-suppressed {
+}
 ```
 
 ## Exemple

files/fr/web/css/_colon_-moz-user-disabled/index.md

@@ -13,7 +13,8 @@ Ce sélecteur est destiné principalement à une utilisation par les développeu
 ## Syntaxe
 
 ```css
-:-moz-user-disabled {}
+:-moz-user-disabled {
+}
 ```
 
 ## Exemples

files/fr/web/css/_colon_focus-visible/index.md

@@ -15,7 +15,8 @@ On notera que Firefox prend en charge cette fonctionnalité via une ancienne pse
 ## Syntaxe
 
 ```css
-:focus-visible {}
+:focus-visible {
+}
 ```
 
 ## Exemples

files/fr/web/css/_colon_has/index.md

@@ -34,13 +34,15 @@ var test = document.querySelector("a:has(> img)");
 Dans l'exemple suivant, le sélecteur permet de cibler uniquement les éléments {{HTMLElement("a")}} qui contiennent un fils direct {{HTMLElement("img")}} :
 
 ```css
-a:has(> img) {}
+a:has(> img) {
+}
 ```
 
 Le sélecteur qui suit correspond aux éléments {{HTMLElement("h1")}} qui précèdent directement un élément {{HTMLElement("p")}} :
 
 ```css
-h1:has(+ p) {}
+h1:has(+ p) {
+}
 ```
 
 ## Spécifications

files/fr/web/css/_colon_host-context/index.md

@@ -41,8 +41,9 @@ p {
 
 ## Syntaxe
 
-```css
-:host-context( <selecteur-composite> ) {}
+```css-nolint
+:host-context(<selecteur-composite>) {
+}
 ```
 
 ## Exemples

files/fr/web/css/_colon_is/index.md

@@ -317,7 +317,8 @@ L'exemple ci-dessus ne sera pas appliqué par les navigateurs qui ne prennent pa
 Ainsi :
 
 ```css
-.a > :-moz-any(.b, .c) {}
+.a > :-moz-any(.b, .c) {
+}
 ```
 
 sera plus lent que

files/fr/web/css/_colon_not/index.md

@@ -64,9 +64,7 @@ body :not(.classy, p) {
 ```html
 <p>Un peu de texte.</p>
 <p class="classy">Encore du texte.</p>
-<span>
-  Et toujours du texte.
-</span>
+<span> Et toujours du texte. </span>
 ```
 
 ### Résultat

files/fr/web/css/_doublecolon_grammar-error/index.md

@@ -30,7 +30,8 @@ Seul un sous-ensemble restreint de propriétés CSS peut être utilisé dans une
 ## Syntaxe
 
 ```css
-::grammar-error {}
+::grammar-error {
+}
 ```
 
 ## Exemples

files/fr/web/css/_doublecolon_spelling-error/index.md

@@ -30,7 +30,8 @@ Seul un sous-ensemble restreint de propriétés CSS peut être utilisé dans une
 ## Syntaxe
 
 ```css
-::spelling-error {}
+::spelling-error {
+}
 ```
 
 ## Exemples

files/fr/web/css/counter/index.md

@@ -61,7 +61,8 @@ li {
   counter-increment: listCounter;
 }
 li::after {
-  content: "[" counter(listCounter) "] == [" counter(listCounter, upper-roman) "]";
+  content: "[" counter(listCounter) "] == [" counter(listCounter, upper-roman)
+    "]";
 }
 ```
 

files/fr/web/css/pointer-events/index.md

@@ -106,7 +106,8 @@ Dans l'exemple qui suit, on désactive les événements de pointeur pour le lien
 #### CSS
 
 ```css
-a[href="http://example.com"] {
+a[href="http://example.com"]
+{
   pointer-events: none;
 }
 ```

files/ja/learn/css/building_blocks/advanced_styling_effects/index.md

@@ -23,7 +23,10 @@ slug: Learn/CSS/Building_blocks/Advanced_styling_effects
 
 ```html
 <article class="simple">
-  <p><strong>Warning</strong>: The thermostat on the cosmic transcender has reached a critical level.</p>
+  <p>
+    <strong>Warning</strong>: The thermostat on the cosmic transcender has
+    reached a critical level.
+  </p>
 </article>
 ```
 
@@ -38,11 +41,15 @@ article {
   max-width: 500px;
   padding: 10px;
   background-color: red;
-  background-image: linear-gradient(to bottom, rgba(0,0,0,0), rgba(0,0,0,0.25));
+  background-image: linear-gradient(
+    to bottom,
+    rgba(0, 0, 0, 0),
+    rgba(0, 0, 0, 0.25)
+  );
 }
 
 .simple {
-  box-shadow: 5px 5px 5px rgba(0,0,0,0.7);
+  box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.7);
 }
 ```
 
@@ -65,7 +72,10 @@ article {
 
 ```html hidden
 <article class="multiple">
-  <p><strong>Warning</strong>: The thermostat on the cosmic transcender has reached a critical level.</p>
+  <p>
+    <strong>Warning</strong>: The thermostat on the cosmic transcender has
+    reached a critical level.
+  </p>
 </article>
 ```
 
@@ -78,16 +88,21 @@ article {
   max-width: 500px;
   padding: 10px;
   background-color: red;
-  background-image: linear-gradient(to bottom, rgba(0,0,0,0), rgba(0,0,0,0.25));
+  background-image: linear-gradient(
+    to bottom,
+    rgba(0, 0, 0, 0),
+    rgba(0, 0, 0, 0.25)
+  );
 }
 
 .multiple {
-  box-shadow: 1px 1px 1px black,
-              2px 2px 1px black,
-              3px 3px 1px red,
-              4px 4px 1px red,
-              5px 5px 1px black,
-              6px 6px 1px black;
+  box-shadow:
+    1px 1px 1px black,
+    2px 2px 1px black,
+    3px 3px 1px red,
+    4px 4px 1px red,
+    5px 5px 1px black,
+    6px 6px 1px black;
 }
 ```
 
@@ -115,19 +130,22 @@ button {
   border-radius: 10px;
   border: none;
   background-image: linear-gradient(to bottom right, #777, #ddd);
-  box-shadow: 1px 1px 1px black,
-              inset 2px 3px 5px rgba(0,0,0,0.3),
-              inset -2px -3px 5px rgba(255,255,255,0.5);
+  box-shadow:
+    1px 1px 1px black,
+    inset 2px 3px 5px rgba(0, 0, 0, 0.3),
+    inset -2px -3px 5px rgba(255, 255, 255, 0.5);
 }
 
-button:focus, button:hover {
+button:focus,
+button:hover {
   background-image: linear-gradient(to bottom right, #888, #eee);
 }
 
 button:active {
-  box-shadow: inset 2px 2px 1px black,
-              inset 2px 3px 5px rgba(0,0,0,0.3),
-              inset -2px -3px 5px rgba(255,255,255,0.5);
+  box-shadow:
+    inset 2px 2px 1px black,
+    inset 2px 3px 5px rgba(0, 0, 0, 0.3),
+    inset -2px -3px 5px rgba(255, 255, 255, 0.5);
 }
 ```
 
@@ -166,12 +184,12 @@ p {
 }
 
 .filter {
-  -webkit-filter: drop-shadow(5px 5px 1px rgba(0,0,0,0.7));
-  filter: drop-shadow(5px 5px 1px rgba(0,0,0,0.7));
+  -webkit-filter: drop-shadow(5px 5px 1px rgba(0, 0, 0, 0.7));
+  filter: drop-shadow(5px 5px 1px rgba(0, 0, 0, 0.7));
 }
 
 .box-shadow {
-  box-shadow: 5px 5px 1px rgba(0,0,0,0.7);
+  box-shadow: 5px 5px 1px rgba(0, 0, 0, 0.7);
 }
 ```
 
@@ -208,10 +226,8 @@ CSS でブレンドモードを使用する次の 2 つのプロパティがあ
 ここでも、これをよりよく理解できるように、いくつかの例を見てみましょう。 まず、{{cssxref("background-blend-mode")}} です — ここでは次のいくつかの簡単な {{htmlelement("div")}} を示すことで、オリジナルとブレンドバージョンを比較できます。
 
 ```html
-<div>
-</div>
-<div class="multiply">
-</div>
+<div></div>
+<div class="multiply"></div>
 ```
 
 次にいくつかの CSS です — `<div>` に 1 つの背景画像と緑色の背景色を追加しています。
@@ -243,20 +259,14 @@ div {
 ```html
 <article>
   No mix blend mode
-  <div>
-
-  </div>
-  <div>
-  </div>
+  <div></div>
+  <div></div>
 </article>
 
 <article>
   Multiply mix
-  <div class="multiply-mix">
-
-  </div>
-  <div>
-  </div>
+  <div class="multiply-mix"></div>
+  <div></div>
 </article>
 ```
 
@@ -331,13 +341,24 @@ article div:last-child {
 間違えた場合は、_Reset_ ボタンを使用して例をいつでもリセットできます。
 
 ```html hidden
-<div class="body-wrapper" style="font-family: 'Open Sans Light',Helvetica,Arial,sans-serif;">
+<div
+  class="body-wrapper"
+  style="font-family: 'Open Sans Light',Helvetica,Arial,sans-serif;">
   <h2>HTML Input</h2>
-  <textarea id="code" class="html-input" style="width: 90%;height: 10em;padding: 10px;border: 1px solid #0095dd;"><div class="style-me">
-</div></textarea>
+  <textarea
+    id="code"
+    class="html-input"
+    style="width: 90%;height: 10em;padding: 10px;border: 1px solid #0095dd;">
+<div class="style-me">
+</div></textarea
+  >
 
   <h2>CSS Input</h2>
-  <textarea id="code" class="css-input" style="width: 90%;height: 10em;padding: 10px;border: 1px solid #0095dd;">.style-me {
+  <textarea
+    id="code"
+    class="css-input"
+    style="width: 90%;height: 10em;padding: 10px;border: 1px solid #0095dd;">
+.style-me {
   width: 280px;
   height: 130px;
   padding: 10px;
@@ -346,12 +367,19 @@ article div:last-child {
   background-color: red;
   background: url(colorful-heart.png) no-repeat center 20px,
               linear-gradient(to bottom right, #f33, #a33);
-} </textarea>
+} </textarea
+  >
 
   <h2>Output</h2>
-  <div class="output" style="width: 90%;height: 15em;padding: 10px;border: 1px solid #0095dd;overflow:hidden;"></div>
+  <div
+    class="output"
+    style="width: 90%;height: 15em;padding: 10px;border: 1px solid #0095dd;overflow:hidden;"></div>
   <div class="controls">
-    <input id="reset" type="button" value="Reset" style="margin: 10px 10px 0 0;">
+    <input
+      id="reset"
+      type="button"
+      value="Reset"
+      style="margin: 10px 10px 0 0;" />
   </div>
 </div>
 ```
@@ -364,16 +392,16 @@ var htmlCode = htmlInput.value;
 var cssCode = cssInput.value;
 var output = document.querySelector(".output");
 
-var styleElem = document.createElement('style');
-var headElem = document.querySelector('head');
+var styleElem = document.createElement("style");
+var headElem = document.querySelector("head");
 headElem.appendChild(styleElem);
 
 function drawOutput() {
   output.innerHTML = htmlInput.value;
   styleElem.textContent = cssInput.value;
 }
 
-reset.addEventListener("click", function() {
+reset.addEventListener("click", function () {
   htmlInput.value = htmlCode;
   cssInput.value = cssCode;
   drawOutput();