chore(i18n,learn): processed translations (#54675)

2026-10-16 07:29:52 +08:00 · 2024-05-06 12:10:34 -05:00
parent 7606a05ca7
commit 1b26016c0e
40 changed files with 121 additions and 121 deletions
@@ -23,19 +23,19 @@ You should access the `innerHTML` of `authorContainer` and set it to a `p` eleme


 ```js
-assert.match(code, /authorContainer\.innerHTML\s*=\s*(`|"|')<p.*>.*<\/p>\1/)
+assert.match(code, /authorContainer\.innerHTML\s*=\s*(`|"|')\s*<p.*>.*<\/p>\s*\1/)
 ```

 Your `p` element should have the class `error-msg`.

 ```js
-assert.match(code, /(`|"|')<p\s+class\s*=\s*("|')error-msg\2>/)
+assert.match(code, /(`|"|')\s*<p\s+class\s*=\s*("|')error-msg\2>/)
 ```

 Your `p` element should have the text `There was an error loading the authors`.

 ```js
-assert.match(code, /(`|"|')<p\s+class\s*=\s*("|')error-msg\2>There\s+was\s+an\s+error\s+loading\s+the\s+authors<\/p>\1\s*;?/)
+assert.match(code, /(`|"|')<p\s+class\s*=\s*("|')error-msg\2>There\s+was\s+an\s+error\s+loading\s+the\s+authors<\/p>\s*\1\s*;?/)
 ```


@@ -23,19 +23,19 @@ You should access the `innerHTML` of `authorContainer` and set it to a `p` eleme


 ```js
-assert.match(code, /authorContainer\.innerHTML\s*=\s*(`|"|')<p.*>.*<\/p>\1/)
+assert.match(code, /authorContainer\.innerHTML\s*=\s*(`|"|')\s*<p.*>.*<\/p>\s*\1/)
 ```

 Your `p` element should have the class `error-msg`.

 ```js
-assert.match(code, /(`|"|')<p\s+class\s*=\s*("|')error-msg\2>/)
+assert.match(code, /(`|"|')\s*<p\s+class\s*=\s*("|')error-msg\2>/)
 ```

 Your `p` element should have the text `There was an error loading the authors`.

 ```js
-assert.match(code, /(`|"|')<p\s+class\s*=\s*("|')error-msg\2>There\s+was\s+an\s+error\s+loading\s+the\s+authors<\/p>\1\s*;?/)
+assert.match(code, /(`|"|')<p\s+class\s*=\s*("|')error-msg\2>There\s+was\s+an\s+error\s+loading\s+the\s+authors<\/p>\s*\1\s*;?/)
 ```


@@ -23,19 +23,19 @@ You should access the `innerHTML` of `authorContainer` and set it to a `p` eleme


 ```js
-assert.match(code, /authorContainer\.innerHTML\s*=\s*(`|"|')<p.*>.*<\/p>\1/)
+assert.match(code, /authorContainer\.innerHTML\s*=\s*(`|"|')\s*<p.*>.*<\/p>\s*\1/)
 ```

 Your `p` element should have the class `error-msg`.

 ```js
-assert.match(code, /(`|"|')<p\s+class\s*=\s*("|')error-msg\2>/)
+assert.match(code, /(`|"|')\s*<p\s+class\s*=\s*("|')error-msg\2>/)
 ```

 Your `p` element should have the text `There was an error loading the authors`.

 ```js
-assert.match(code, /(`|"|')<p\s+class\s*=\s*("|')error-msg\2>There\s+was\s+an\s+error\s+loading\s+the\s+authors<\/p>\1\s*;?/)
+assert.match(code, /(`|"|')<p\s+class\s*=\s*("|')error-msg\2>There\s+was\s+an\s+error\s+loading\s+the\s+authors<\/p>\s*\1\s*;?/)
 ```


@@ -23,19 +23,19 @@ You should access the `innerHTML` of `authorContainer` and set it to a `p` eleme


 ```js
-assert.match(code, /authorContainer\.innerHTML\s*=\s*(`|"|')<p.*>.*<\/p>\1/)
+assert.match(code, /authorContainer\.innerHTML\s*=\s*(`|"|')\s*<p.*>.*<\/p>\s*\1/)
 ```

 Your `p` element should have the class `error-msg`.

 ```js
-assert.match(code, /(`|"|')<p\s+class\s*=\s*("|')error-msg\2>/)
+assert.match(code, /(`|"|')\s*<p\s+class\s*=\s*("|')error-msg\2>/)
 ```

 Your `p` element should have the text `There was an error loading the authors`.

 ```js
-assert.match(code, /(`|"|')<p\s+class\s*=\s*("|')error-msg\2>There\s+was\s+an\s+error\s+loading\s+the\s+authors<\/p>\1\s*;?/)
+assert.match(code, /(`|"|')<p\s+class\s*=\s*("|')error-msg\2>There\s+was\s+an\s+error\s+loading\s+the\s+authors<\/p>\s*\1\s*;?/)
 ```


@@ -30,7 +30,7 @@ To implement server auto restarting on file save Node provides the `--watch` fla

 # --instructions--

-Ändere die `myApp.js`-Datei, um "Hello World" auf der Konsole zu protokollieren.
+Modify the `myApp.js` file to log "Hello World" to the console.

 # --hints--

@@ -23,19 +23,19 @@ Du solltest auf das `innerHTML` von `authorContainer` zugreifen und es zu einem


 ```js
-assert.match(code, /authorContainer\.innerHTML\s*=\s*(`|"|')<p.*>.*<\/p>\1/)
+assert.match(code, /authorContainer\.innerHTML\s*=\s*(`|"|')\s*<p.*>.*<\/p>\s*\1/)
 ```

 Dein `p`-Element sollte die Klasse `error-msg` enthalten.

 ```js
-assert.match(code, /(`|"|')<p\s+class\s*=\s*("|')error-msg\2>/)
+assert.match(code, /(`|"|')\s*<p\s+class\s*=\s*("|')error-msg\2>/)
 ```

 Dein `p`-Element sollte den Text `There was an error loading the authors` enthalten.

 ```js
-assert.match(code, /(`|"|')<p\s+class\s*=\s*("|')error-msg\2>There\s+was\s+an\s+error\s+loading\s+the\s+authors<\/p>\1\s*;?/)
+assert.match(code, /(`|"|')<p\s+class\s*=\s*("|')error-msg\2>There\s+was\s+an\s+error\s+loading\s+the\s+authors<\/p>\s*\1\s*;?/)
 ```


@@ -23,19 +23,19 @@ Dovresti accedere all'`innerHTML` di `authorContainer` e impostarlo su un elemen


 ```js
-assert.match(code, /authorContainer\.innerHTML\s*=\s*(`|"|')<p.*>.*<\/p>\1/)
+assert.match(code, /authorContainer\.innerHTML\s*=\s*(`|"|')\s*<p.*>.*<\/p>\s*\1/)
 ```

 L'elemento `p` dovrebbe avere la classe `error-msg`.

 ```js
-assert.match(code, /(`|"|')<p\s+class\s*=\s*("|')error-msg\2>/)
+assert.match(code, /(`|"|')\s*<p\s+class\s*=\s*("|')error-msg\2>/)
 ```

 L'elemento `p` dovrebbe avere il testo `There was an error loading the authors`.

 ```js
-assert.match(code, /(`|"|')<p\s+class\s*=\s*("|')error-msg\2>There\s+was\s+an\s+error\s+loading\s+the\s+authors<\/p>\1\s*;?/)
+assert.match(code, /(`|"|')<p\s+class\s*=\s*("|')error-msg\2>There\s+was\s+an\s+error\s+loading\s+the\s+authors<\/p>\s*\1\s*;?/)
 ```


@@ -19,7 +19,7 @@ dashedName: override-styles-in-subsequent-css

 `h1` 要素に対し、`pink-text` クラスに加えて `blue-text` クラスも適用して、どちらが勝つか見てみましょう。

-Applying multiple class attributes to an HTML element is done with a space between them like this:
+1 つの HTML 要素に複数のクラス属性を適用するために、以下のようにスペースで属性を区切ります。

 ```html
 class="class1 class2"
@@ -33,7 +33,7 @@ dashedName: turn-an-image-into-a-link
 assert($('a').children('img').length > 0);
 ```

-Your `a` element should be a dead link with an `href` attribute set to `#`.
+`a` 要素は、`href` 属性が `#` に設定された、無効なリンクであるべきです。

 ```js
 assert(new RegExp('#').test($('a').children('img').parent().attr('href')));
@@ -7,9 +7,9 @@ dashedName: step-22

 # --description--

-重要度が同じ要素の水平方向の間隔によって、テキストが読みやすくなります。
+重要度が同じ要素に水平方向の間隔を上手く使うと、テキストが読みやすくなります。

-Wrap the text `2/3 cup (55g)` in a `span` element.
+まず `2/3 cup (55g)` というテキストを `span` 要素で囲みましょう。

 # --hints--

@@ -7,17 +7,17 @@ dashedName: step-23

 # --description--

-Now we can add the horizontal spacing using `flex`. In your `p` selector, add a `display` property set to `flex` and a `justify-content` property set to `space-between`.
+それでは `flex` を使って水平方向の間隔を追加します。 `p` セレクターの中に、`display` プロパティを追加して `flex` に設定してください。そして `justify-content` プロパティを `space-between` に設定してください。

 # --hints--

-Your `p` selector should have a `display` property set to `flex`.
+`p` セレクターの `display` プロパティを `flex` に設定する必要があります。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('p')?.display === 'flex');
 ```

-Your `p` selector should have a `justify-content` property set to `space-between`.
+`p` セレクターの `justify-content` プロパティを `space-between` に設定する必要があります。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('p')?.justifyContent === 'space-between');
@@ -7,7 +7,7 @@ dashedName: step-26

 # --description--

-Create a new `div` element below your `header` element, and give it a `class` attribute set to `divider large`.
+`header` 要素の下に新しく `div` 要素を作成して、その `class` 属性を `divider large` に設定してください。

 # --hints--

@@ -23,7 +23,7 @@ assert(document.querySelectorAll('div')?.length === 3);
 assert(document.querySelector('.label')?.lastElementChild?.localName === 'div');
 ```

-Your new `div` element should have the `class` attribute set to `divider large`.
+新しく追加した `div` 要素の `class` 属性を `divider large` に設定してください。

 ```js
 const div = document.querySelector('.label')?.lastElementChild;
@@ -7,29 +7,29 @@ dashedName: step-27

 # --description--

-Create a new `.large` selector and give it a `height` property set to `10px`. Also create an `.large, .medium` selector and set the `background-color` property to `black`.
+新しく `.large` セレクターを作成して、`height` プロパティを `10px` に設定してください。 さらに `.large, .medium` セレクターも作成して、`background-color` プロパティを `black` に設定してください。

 # --hints--

-You should have a new `.large` selector.
+新しく `.large` セレクターが必要です。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.large'));
 ```

-Your `.large` selector should have a `height` property set to `10px`.
+`.large` セレクターの `height` プロパティを `10px` に設定する必要があります。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.large')?.height === '10px');
 ```

-You should have a new `.large, .medium` selector.
+新しく `.large, .medium` セレクターが必要です。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.large, .medium'));
 ```

-Your `.large, .medium` selector should have a `background-color` property set to `black`.
+`.large, .medium` セレクターの `background-color` プロパティを `black` に設定する必要があります。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.large, .medium')?.backgroundColor === 'black');
@@ -7,13 +7,13 @@ dashedName: step-28

 # --description--

-You may notice there is still a small border at the bottom of your `.large` element. To reset this, give your `.large, .medium` selector a `border` property set to `0`.
+`.large` 要素の下端に、まだ細い境界線があることに気が付くかもしれません。 これをリセットするには、`.large, .medium` セレクターの `border` プロパティを `0` に設定してください。

-Note: the `medium`(medium) class will be utilized later for the thinner bars of the nutrition label.
+注: `medium`(medium) クラスは、後ほど栄養成分表示ラベルの細いバーに利用されます。

 # --hints--

-Your `.large, .medium` selector should have a `border` property set to `0`.
+`.large, .medium` セレクターの `border` プロパティを `0` に設定する必要があります。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.large, .medium')?.borderWidth === '0px');
@@ -7,7 +7,7 @@ dashedName: step-29

 # --description--

-Create a new `div` below your `.large` element and give it a `class` attribute set to `calories-info`.
+`.large` の要素の下に新しく `div` を作成して、その `class` 属性を `calories-info` に設定してください。

 # --hints--

@@ -23,7 +23,7 @@ assert(document.querySelectorAll('div')?.length === 4);
 assert(document.querySelector('.label')?.lastElementChild?.classList?.contains('calories-info'));
 ```

-Your new `div` should come after the `.large` element.
+新しい `div` は `.large` の要素の後に置く必要があります。

 ```js
 assert(document.querySelector('.label')?.lastElementChild?.previousElementSibling?.classList?.contains('large'));
@@ -7,36 +7,36 @@ dashedName: step-30

 # --description--

-Within your `.calories-info` element, create a `div` element. Give that `div` element a `class` attribute set to `left-container`. Within the newly created `div` element, create a `h2` element with the text `Amount per serving`. Give the `h2` element a `class` attribute set to `bold small-text`.
+`.calories-info` 要素内に `div` 要素を作成してください。 その `div` 要素に `class` 属性を追加して、`left-container` に設定してください。 またその `div` 要素の中に `h2` 要素を作成して、`Amount per serving` というテキストを追加してください。 その `h2` 要素に `class` 属性を追加して、`bold small-text` に設定してください。

 # --hints--

-You should create a new `div` element within your `.calories-info` element.
+`.calories-info` の要素内に、新しい `div` 要素を作成する必要があります。

 ```js
 assert(document.querySelector('.calories-info')?.children?.[0]?.localName === 'div');
 ```

-Your new `div` element should have a `class` attribute set to `left-container`.
+新しく追加した `div` 要素の `class` 属性を `left-container` に設定してください。

 ```js
 assert(document.querySelector('.calories-info')?.children?.[0]?.classList.contains('left-container'));
 ```

-You should create a new `h2` element within your `.left-container` element.
+`.left-container` の要素内に、新しい `h2` 要素を作成する必要があります。

 ```js
 assert(document.querySelector('.left-container')?.children?.[0]?.localName === 'h2');
 ```

-Your new `h2` element should have a `class` attribute set to `bold small-text`.
+新しく追加した `h2` 要素の `class` 属性を `bold small-text` に設定してください。

 ```js
 assert(document.querySelector('.left-container')?.children?.[0]?.classList.contains('bold'));
 assert(document.querySelector('.left-container')?.children?.[0]?.classList.contains('small-text'));
 ```

-Your new `h2` element should have the text `Amount per serving`.
+新しく追加した `h2` 要素には `Amount per serving` というテキストが必要です。

 ```js
 assert(document.querySelector('.left-container')?.children?.[0]?.innerText === 'Amount per serving');
@@ -9,17 +9,17 @@ dashedName: step-31

 `rem` という単位は `root em` を表し、`html` 要素のフォントサイズに比例します。

-Create a `.small-text` selector and set the `font-size` to `0.85rem`, which would calculate to roughly `13.6px` (remember that you set your `html` to have a `font-size` of `16px`).
+`.small-text` セレクターを作成し、`font-size` を `0.85rem` に設定してください。これはおおよそ `13.6px` に相当します。(`html` 要素の `font-size` を `16px` に設定したことを思い出してください。)

 # --hints--

-You should have an `.small-text` selector.
+`.small-text` セレクターが必要です。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.small-text'));
 ```

-Your `.small-text` selector should have a `font-size` property set to `0.85rem`.
+`.small-text` セレクターの `font-size` プロパティを `0.85rem` に設定する必要があります。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.small-text')?.fontSize === '0.85rem');
@@ -7,41 +7,41 @@ dashedName: step-33

 # --description--

-Below your `.small-text` element, create a new `p` element with the text `Calories`. Also below the `.left-container` element, create a new `span` element with the text `230`.
+`.small-text` の要素の下に、新しく `p` 要素を作成して、テキストを `Calories` にしてください。 また、`.left-container` の要素の下に、新しく `span` 要素を作成して、テキストを `230` にしてください。

 # --hints--

-You should have a new `p` element within your `.calories-info` element.
+`.calories-info` の要素の中に新しい `p` 要素が必要です。

 ```js
 assert(document.querySelector('.calories-info')?.querySelector('p'))
 ```

-You should have a new `span` element within your `.calories-info` element.
+`.calories-info` の要素の中に新しい `span` 要素が必要です。

 ```js
 assert(document.querySelector('.calories-info')?.querySelector('span'))
 ```

-Your `p` element should come after your `.small-text` element.
+`p` 要素は `.small-text` に該当する要素の後に置く必要があります。

 ```js
 assert(document.querySelector('.small-text')?.nextElementSibling?.localName === 'p');
 ```

-Your `span` element should come after your `.left-container` element.
+`span` 要素は `.left-container` に該当する要素の後に置く必要があります。

 ```js
 assert(document.querySelector('.left-container')?.nextElementSibling?.localName ==='span');
 ```

-Your `p` element should have the text `Calories`.
+`p` 要素には `Calories` というテキストが必要です。

 ```js
 assert(document.querySelector('.small-text')?.nextElementSibling?.innerText === 'Calories');
 ```

-`span` 要素のテキストは `230` にする必要があります。
+`span` 要素には `230` というテキストが必要です。

 ```js
 assert(document.querySelector('.left-container')?.nextElementSibling?.innerText === '230');
@@ -7,17 +7,17 @@ dashedName: step-35

 # --description--

-Create a new `.left-container p` selector setting the top and bottom margin to `-5px`, and the left and right margin to `-2px`. Also set the `font-size` to `2em` and `font-weight` to `700`.
+新しく `.left-container p` セレクターを作成し、上下のマージンを `-5px` に、左右のマージンを `-2px` に設定してください。 また、`font-size` を `2em` に、`font-weight` を `700` に設定してください。

 # --hints--

-You should have a new `.left-container p` selector.
+新しく `.left-container p` セレクターが必要です。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.left-container p'));
 ```

-Your new `.left-container p` selector should have a `margin` property set to `-5px -2px`.
+新しい `.left-container p` セレクターの `margin` プロパティを `-5px -2px` に設定する必要があります。

 ```js
 assert.equal(new __helpers.CSSHelp(document).getStyle('.left-container p')?.marginTop, '-5px');
@@ -26,13 +26,13 @@ assert.equal(new __helpers.CSSHelp(document).getStyle('.left-container p')?.marg
 assert.equal(new __helpers.CSSHelp(document).getStyle('.left-container p')?.marginRight, '-2px');
 ```

-Your new `.left-container p` selector should have a `font-size` property set to `2em`.
+新しい `.left-container p` セレクターの `font-size` プロパティを `2em` に設定する必要があります。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.left-container p')?.fontSize === '2em');
 ```

-Your new `.left-container p` selector should have a `font-weight` property set to `700`.
+新しい `.left-container p` セレクターの `font-weight` プロパティを `700` に設定する必要があります。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.left-container p')?.fontWeight === '700');
@@ -7,7 +7,7 @@ dashedName: step-36

 # --description--

-Create a `.calories-info span` selector, set its `font-size` to `2.4em` and `font-weight` to `700`.
+`.calories-info span` セレクターを作成し、`font-size` を `2.4em` に、`font-weight` を `700` に設定してください。

 # --hints--

@@ -17,13 +17,13 @@ Create a `.calories-info span` selector, set its `font-size` to `2.4em` and `fon
 assert(new __helpers.CSSHelp(document).getStyle('.calories-info span'));
 ```

-Your `.calories-info span` selector should have a `font-size` property set to `2.4em`.
+`.calories-info span` セレクターの `font-size` プロパティを `2.4em` に設定する必要があります。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.calories-info span')?.fontSize === '2.4em');
 ```

-Your `.calories-info span` selector should have a `font-weight` property set to `700`.
+`.calories-info span` セレクターの `font-weight` プロパティを `700` に設定してください。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.calories-info span')?.fontWeight === '700');
@@ -9,11 +9,11 @@ dashedName: step-37

 タイポグラフィは科学というより芸術のようなものであることも多いです。 正しいと思う見た目になるまで、配置などを微調整しなければならないこともあるでしょう。

-Give your `.calories-info span` selector a `margin` set to `-7px -2px`. これで `230` のテキストが適切な位置に移動されます。
+`.calories-info span` セレクターの `margin` を `-7px -2px` に設定してください。 これで `230` のテキストが適切な位置に移動されます。

 # --hints--

-Your `.calories-info span` selector should have a `margin` set to `-7px -2px`.
+`.calories-info span` セレクターの `margin` を `-7px -2px` に設定してください。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.calories-info span')?.margin === '-7px -2px');
@@ -7,7 +7,7 @@ dashedName: step-38

 # --description--

-Below your `.calories-info` element, add a `div` with the `class` attribute set to `divider medium`.
+`.calories-info` の要素の下に、`div` 要素を追加して、その `class` 属性を `divider medium` に設定してください。

 # --hints--

@@ -17,7 +17,7 @@ Below your `.calories-info` element, add a `div` with the `class` attribute set
 assert(document.querySelectorAll('.label > div')?.length === 3)
 ```

-Your new `div` should have the `class` attribute set to `divider medium`. この div が `.label` 要素内の最後の要素になるようにしてください。
+新しい `div` の `class` 属性が `divider medium` に設定されている必要があります。 この div が `.label` 要素内の最後の要素になるようにしてください。

 ```js
 const div = document.querySelector('.label')?.lastElementChild;
@@ -7,17 +7,17 @@ dashedName: step-39

 # --description--

-Create an `.medium` selector and give it a `height` property of `5px`.
+`.medium` セレクターを作成し、`height` プロパティを `5px` に設定してください。

 # --hints--

-You should create an `.medium` selector.
+`.medium` セレクターを作成する必要があります。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.medium'));
 ```

-Your `.medium` selector should have a `height` property set to `5px`.
+`.medium` セレクターの `height` プロパティを `5px` に設定する必要があります。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.medium')?.height === '5px');
@@ -7,11 +7,11 @@ dashedName: step-40

 # --description--

-Create a new `div` element below your `.medium` element. Give it a `class` attribute set to `daily-value small-text`. Within this new `div`, add a `p` element with the text `% Daily Value *`, and set the `class` attribute to `bold right`.
+`.medium` の要素の下に新しい `div` 要素を作成してください。 その `class` 属性を `daily-value small-text` に設定してください。 この新しい `div` の中に、`p` 要素を追加して、テキストを `% Daily Value *` に、`class` 属性を `bold right` に設定してください。

 # --hints--

-You should create a new `div` element after your `.medium` element.
+`.medium` 要素の後に新しい `div` 要素を作成する必要があります。

 ```js
 assert(document.querySelector('.label')?.lastElementChild?.localName === 'div');
@@ -19,7 +19,7 @@ assert(document.querySelector('.label')?.lastElementChild?.previousElementSiblin
 assert(document.querySelector('.label')?.lastElementChild?.previousElementSibling?.classList?.contains('medium'));
 ```

-Your new `div` should have a `class` attribute set to `daily-value small-text`.
+新しい `div` の `class` 属性を `daily-value small-text` に設定してください。

 ```js
 assert(document.querySelector('.label')?.lastElementChild?.classList?.contains('daily-value'));
@@ -38,7 +38,7 @@ assert(document.querySelector('.label')?.lastElementChild?.firstElementChild?.lo
 assert(document.querySelector('.label')?.lastElementChild?.firstElementChild?.textContent === '% Daily Value *');
 ```

-Your new `p` element should have a `class` attribute set to `bold right`.
+新しい `p` 要素の `class` 属性を `bold right` に設定してください。

 ```js
 assert(document.querySelector('.label')?.lastElementChild?.firstElementChild?.classList?.contains('bold'));
@@ -7,7 +7,7 @@ dashedName: step-43

 # --description--

-最後の `.divider` 要素の下に、`p` 要素を作成してテキストを `Total Fat 8g 10%` にしてください。 Wrap the text `Total Fat` in a `span` element with the `class` of `bold`. Wrap the text `10%` in another `span` element with the `class` of `bold`. Finally, nest the `Total Fat` `span` element and the text `8g` in an additional `span` element for alignment.
+最後の `.divider` 要素の下に、`p` 要素を作成してテキストを `Total Fat 8g 10%` にしてください。 テキストの `Total Fat` を、`bold` という `class` を持つ `span` 要素で囲んでください。 テキストの `10%` は別の `span` 要素で囲み、そちらも `bold` という `class` を持つようにしてください。 最期に、`Total Fat` の `span` 要素と `8g` のテキストを、もう 1 つの `span` 要素で囲んで位置を揃えましょう。

 # --hints--

@@ -23,37 +23,37 @@ assert(document.querySelector('.daily-value.small-text')?.lastElementChild?.loca
 assert(document.querySelector('.daily-value.small-text')?.lastElementChild?.innerText?.match(/Total Fat[\s|\n]+8g[\s|\n]+10%/));
 ```

-Your `p` element should have three `span` elements.
+`p` 要素内に `span` 要素が 3 つ必要です。

 ```js
 assert(document.querySelector('.daily-value.small-text')?.lastElementChild?.querySelectorAll('span')?.length === 3);
 ```

-One `span` element should wrap the text `Total Fat`.
+`span` 要素の 1 つが `Total Fat` というテキストを囲んでいる必要があります。

 ```js
 assert(document.querySelector('.daily-value.small-text')?.lastElementChild?.querySelector('span > span')?.innerText === 'Total Fat');
 ```

-The `span` element around `Total Fat` should have the `class` set to `bold`.
+`Total Fat` を囲んでいる `span` 要素の `class` が `bold` に設定されている必要があります。

 ```js
 assert(document.querySelector('.daily-value.small-text')?.lastElementChild?.querySelector('span > span')?.className === 'bold');
 ```

-A `span` element should wrap the text `10%`.
+`span` 要素の 1 つが `10%` というテキストを囲んでいる必要があります。

 ```js
 assert(document.querySelector('.daily-value.small-text')?.lastElementChild?.querySelector('span + span')?.innerText === '10%');
 ```

-The `span` element around `10%` should have the `class` set to `bold`.
+`10%` を囲んでいる `span` 要素の `class` が `bold` に設定されている必要があります。

 ```js
 assert(document.querySelector('.daily-value.small-text')?.lastElementChild?.querySelectorAll('span')?.[1]?.className === 'bold');
 ```

-A `span` element should have the text `Total Fat 8g`.
+`span` 要素の 1 つには `Total Fat 8g` というテキストが表示される必要があります。

 ```js
 assert(document.querySelector('.daily-value.small-text')?.lastElementChild?.innerText?.match(/Total Fat[\s|\n]+8g/));
@@ -7,7 +7,7 @@ dashedName: step-44

 # --description--

-`Total Fat` のテキストを持つ要素の下に、新しい `p` 要素を作成し、テキストを `Saturated Fat 1g 5%` としてください。 Wrap the `5%` in a `span` with the `class` attribute set to `bold`. In this case this is enough to align the percentage to `5%`.
+`Total Fat` のテキストを持つ要素の下に、新しい `p` 要素を作成し、テキストを `Saturated Fat 1g 5%` としてください。 `5%` の部分を `span` 要素で囲み、`class` 属性を `bold` に設定してください。 これで、`5%` の位置が他のパーセンテージと揃います。

 # --hints--

@@ -30,7 +30,7 @@ assert(document.querySelector('.daily-value.small-text')?.lastElementChild?.inne
 assert(document.querySelector('.daily-value.small-text')?.lastElementChild?.lastElementChild?.localName === 'span');
 ```

-Your `span` element should have the `class` attribute set to `bold`.
+`span` 要素の `class` 属性を `bold` に設定してください。

 ```js
 assert(document.querySelector('.daily-value.small-text')?.lastElementChild?.lastElementChild?.classList?.contains('bold'));
@@ -7,7 +7,7 @@ dashedName: step-51

 # --description--

-最後の `.divider` の後に `p` 要素をもう 1 つ作成し、テキストを `Trans Fat 0g` にしてください。 `Trans` という単語を `i` 要素で囲んでイタリック体にしてください。 新しい `p` 要素の `class` 属性は `indent no-divider` に設定してください。 Wrap `Trans Fat 0g` in a `span` element for alignment.
+最後の `.divider` の後に `p` 要素をもう 1 つ作成し、テキストを `Trans Fat 0g` にしてください。 `Trans` という単語を `i` 要素で囲んでイタリック体にしてください。 新しい `p` 要素の `class` 属性は `indent no-divider` に設定してください。 `Trans Fat 0g` を `span` 要素で囲んで位置を揃えましょう。

 # --hints--

@@ -49,7 +49,7 @@ assert(document.querySelector('.daily-value.small-text')?.lastElementChild?.quer
 assert(document.querySelector('.daily-value.small-text')?.lastElementChild?.querySelector('span'));
 ```

-Your `span` element should wrap the text `Trans Fat 0g`.
+`span` 要素が `Trans Fat 0g` というテキストを囲んでいる必要があります。

 ```js
 assert(document.querySelector('.daily-value.small-text')?.lastElementChild?.querySelector('span')?.innerText?.match(/Trans[\s|\n]+Fat 0g/));
@@ -7,11 +7,11 @@ dashedName: step-41

 # --description--

-The text `% Daily Value *` should be aligned to the right. Create a `.right` selector and use the `justify-content` property to do it.
+`% Daily Value *` というテキストを右揃えにしましょう。 `.right` セレクターを作成して、`justify-content` プロパティを使って設定してください。

 # --hints--

-You should have a `.right` selector.
+`.right` セレクターが必要です。

 ```js
 const hasRight = new __helpers.CSSHelp(document).getStyle('.right');
@@ -19,7 +19,7 @@ assert(hasRight);

 ```

-The `.right` selector should have the `justify-content` property set to `flex-end`.
+`.right` セレクターの `justify-content` プロパティを `flex-end` に設定してください。

 ```js
 const rightJustifyContent = new __helpers.CSSHelp(document).getStyle('.right')?.getPropertyValue('justify-content');
@@ -7,17 +7,17 @@ dashedName: step-32

 # --description--

-Create a `.calories-info h2` selector and remove all margins.
+`.calories-info h2` セレクターを作成して、すべてのマージンを取り除いてください。

 # --hints--

-Create a `.calories-info h2` selector.
+`.calories-info h2` セレクターを作成してください。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.calories-info h2'));
 ```

-Your `.calories-info h2` selector should have a `margin` set to `0`.
+`.calories-info h2` の `margin` を `0` に設定してください。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.calories-info h2')?.margin === '0px');
@@ -7,29 +7,29 @@ dashedName: step-34

 # --description--

-Create a new `.calories-info` selector and give it a `display` property set to `flex`. Also give it a `justify-content` property set to `space-between` and `align-items` property set to `flex-end`.
+新しく `.calories-info` セレクターを作成して、`display` プロパティを `flex` に設定してください。 また、`justify-content` プロパティを `space-between` に、`align-items` プロパティを `flex-end` に設定してください。

 # --hints--

-You should create a `.calories-info` selector.
+`.calories-info` セレクターを作成する必要があります。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.calories-info'));
 ```

-Your `.calories-info` selector should have a `display` property set to `flex`.
+`.calories-info` セレクターの `display` プロパティを `flex` に設定してください。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.calories-info')?.display === 'flex');
 ```

-Your `.calories-info` selector should have a `justify-content` property set to `space-between`.
+`.calories-info` セレクターの `justify-content` プロパティを `space-between` に設定してください。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.calories-info')?.justifyContent === 'space-between');
 ```

-Your `.calories-info` selector should have a `align-items` property set to `flex-end`.
+`.calories-info` セレクターの `align-items` プロパティを `flex-end` に設定してください。

 ```js
 assert(new __helpers.CSSHelp(document).getStyle('.calories-info')?.alignItems === 'flex-end');
@@ -23,19 +23,19 @@ You should access the `innerHTML` of `authorContainer` and set it to a `p` eleme


 ```js
-assert.match(code, /authorContainer\.innerHTML\s*=\s*(`|"|')<p.*>.*<\/p>\1/)
+assert.match(code, /authorContainer\.innerHTML\s*=\s*(`|"|')\s*<p.*>.*<\/p>\s*\1/)
 ```

 Your `p` element should have the class `error-msg`.

 ```js
-assert.match(code, /(`|"|')<p\s+class\s*=\s*("|')error-msg\2>/)
+assert.match(code, /(`|"|')\s*<p\s+class\s*=\s*("|')error-msg\2>/)
 ```

 Your `p` element should have the text `There was an error loading the authors`.

 ```js
-assert.match(code, /(`|"|')<p\s+class\s*=\s*("|')error-msg\2>There\s+was\s+an\s+error\s+loading\s+the\s+authors<\/p>\1\s*;?/)
+assert.match(code, /(`|"|')<p\s+class\s*=\s*("|')error-msg\2>There\s+was\s+an\s+error\s+loading\s+the\s+authors<\/p>\s*\1\s*;?/)
 ```


@@ -23,19 +23,19 @@ You should access the `innerHTML` of `authorContainer` and set it to a `p` eleme


 ```js
-assert.match(code, /authorContainer\.innerHTML\s*=\s*(`|"|')<p.*>.*<\/p>\1/)
+assert.match(code, /authorContainer\.innerHTML\s*=\s*(`|"|')\s*<p.*>.*<\/p>\s*\1/)
 ```

 Your `p` element should have the class `error-msg`.

 ```js
-assert.match(code, /(`|"|')<p\s+class\s*=\s*("|')error-msg\2>/)
+assert.match(code, /(`|"|')\s*<p\s+class\s*=\s*("|')error-msg\2>/)
 ```

 Your `p` element should have the text `There was an error loading the authors`.

 ```js
-assert.match(code, /(`|"|')<p\s+class\s*=\s*("|')error-msg\2>There\s+was\s+an\s+error\s+loading\s+the\s+authors<\/p>\1\s*;?/)
+assert.match(code, /(`|"|')<p\s+class\s*=\s*("|')error-msg\2>There\s+was\s+an\s+error\s+loading\s+the\s+authors<\/p>\s*\1\s*;?/)
 ```


@@ -13,14 +13,14 @@ Altere a cor da fonte de todos os elementos "âncora" dentro dos elementos da li

 # --hints--

-Your selector should target links inside list items.
+O seletor deve direcionar os links nos itens da lista.

 ```js
 const anchors = document.querySelectorAll('li > a');
 anchors.forEach(a => assert.exists(getComputedStyle(a)));
 ```

-You should give the `a` elements inside list items a `color` property.
+Você deve atribuir aos elementos `a` nos itens da lista uma propriedade `color`.

 ```js
 const helper = new __helpers.CSSHelp(document);
@@ -29,7 +29,7 @@ const usedSelector = code.match(/^\s*?(.*?a)\s*?{/m)[1];
 assert.notEmpty(helper.getStyle(usedSelector)?.color);
 ```

-You should only change the color of `a` elements inside list elements.
+Você só deve alterar a cor dos elementos `a` nos elementos da lista.

 ```js
 const footerAnchor = document.querySelector('footer a');
@@ -7,7 +7,7 @@ dashedName: step-50

 # --description--

-Para cada um dos dois elementos `p`  que você acabou de adicionar, adicione `sobremesa` como o valor do atributo  `class`  do primeiro elemento `p` e `preço` como o valor do atributo `class`  do segundo elemento  `p` .
+Para cada um dos dois elementos `p` que você acabou de adicionar, adicione `dessert` como o valor do atributo `class` do primeiro elemento `p` e `price` como o valor do atributo `class` do segundo elemento `p`.

 # --hints--

@@ -23,19 +23,19 @@ Você deve acessar o `innerHTML` de `authorContainer` e defini-lo como um elemen


 ```js
-assert.match(code, /authorContainer\.innerHTML\s*=\s*(`|"|')<p.*>.*<\/p>\1/)
+assert.match(code, /authorContainer\.innerHTML\s*=\s*(`|"|')\s*<p.*>.*<\/p>\s*\1/)
 ```

 O elemento `p` deve ter a classe `error-msg`.

 ```js
-assert.match(code, /(`|"|')<p\s+class\s*=\s*("|')error-msg\2>/)
+assert.match(code, /(`|"|')\s*<p\s+class\s*=\s*("|')error-msg\2>/)
 ```

 O elemento `p` deve ter o texto `There was an error loading the authors`.

 ```js
-assert.match(code, /(`|"|')<p\s+class\s*=\s*("|')error-msg\2>There\s+was\s+an\s+error\s+loading\s+the\s+authors<\/p>\1\s*;?/)
+assert.match(code, /(`|"|')<p\s+class\s*=\s*("|')error-msg\2>There\s+was\s+an\s+error\s+loading\s+the\s+authors<\/p>\s*\1\s*;?/)
 ```


@@ -25,7 +25,7 @@ A variável `hello` deve ser igual a "world".
 ({ test: () => assert.equal(__userGlobals.get("hello"), "world") })
 ```

-The `one` variable should be an integer.
+A variável `one` deve ser um número inteiro.

 ```js
 ({ test: () => {
@@ -1,23 +1,23 @@
 ---
 id: 65df3afd233057f6a620a860
-title: Step 5
+title: Passo 5
 challengeType: 20
 dashedName: step-5
 ---

 # --description--

-This shows how the helper functions can be used to analyze a learner's class definitions
+Isso mostra como as funções auxiliares podem ser usadas para analisar as definições de classe de um aluno

 # --instructions--

-We can just find the class definition inside Python, return it to the JavaScript, and then check if it contains the string "pass".
+Nós podemos simplesmente encontrar a definição da classe dentro do Python, retornando-a para o JavaScript e verificando se ela contém a string "pass".

-If we need something more reliable, we can expand the helpers to check for pass statements specifically. This would be useful if say, we wanted to write classes containing, say, passengers.
+Se precisarmos de algo mais confiável, podemos expandir os ajudantes para verificar especificamente se existem instruções pass. Isso seria útil se, por exemplo, quiséssemos escrever classes contendo, por exemplo, "passengers".

 # --hints--

-`TreeNode` should not contain any `pass` statements.
+`TreeNode` não deve conter instruções `pass`.

 ```js
 ({ test: () => {
@@ -23,19 +23,19 @@ You should access the `innerHTML` of `authorContainer` and set it to a `p` eleme


 ```js
-assert.match(code, /authorContainer\.innerHTML\s*=\s*(`|"|')<p.*>.*<\/p>\1/)
+assert.match(code, /authorContainer\.innerHTML\s*=\s*(`|"|')\s*<p.*>.*<\/p>\s*\1/)
 ```

 Your `p` element should have the class `error-msg`.

 ```js
-assert.match(code, /(`|"|')<p\s+class\s*=\s*("|')error-msg\2>/)
+assert.match(code, /(`|"|')\s*<p\s+class\s*=\s*("|')error-msg\2>/)
 ```

 Your `p` element should have the text `There was an error loading the authors`.

 ```js
-assert.match(code, /(`|"|')<p\s+class\s*=\s*("|')error-msg\2>There\s+was\s+an\s+error\s+loading\s+the\s+authors<\/p>\1\s*;?/)
+assert.match(code, /(`|"|')<p\s+class\s*=\s*("|')error-msg\2>There\s+was\s+an\s+error\s+loading\s+the\s+authors<\/p>\s*\1\s*;?/)
 ```


@@ -23,19 +23,19 @@ You should access the `innerHTML` of `authorContainer` and set it to a `p` eleme


 ```js
-assert.match(code, /authorContainer\.innerHTML\s*=\s*(`|"|')<p.*>.*<\/p>\1/)
+assert.match(code, /authorContainer\.innerHTML\s*=\s*(`|"|')\s*<p.*>.*<\/p>\s*\1/)
 ```

 Елемент `p` повинен мати клас `error-msg`.

 ```js
-assert.match(code, /(`|"|')<p\s+class\s*=\s*("|')error-msg\2>/)
+assert.match(code, /(`|"|')\s*<p\s+class\s*=\s*("|')error-msg\2>/)
 ```

 Your `p` element should have the text `There was an error loading the authors`.

 ```js
-assert.match(code, /(`|"|')<p\s+class\s*=\s*("|')error-msg\2>There\s+was\s+an\s+error\s+loading\s+the\s+authors<\/p>\1\s*;?/)
+assert.match(code, /(`|"|')<p\s+class\s*=\s*("|')error-msg\2>There\s+was\s+an\s+error\s+loading\s+the\s+authors<\/p>\s*\1\s*;?/)
 ```


@@ -1,6 +1,6 @@
 ---
 id: 657b3136477b8ac802088c97
-title: "Dialogue 2: New Hobbies"
+title: "Діалог 2: нові хобі"
 challengeType: 21
 dashedName: dialogue-2-new-hobbies
 ---