jprdonnelly/freeCodeCamp
1
0
Fork 0
mirror of https://github.com/freeCodeCamp/freeCodeCamp.git synced 2026-04-22 22:00:50 -04:00
Code Issues Projects Releases Wiki Activity

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

Browse Source
This commit is contained in:
camperbot
2023-06-23 21:09:19 +05:30
committed by GitHub
parent 9a2d30a982
commit f7bf7c5485
78 changed files with 285 additions and 185 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
curriculum/challenges/arabic/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/613e275749ebd008e74bb62e.md
View File

@@ -9,17 +9,27 @@ dashedName: step-8
تعني الخاصية _SVG_ المفيدة (رُسُوم متجهة قابلة للتطوير scalable vector graphics)، هي أنها تحتوي على سمة `path` التي تسمح بتغيير حجم الصورة دون التأثير على دقة الصورة الناتجة من التغيير.
حاليًا، تأخذ `img` حجمها الافتراضي, وهو كبير جدًا. بشكل صحيح، غيّر حجم الصورة باستخدام `id` كمنتقى، وعيّن `width` ألى `max(100px, 18vw)`.
حاليًا، تأخذ `img` حجمها الافتراضي, وهو كبير جدًا. CSS has a `max` function which returns the largest of a set of comma-separated values. For example:
```css
img {
width: max(250px, 25vw);
}
```
In this example, `img` elements will have a minimum width of `250px`. And as the viewport grows, the image will grow accordingly to be 25 percent of the viewport width.
Scale the image using its `id` as a selector, and setting the `width` to to be the maximum of `100px` or `18vw`.
# --hints--
يجب عليك استخدام منتقي `#logo` لاستهداف عنصر `img`.
You should use the `#logo` selector to target the `img` element.
```js
assert.exists(new __helpers.CSSHelp(document).getStyle('#logo'));
```
يجب عليك إعطاء `img` خاصية `width` بقيمة `max(100px, 18vw)`.
You should give the `img` a `width` of `max(100px, 18vw)`.
```js
assert.equal(new __helpers.CSSHelp(document).getStyle('#logo')?.width, 'max(100px, 18vw)');

2
curriculum/challenges/arabic/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/614090d5a22b6f0a5a6b464c.md
View File

@@ -9,7 +9,7 @@ dashedName: step-13
# --description--
استهدف عناصر الـ unordered list داخل عناصر `nav`، واستخدم _Flexbox_ لتوزيع المسافات بين الأطفال بشكل متساوٍ.
Use the `>` selector to target the unordered list elements within the `nav` elements, and use _Flexbox_ to evenly space the children.
# --hints--

2
curriculum/challenges/arabic/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f02240ff8f09f7ec913c.md
View File

@@ -7,7 +7,7 @@ dashedName: step-36
# --description--
ضمن عناصر `div.question-block`، ادمج عنصر `label` واحد ،وقم بإعطاء عناصر `label` محتوى نصي
Within the `div.question-block` elements, nest one `label` element, and add a `CSS` related question to the `label` text.
# --hints--

16
curriculum/challenges/chinese-traditional/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/613e275749ebd008e74bb62e.md
View File

@@ -9,17 +9,27 @@ dashedName: step-8
_SVG_（可縮放矢量圖形）的一個有用之處是它包含一個 `path` 屬性，該屬性允許在不影響圖像分辨率的情況下縮放圖像。
`img` 當前是默認尺寸，這個尺寸太大。 可以使用它的 `id` 作爲選擇器來縮放圖像，並將 `width` 設置爲 `max(100px, 18vw)`。
`img` 當前是默認尺寸，這個尺寸太大。 CSS has a `max` function which returns the largest of a set of comma-separated values. For example:
```css
img {
width: max(250px, 25vw);
}
```
In this example, `img` elements will have a minimum width of `250px`. And as the viewport grows, the image will grow accordingly to be 25 percent of the viewport width.
Scale the image using its `id` as a selector, and setting the `width` to to be the maximum of `100px` or `18vw`.
# --hints--
你應該使用 `#logo` 選擇器來定位 `img` 元素。
You should use the `#logo` selector to target the `img` element.
```js
assert.exists(new __helpers.CSSHelp(document).getStyle('#logo'));
```
你應該給 `img` 元素添加一個值爲 `max(100px, 18vw)` 的 `width`。
You should give the `img` a `width` of `max(100px, 18vw)`.
```js
assert.equal(new __helpers.CSSHelp(document).getStyle('#logo')?.width, 'max(100px, 18vw)');

2
curriculum/challenges/chinese-traditional/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/614090d5a22b6f0a5a6b464c.md
View File

@@ -9,7 +9,7 @@ dashedName: step-13
# --description--
定位 `nav` 元素中的無序列表元素，並使用 _Flexbox_ 均勻地間隔子元素。
Use the `>` selector to target the unordered list elements within the `nav` elements, and use _Flexbox_ to evenly space the children.
# --hints--

2
curriculum/challenges/chinese-traditional/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f02240ff8f09f7ec913c.md
View File

@@ -7,7 +7,7 @@ dashedName: step-36
# --description--
在 `div.question-block` 元素中，嵌套一個 `label` 元素，並給 `label` 元素添加文本內容
Within the `div.question-block` elements, nest one `label` element, and add a `CSS` related question to the `label` text.
# --hints--

16
curriculum/challenges/chinese/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/613e275749ebd008e74bb62e.md
View File

@@ -9,17 +9,27 @@ dashedName: step-8
_SVG_（可缩放矢量图形）的一个有用之处是它包含一个 `path` 属性，该属性允许在不影响图像分辨率的情况下缩放图像。
`img` 当前是默认尺寸，这个尺寸太大。 可以使用它的 `id` 作为选择器来缩放图像，并将 `width` 设置为 `max(100px, 18vw)`。
`img` 当前是默认尺寸，这个尺寸太大。 CSS has a `max` function which returns the largest of a set of comma-separated values. For example:
```css
img {
width: max(250px, 25vw);
}
```
In this example, `img` elements will have a minimum width of `250px`. And as the viewport grows, the image will grow accordingly to be 25 percent of the viewport width.
Scale the image using its `id` as a selector, and setting the `width` to to be the maximum of `100px` or `18vw`.
# --hints--
你应该使用 `#logo` 选择器来定位 `img` 元素。
You should use the `#logo` selector to target the `img` element.
```js
assert.exists(new __helpers.CSSHelp(document).getStyle('#logo'));
```
你应该给 `img` 元素添加一个值为 `max(100px, 18vw)` 的 `width`。
You should give the `img` a `width` of `max(100px, 18vw)`.
```js
assert.equal(new __helpers.CSSHelp(document).getStyle('#logo')?.width, 'max(100px, 18vw)');

2
curriculum/challenges/chinese/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/614090d5a22b6f0a5a6b464c.md
View File

@@ -9,7 +9,7 @@ dashedName: step-13
# --description--
定位 `nav` 元素中的无序列表元素，并使用 _Flexbox_ 均匀地间隔子元素。
Use the `>` selector to target the unordered list elements within the `nav` elements, and use _Flexbox_ to evenly space the children.
# --hints--

2
curriculum/challenges/chinese/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f02240ff8f09f7ec913c.md
View File

@@ -7,7 +7,7 @@ dashedName: step-36
# --description--
在 `div.question-block` 元素中，嵌套一个 `label` 元素，并给 `label` 元素添加文本内容
Within the `div.question-block` elements, nest one `label` element, and add a `CSS` related question to the `label` text.
# --hints--

16
curriculum/challenges/espanol/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/613e275749ebd008e74bb62e.md
View File

@@ -9,17 +9,27 @@ dashedName: step-8
Una propiedad útil de un _SVG_ (gráficos vectoriales escalables) es que contiene un atributo `path` que permite escalar la imagen sin afectar la resolución de la imagen resultante.
Actualmente, el `img` está asumiendo el tamaño predeterminado, el cual es demasiado grande. De manera adecuada, escala la imagen usando el `id` como selector y establece el `width` a `max(100px, 18vw)`.
Actualmente, el `img` está asumiendo el tamaño predeterminado, el cual es demasiado grande. CSS has a `max` function which returns the largest of a set of comma-separated values. For example:
```css
img {
width: max(250px, 25vw);
}
```
In this example, `img` elements will have a minimum width of `250px`. And as the viewport grows, the image will grow accordingly to be 25 percent of the viewport width.
Scale the image using its `id` as a selector, and setting the `width` to to be the maximum of `100px` or `18vw`.
# --hints--
Debes usar el selector `#logo` para apuntar al elemento `img`.
You should use the `#logo` selector to target the `img` element.
```js
assert.exists(new __helpers.CSSHelp(document).getStyle('#logo'));
```
Debes dar al `img` un `width` de `max(100px, 18vw)`.
You should give the `img` a `width` of `max(100px, 18vw)`.
```js
assert.equal(new __helpers.CSSHelp(document).getStyle('#logo')?.width, 'max(100px, 18vw)');

2
curriculum/challenges/espanol/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/614090d5a22b6f0a5a6b464c.md
View File

@@ -9,7 +9,7 @@ dashedName: step-13
# --description--
Apunta a los elementos de lista desordenada dentro de los elementos `nav`, y usa _Flexbox_ para espaciar de manera uniforme a los hijos.
Use the `>` selector to target the unordered list elements within the `nav` elements, and use _Flexbox_ to evenly space the children.
# --hints--

2
curriculum/challenges/espanol/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f02240ff8f09f7ec913c.md
View File

@@ -7,7 +7,7 @@ dashedName: step-36
# --description--
Dentro de los elementos `div.question-block`, anide un elemento `label` y dele contenido de texto.
Within the `div.question-block` elements, nest one `label` element, and add a `CSS` related question to the `label` text.
# --hints--

16
curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/613e275749ebd008e74bb62e.md
View File

@@ -9,17 +9,27 @@ dashedName: step-8
Eine nützliche Eigenschaft einer _SVG_ (scalable vector graphics, skalierbare Vektorgrafiken) ist, dass dieses ein `path`-Attribut enthält, mit welchem ein Bild, ohne die Auflösung des Resultats zu beeinflussen, skaliert werden kann.
Derzeit übernimmt das `img` die Ursprungsgröße, welche aber zu groß ist. Korrigiere das, indem du das Bild mithilfe des Selektors `id` auf eine `width` von `max(100px, 18vw)` stellst.
Derzeit übernimmt das `img` die Ursprungsgröße, welche aber zu groß ist. CSS has a `max` function which returns the largest of a set of comma-separated values. For example:
```css
img {
width: max(250px, 25vw);
}
```
In this example, `img` elements will have a minimum width of `250px`. And as the viewport grows, the image will grow accordingly to be 25 percent of the viewport width.
Scale the image using its `id` as a selector, and setting the `width` to to be the maximum of `100px` or `18vw`.
# --hints--
Du solltest den Selektor `#logo` verwenden, um das `img`-Element auszuwählen.
You should use the `#logo` selector to target the `img` element.
```js
assert.exists(new __helpers.CSSHelp(document).getStyle('#logo'));
```
Du solltest dem `img` eine `width` von `max(100px, 18vw)` geben.
You should give the `img` a `width` of `max(100px, 18vw)`.
```js
assert.equal(new __helpers.CSSHelp(document).getStyle('#logo')?.width, 'max(100px, 18vw)');

2
curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/614090d5a22b6f0a5a6b464c.md
View File

@@ -9,7 +9,7 @@ dashedName: step-13
# --description--
Richte die ungeordneten Listenelemente innerhalb der `nav` Elemente aus und verwende _Flexbox_, um die untergeordneten Elemente gleichmäßig zu verteilen.
Use the `>` selector to target the unordered list elements within the `nav` elements, and use _Flexbox_ to evenly space the children.
# --hints--

2
curriculum/challenges/german/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f02240ff8f09f7ec913c.md
View File

@@ -7,7 +7,7 @@ dashedName: step-36
# --description--
Within the `div.question-block` elements, nest one `label` element, and give the `label` elements text content
Within the `div.question-block` elements, nest one `label` element, and add a `CSS` related question to the `label` text.
# --hints--

2
curriculum/challenges/german/14-responsive-web-design-22/learn-css-colors-by-building-a-set-of-colored-markers/61b09f739aa6572d2064f9b8.md
View File

@@ -13,7 +13,7 @@ Verwende für die `border-left`-Sichteigenschaft die `rgba` Funktion, um den Far
# --hints--
Your `.sleeve` CSS rule should have a `border-left` shorthand property and with the value `10px double rgba(0, 0, 0, 0.75)`.
Deine `.sleeve`-CSS-Regel sollte eine `border-left`-Sichteigenschaft mit dem Wert `10px double rgba(0, 0, 0, 0.75)` haben.
```js
assert(new __helpers.CSSHelp(document).getStyle('.sleeve')?.borderLeft === '10px double rgba(0, 0, 0, 0.75)');

4
curriculum/challenges/german/14-responsive-web-design-22/learn-css-transforms-by-building-a-penguin/6199442866286d0ff421a4fc.md
View File

@@ -7,11 +7,11 @@ dashedName: step-38
# --description--
To give the penguin body a crest, create a pseudo-element that is the first child of the `.penguin-body` element. Set the `content` property of the pseudo-element to an empty string.
Um dem Pinguin-Körper ein Wappen zu geben, erstelle ein Pseudo-Element, dass das erste untergeordnete Element des `.penguin-body`-Elements ist. Die `content`-Eigenschaft des Pseudo-Elements sollte einen leeren String haben.
# --hints--
You should use the `.penguin-body::before` selector.
Du solltest den `.penguin-body::before`-Selektor verwenden.
```js
assert.match(code, /\.penguin-body::before\s*\{/);

4
curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98f1.md
View File

@@ -17,14 +17,14 @@ Du solltest einen neuen Klassen-Selektor namens `bb1-window` erstellen.
assert.exists(new __helpers.CSSHelp(document).getStyle('.bb1-window'));
```
You should move the `height` property and value from `.bb1a` to `.bb1-window`.
Du solltest die `height`-Eigenschaft und den Wert von `.bb1a` nach `.bb1-window` verschieben.
```js
assert.isEmpty(new __helpers.CSSHelp(document).getStyle('.bb1a')?.height);
assert.equal(new __helpers.CSSHelp(document).getStyle('.bb1-window')?.height, '10%');
```
You should move the `background` property and value from `.bb1a` to `.bb1-window`.
Du solltest die `background`-Eigenschaft und den Wert von `.bb1a` nach `.bb1-window` verschieben.
```js
assert.isEmpty(new __helpers.CSSHelp(document).getStyle('.bb1a')?.background);

16
curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98f2.md
View File

@@ -7,47 +7,47 @@ dashedName: step-42
# --description--
Add the new `bb1-window` class to the `.bb1a`, `.bb1b`, and `.bb1c` elements. This will apply the gradient to them.
Füge die neue `bb1-window`-Klasse zu den `.bb1a`, `.bb1b` und `.bb1c`-Elementen hinzu. Dadurch wird der Farbverlauf auf sie angewendet.
# --hints--
You should not remove the `bb1a` class.
Du solltest die `bb1a`-Klasse nicht entfernen.
```js
assert.exists(document.querySelector('div.bb1a'));
```
You should add the `bb1-window` class to the `.bb1a` element.
Du solltest die `bb1-window`-Klasse zum `.bb1a`-Element hinzufügen.
```js
assert.exists(document.querySelector('div.bb1a.bb1-window'));
```
You should not remove the `bb1b` class.
Du solltest die `bb1b`-Klasse nicht entfernen.
```js
assert.exists(document.querySelector('div.bb1b'));
```
You should add the `bb1-window` class to the `.bb1b` element.
Du solltest die `bb1-window`-Klasse zum `.bb1b`-Element hinzufügen.
```js
assert.exists(document.querySelector('div.bb1b.bb1-window'));
```
You should not remove the `bb1c` class.
Du solltest die `bb1c`-Klasse nicht entfernen.
```js
assert.exists(document.querySelector('div.bb1c'));
```
You should add the `bb1-window` class to the `.bb1c` element.
Du solltest die `bb1-window` Klasse zum `.bb1c` Element hinzufügen.
```js
assert.exists(document.querySelector('div.bb1c.bb1-window'));
```
You should not change the `.bb1d` element.
Du solltest das `.bb1d`-Element nicht verändern.
```js
assert.exists(document.querySelector('div.bb1d'));

10
curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98f3.md
View File

@@ -7,7 +7,7 @@ dashedName: step-43
# --description--
You don't need the `height` or `background-color` properties in `.bb1a`, `.bb1b` or `.bb1c` anymore, so go ahead and remove them.
Du brauchst die `height` oder `background-color`-Eigenschaften in `.bb1a`, `.bb1b` oder `.bb1c` nicht mehr, also fahr fort und entferne sie.
# --hints--
@@ -17,25 +17,25 @@ You should remove the `background-color` from `.bb1a`.
assert.isEmpty(new __helpers.CSSHelp(document).getStyle('.bb1a')?.backgroundColor);
```
You should remove the `height` property from `.bb1b`.
Du solltest die `height`-Eigenschaft aus `.bb1b` entfernen.
```js
assert.isEmpty(new __helpers.CSSHelp(document).getStyle('.bb1b')?.height);
```
You should remove the `background-color` property from `.bb1b`.
Du solltest die `background-color`-Eigenschaft aus `.bb1b` entfernen.
```js
assert.isEmpty(new __helpers.CSSHelp(document).getStyle('.bb1b')?.backgroundColor);
```
You should remove the `height` property from `.bb1c`.
Du solltest die `height`-Eigenschaft aus `.bb1c` entfernen.
```js
assert.isEmpty(new __helpers.CSSHelp(document).getStyle('.bb1c')?.height);
```
You should remove the `background-color` property from `.bb1c`.
Du solltest die `background-color`-Eigenschaft aus `.bb1c` entfernen.
```js
assert.isEmpty(new __helpers.CSSHelp(document).getStyle('.bb1c')?.backgroundColor);

10
curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98f4.md
View File

@@ -17,11 +17,11 @@ gradient-type(
);
```
Add a `linear-gradient` to `.bb1d` with `orange` as the first color, `--building-color1` as the second, and `--window-color1` as the third. Remember to use the gradient on the `background` property.
Füge einen `linear-gradient` zu `.bb1d` mit `orange` als erste Farbe, `--building-color1` als zweite und `--window-color1` als dritte hinzu. Remember to use the gradient on the `background` property.
# --hints--
You should use the `background` on `.bb1d`.
Du solltest die `background` auf `.bb1d` verwenden.
```js
assert.isNotEmpty(new __helpers.CSSHelp(document).getStyle('.bb1d')?.background);
@@ -33,19 +33,19 @@ You should give the `background` property a `linear-gradient`.
assert.include(new __helpers.CSSHelp(document).getStyle('.bb1d')?.background, 'linear-gradient');
```
You should use `orange` as the first color in the `linear-gradient`.
Du solltest `orange` als erste Farbe im `linear-gradient` verwenden.
```js
assert.include(new __helpers.CSSHelp(document).getStyle('.bb1d')?.getPropVal('background', true), 'linear-gradient(orange');
```
You should use `--building-color1` as the second color in the `linear-gradient`.
Du solltest `--building-color1` als zweite Farbe im `linear-gradient` verwenden.
```js
assert.include(new __helpers.CSSHelp(document).getStyle('.bb1d')?.getPropVal('background', true), 'linear-gradient(orange,var(--building-color1)');
```
You should use `--window-color1` as the third color in the `linear-gradient`.
Du solltest `--window-color1` als dritte Farbe im `linear-gradient` verwenden.
```js
assert.equal(new __helpers.CSSHelp(document).getStyle('.bb1d')?.getPropVal('background', true), 'linear-gradient(orange,var(--building-color1),var(--window-color1))');

6
curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98f6.md
View File

@@ -7,7 +7,7 @@ dashedName: step-46
# --description--
You can specify where you want a gradient transition to complete by adding it to the color like this:
Du kannst bestimmen, wo ein Farbverlaufsübergang enden soll, indem du ihn wie folgt zur Farbe hinzufügst:
```css
gradient-type(
@@ -17,11 +17,11 @@ gradient-type(
);
```
Here, it will transition from `color1` to `color2` between `0%` and `20%` of the element and then transition to `color3` for the rest. Add `80%` to the `--building-color1` color of the `.bb1d` gradient so you can see it in action.
Hier wird er von `color1` zu `color2` zwischen `0%` und `20%` des Elements wechseln und dann für den Rest zu `color3` übergehen. Füge `80%` zur `--building-color1`-Farbe des `.bb1d` Farbverlaufs hinzu, damit du es in Aktion sehen kannst.
# --hints--
You should add a value of `80%` to the `--building-color1` color in the `linear-gradient` of `.bb1d`.
Du solltest in der `linear-gradient` von `.bb1d` einen Wert von `80%` zur `--building-color1`-Farbe hinzufügen.
```js
assert.equal(new __helpers.CSSHelp(document).getStyle('.bb1d')?.getPropVal('background', true), 'linear-gradient(orange,var(--building-color1)80%,var(--window-color1))');

6
curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98f7.md
View File

@@ -7,17 +7,17 @@ dashedName: step-47
# --description--
Remove `orange` from the `.bb1d` gradient and change the `80%` to `50%`. This will make `--building-color1` solid for the top half, and then transition to `--window-color1` for the bottom half.
Entferne `orange` aus dem `.bb1d`-Farbverlauf und ändere die `80%` auf `50%`. Dies wird `--building-color1` in der oberen Hälfte festigen und in der unteren Hälfte zu `--window-color1` übergehen.
# --hints--
You should remove `orange` from the `linear-gradient`.
Du solltest `orange` aus `linear-gradient` entfernen.
```js
assert.notInclude(new __helpers.CSSHelp(document).getStyle('.bb1d')?.background, 'orange');
```
You should change the now first `linear-gradient` color to transition at `50%`.
Du solltest die jetzt erste `linear-gradient`-Farbe ändern, damit sie zu `50%` übergeht.
```js
assert.equal(new __helpers.CSSHelp(document).getStyle('.bb1d')?.getPropVal('background', true), 'linear-gradient(var(--building-color1)50%,var(--window-color1))');

4
curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98f8.md
View File

@@ -17,13 +17,13 @@ Du solltest zwei `div`-Elemente zu `.bb2` hinzufügen.
assert.equal(document.querySelector('div.bb2')?.children?.length, 2);
```
You should give the first `div` a class of `bb2a`.
Du solltest dem ersten `div`-Element eine Klasse mit dem Namen `bb2a` zuweisen.
```js
assert.exists(document.querySelector('div.bb2a'));
```
You should give the second `div` a class of `bb2b`.
Du solltest dem zweiten `div`-Element eine Klasse mit dem Namen `bb2b` zuweisen.
```js
assert.exists(document.querySelector('div.bb2b'));

6
curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98f9.md
View File

@@ -7,17 +7,17 @@ dashedName: step-49
# --description--
Give `.bb2b` a `width` and `height` of `100%` to make it fill the building container. You will add something on the top a little later.
Gib `.bb2b` eine `width` und `height` von `100%`, damit es den Baucontainer füllt. Du wirst ein bisschen später oben etwas hinzufügen.
# --hints--
You should give `.bb2b` a `width` of `100%`.
Du solltest `.bb2b` eine `width` von `100%` geben.
```js
assert.equal(new __helpers.CSSHelp(document).getStyle('.bb2b')?.width, '100%');
```
You should give `.bb2b` a `height` of `100%`.
Du solltest `.bb2b` eine `height` von `100%` geben.
```js
assert.equal(new __helpers.CSSHelp(document).getStyle('.bb2b')?.height, '100%');

2
curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98fb.md
View File

@@ -7,7 +7,7 @@ dashedName: step-51
# --description--
Gradient transitions often gradually change from one color to another. You can make the change a solid line like this:
Farbverlaufs-Übergänge ändern sich oft schrittweise von einer Farbe zur anderen. Du kannst die Änderung als durchgezogene Linie wie folgt vornehmen:
```css
linear-gradient(

4
curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98fc.md
View File

@@ -7,11 +7,11 @@ dashedName: step-52
# --description--
You can see the hard color change at the top of the section. Change the gradient type from `linear-gradient` to `repeating-linear-gradient` for this section. This will make the four colors of your gradient repeat until it gets to the bottom of the element; giving you some stripes, and saving you from having to add a bunch of elements to create them.
Du kannst den harten Farbwechsel am Anfang des Abschnittes sehen. Ändere für diesen Abschnitt den Verlaufstyp von `linear-gradient` auf `repeating-linear-gradient`. Dadurch werden die vier Farben deines Farbverlaufs wiederholt bis es an den unteren Rand des Elements angelangt; so erhälst du ein paar Streifen und wirst davor bewahrt, eine Reihe von Elementen hinzufügen zu müssen, um sie zu erstellen.
# --hints--
You should change the `background` property of `.bb2b` from using `linear-gradient` to using `repeating-linear-gradient`.
Du solltest die `background`-Eigenschaft der `.bb2b` so verändern, dass sie anstatt `linear-gradient` den `repeating-linear-gradient` verwendet.
```js
assert.equal(new __helpers.CSSHelp(document).getStyle(`.bb2b`)?.getPropVal('background', true), "repeating-linear-gradient(var(--building-color2),var(--building-color2)6%,var(--window-color2)6%,var(--window-color2)9%)");

16
curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98fe.md
View File

@@ -7,7 +7,7 @@ dashedName: step-54
# --description--
Add these properties to `.bb2a`:
Füge diese Eigenschaften zu `.bb2a` hinzu:
```css
margin: auto;
@@ -19,23 +19,23 @@ border-left: 1vw solid #999;
border-right: 1vw solid #999;
```
After you add these, you can see how a thick border on an element gives you some angles where two sides meet. You are going to use that bottom border as the top of the building.
After you add these, you can see how a thick border on an element gives you some angles where two sides meet. Du wirst den unteren Rand als den Anfang des Bauelements verwenden.
# --hints--
You should give `.bb2a` a `margin` of `auto`.
Du solltest `.bb2a` eine `margin` von `auto` geben.
```js
assert.equal(new __helpers.CSSHelp(document).getStyle('.bb2a')?.margin, "auto");
```
You should give `.bb2a` a `width` of `auto`.
Du solltest `.bb2a` eine `width` von `auto` geben.
```js
assert.equal(new __helpers.CSSHelp(document).getStyle('.bb2a')?.width, "5vw");
```
You should give `.bb2a` a `height` of `5vw`.
Du solltest `.bb2a` eine `height` von `5vw` geben.
```js
assert.equal(new __helpers.CSSHelp(document).getStyle('.bb2a')?.height, "5vw");
@@ -47,19 +47,19 @@ You should give `.bb2a` a `border-top` of `1vw solid #000`.
assert.equal(new __helpers.CSSHelp(document).getStyle('.bb2a')?.borderTop, "1vw solid rgb(0, 0, 0)");
```
You should give `.bb2a` a `border-bottom` of `1vw solid #000`.
Du solltest `.bb2a` einen `border-bottom` von `1vw solid #000` geben.
```js
assert.equal(new __helpers.CSSHelp(document).getStyle('.bb2a')?.borderBottom, "1vw solid rgb(0, 0, 0)");
```
You should give `.bb2a` a `border-left` of `1vw solid #999`.
Du solltest `.bb2a` einen `border-left` von `1vw solid #999` geben.
```js
assert.equal(new __helpers.CSSHelp(document).getStyle('.bb2a')?.borderLeft, "1vw solid rgb(153, 153, 153)");
```
You should give `.bb2a` a `border-right` of `1vw solid #999`.
Du solltest `.bb2a` eine `border-right` von `1vw solid #999` geben.
```js
assert.equal(new __helpers.CSSHelp(document).getStyle('.bb2a')?.borderRight, "1vw solid rgb(153, 153, 153)");

10
curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e98ff.md
View File

@@ -7,29 +7,29 @@ dashedName: step-55
# --description--
Next, remove the `width` and `height` from `.bb2a`, and change the `border-left` and `border-right` to use `5vw` instead of `1vw`. The element will now have zero size and the borders will come together in the middle.
Entferne als nächstes die `width` und `height` aus `.bb2a` und ändere die `border-left` und `border-right` so, dass sie `5vw` statt `1vw` verwenden. Das Element hat jetzt die Größe Null und die Ränder kommen in der Mitte zusammen.
# --hints--
You should remove the `width` from `.bb2a`.
Du solltest die `width` aus `.bb2a` entfernen.
```js
assert.isEmpty(new __helpers.CSSHelp(document).getStyle(".bb2a")?.width);
```
You should remove the `height` from `.bb2a`.
Du solltest die `height` aus `.bb2a` entfernen.
```js
assert.isEmpty(new __helpers.CSSHelp(document).getStyle(".bb2a")?.height);
```
You should change the `border-left` to use `5vw`.
Du solltest den `border-left` so ändern, dass er `5vw` verwendet.
```js
assert.equal(new __helpers.CSSHelp(document).getStyle(".bb2a")?.borderLeft, "5vw solid rgb(153, 153, 153)");
```
You should change the `border-right` to use `5vw`.
Du solltest den `border-right` so ändern, dass er `5vw` verwendet.
```js
assert.equal(new __helpers.CSSHelp(document).getStyle(".bb2a")?.borderRight, "5vw solid rgb(153, 153, 153)");

6
curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e9902.md
View File

@@ -11,19 +11,19 @@ Finally, on the `border-bottom` property of `.bb2a`, change the `1vw` to `5vh` a
# --hints--
You should change `border-bottom` to use `5vh`.
Du solltest `border-bottom` so ändern, dass er `5vh` verwendet.
```js
assert.include(new __helpers.CSSHelp(document).getStyle(".bb2a")?.borderBottom, "5vh");
```
You should change `border-bottom` to use `--building-color2`.
Du solltest `border-bottom` so ändern, dass er `--building-color2` verwendet.
```js
assert.include(new __helpers.CSSHelp(document).getStyle(".bb2a")?.borderBottom.trim(), "var(--building-color2)");
```
`border-bottom` should be `5vh solid var(--building-color2)`.
`border-bottom` sollte `5vh solid var(--building-color2)` entsprechen.
```js
assert.equal(new __helpers.CSSHelp(document).getStyle(".bb2a")?.borderBottom.trim(), "5vh solid var(--building-color2)");

2
curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e9903.md
View File

@@ -7,7 +7,7 @@ dashedName: step-59
# --description--
Auf zum nächsten Bauelement! Erstelle eine neue Variable namens `--window-color3` in `:root` und weise ihr den Wert `#d98cb3` zu. This will be the secondary color for the pink buildings.
Auf zum nächsten Bauelement! Erstelle eine neue Variable namens `--window-color3` in `:root` und weise ihr den Wert `#d98cb3` zu. Dies wird die Sekundärfarbe für die rosa Bauelemente sein.
# --hints--

12
curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e990a.md
View File

@@ -11,37 +11,37 @@ Move the `display`, `flex-direction`, and `align-items` properties and values fr
# --hints--
You should remove `display` from `.bb1`.
Du solltest `display` aus `.bb1` entfernen.
```js
assert.isEmpty(new __helpers.CSSHelp(document).getStyle(".bb1")?.display);
```
You should move `display` with a value of `flex` to `.building-wrap`.
Du solltest `display` mit einem Wert von `flex` nach `.building-wrap` verschieben.
```js
assert.equal(new __helpers.CSSHelp(document).getStyle(".building-wrap")?.display, "flex");
```
You should remove `flex-direction` from `.bb1`.
Du solltest `flex-direction` aus `.bb1` entfernen.
```js
assert.isEmpty(new __helpers.CSSHelp(document).getStyle(".bb1")?.flexDirection);
```
You should move `flex-direction` with a value of `column` to `.building-wrap`.
Du solltest `flex-direction` mit einem Wert von `column` nach `.building-wrap` verschieben.
```js
assert.equal(new __helpers.CSSHelp(document).getStyle(".building-wrap")?.flexDirection, "column");
```
You should remove `align-items` from `.bb1`.
Du solltest `align-items` aus `.bb1` verschieben.
```js
assert.isEmpty(new __helpers.CSSHelp(document).getStyle(".bb1")?.alignItems);
```
You should move `align-items` with a value of `center` to `.building-wrap`.
Du solltest `align-items` mit einem Wert von `center` nach `.building-wrap` verschieben.
```js
assert.equal(new __helpers.CSSHelp(document).getStyle(".building-wrap")?.alignItems, "center");

2
curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e990b.md
View File

@@ -7,7 +7,7 @@ dashedName: step-67
# --description--
Add the new `building-wrap` class to the `.bb1` and `.bb4` elements. This will apply the centering properties to the buildings that need it.
Add the new `building-wrap` class to the `.bb1` and `.bb4` elements. Dies wird die zentrierenden Eigenschaften auf die Bauelemente anwenden, die sie benötigen.
# --hints--

6
curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e990c.md
View File

@@ -7,17 +7,17 @@ dashedName: step-68
# --description--
Create a new variable called `--window-color4` in `:root` and give it a value of `#8cb3d9`. This will be the secondary color for the last background building.
Erstelle eine neue Variable namens `--window-color4` in `:root` und gib ihr einen Wert von `#8cb3d9`. This will be the secondary color for the last background building.
# --hints--
You should define a new property variable `--window-color4`.
Du solltest eine neue Eigenschaftsvariable `--window-color4` definieren.
```js
assert(new __helpers.CSSHelp(document).isPropertyUsed("--window-color4"));
```
You should give `--window-color4` a value of `#8cb3d9`.
Du solltest `--window-color4` einen Wert von `#8cb3d9` geben.
```js
assert.equal(new __helpers.CSSHelp(document).getStyle(":root")?.getPropertyValue("--window-color4")?.trim(), "#8cb3d9");

6
curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e990d.md
View File

@@ -7,17 +7,17 @@ dashedName: step-69
# --description--
Nest four new `div` elements within `.bb4c`, give them all the class of `bb4-window`. These will be windows for this building.
Niste vier neue `div`-Elemente innerhalb `.bb4c`, gib ihnen alle eine Klasse von `bb4-window`. Dies werden die Fenster für dieses Bauelement sein.
# --hints--
You should add four `div` elements to `.bb4c`.
Du solltest vier `div`-Elemente zu `.bb4c` hinzufügen.
```js
assert.equal(document.querySelector(".bb4c")?.children?.length, 4);
```
You should give each new `div` a class of `bb4-window`.
Du solltest jedem neuen `div` eine Klasse von `bb4-window` geben.
```js
assert.equal(document.querySelectorAll("div.bb4c > div.bb4-window")?.length, 4);

8
curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e990e.md
View File

@@ -7,23 +7,23 @@ dashedName: step-70
# --description--
Give the `bb4-window` class a `width` of `18%`, a `height` of `90%`, and add your `--window-color4` variable as the `background-color`.
Gib der `bb4-window`-Klasse eine `width` von `18%`, eine `height` von `90%` und füge deine `--window-color4`-Variable als die `background-color` hinzu.
# --hints--
You should give `.bb4-window` a `width` of `18%`.
Du solltest `.bb4-window` eine `width` von `18%` geben.
```js
assert.equal(new __helpers.CSSHelp(document).getStyle(".bb4-window")?.width, "18%");
```
You should give `.bb4-window` a `height` of `90%`.
Du solltest `.bb4-window` eine `height` von `90%` geben.
```js
assert.equal(new __helpers.CSSHelp(document).getStyle(".bb4-window")?.height, "90%");
```
You should give `.bb4-window` a `background-color` of `--window-color4`.
Du solltest `.bb4-window` eine `background-color` von `--window-color4` geben.
```js
assert.equal(new __helpers.CSSHelp(document).getStyle(".bb4-window")?.backgroundColor.trim(), "var(--window-color4)");

10
curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e990f.md
View File

@@ -8,29 +8,29 @@ dashedName: step-71
# --description--
The windows are stacked on top of each other at the left of the section, behind the purple building. Add a new class below `.building-wrap` called `window-wrap`. Make `.window-wrap` a flexbox container, and use the `align-items` and `justify-content` properties to center its child elements vertically and evenly space them in their parent, respectively.
Die Fenster sind links neben dem Abschnitt, hinter dem violetten Bauelement, aufeinander gestapelt. Füge eine neue Klasse namens `window-wrap` unter `.building-wrap` hinzu. Mache `.window-wrap` zu einem Flexbox-Container und verwende die `align-items` und `justify-content`-Eigenschaften, um seine untergeordneten Elemente vertikal zu zentrieren bzw. um sie gleichmäßig im übergeordneten Element zu verteilen.
# --hints--
You should create a `.window-wrap` selector.
Du solltest einen `.window-wrap`-Selektor erstellen.
```js
assert.exists(new __helpers.CSSHelp(document).getStyle(".window-wrap"));
```
You should give `.window-wrap` a `display` of `flex`.
Du solltest `.window-wrap` einen `display` von `flex` geben.
```js
assert.equal(new __helpers.CSSHelp(document).getStyle(".window-wrap")?.display, "flex");
```
You should give `.window-wrap` an `align-items` of `center`.
Du solltest `.window-wrap` ein `align-items` mit dem Wert `center` geben.
```js
assert.equal(new __helpers.CSSHelp(document).getStyle(".window-wrap")?.alignItems, "center");
```
You should give `.window-wrap` a `justify-content` of `space-evenly`.
Du solltest `.window-wrap` einen `justify-content` mit dem Wert `space-evenly` geben.
```js
assert.equal(new __helpers.CSSHelp(document).getStyle(".window-wrap")?.justifyContent, "space-evenly");

6
curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e991a.md
View File

@@ -7,7 +7,7 @@ dashedName: step-81
# --description--
Auf zum nächsten Bauelement! Nest two `div` elements within `.fb2` and give them classes of `fb2a` and `fb2b`, in that order.
Auf zum nächsten Bauelement! Bette zwei `div`-Elemente innerhalb des `.fb2` ein und weise ihnen in Reihenfolge die Klassen `fb2a` und `fb2b` zu.
# --hints--
@@ -17,14 +17,14 @@ Du solltest innerhalb `.fb2` zwei `div`-Elemente hinzufügen.
assert.equal(document.querySelectorAll("div.fb2 > div")?.length, 2);
```
You should give the first new `div` a class of `fb2a`.
Du solltest dem ersten neuen `div` die Klasse `fb2a` zuweisen.
```js
assert.exists(document.querySelector("div.fb2 > div.fb2a"));
assert(document.querySelector("div.fb2 > div.fb2a") === document.querySelector("div.fb2")?.firstElementChild);
```
You should give the second new `div` a class of `fb2b`.
Du solltest dem zweiten neuen `div` die Klasse `fb2b` zuweisen.
```js
assert.exists(document.querySelector("div.fb2 > div.fb2b"));

8
curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e991b.md
View File

@@ -7,23 +7,23 @@ dashedName: step-82
# --description--
Give `.fb2a` a `width` of `100%` and `.fb2b` a `width` of `100%` and `height` of `75%`.
Gib `.fb2a` eine `width` von `100%` und `.fb2b` eine `width` von `100%` und `height` von `75%`.
# --hints--
You should give `.fb2a` a `width` of `100%`.
Du solltest `.fb2a` eine `width` von `100%` geben.
```js
assert.equal(new __helpers.CSSHelp(document).getStyle(".fb2a")?.width, "100%");
```
You should give `.fb2b` a `width` of `100%`.
Du solltest `.fb2b` eine `width` von `100%` geben.
```js
assert.equal(new __helpers.CSSHelp(document).getStyle(".fb2b")?.width, "100%");
```
You should give `.fb2b` a `height` of `75%`.
Du solltest `.fb2b` eine `height` von `75%` geben.
```js
assert.equal(new __helpers.CSSHelp(document).getStyle(".fb2b")?.height, "75%");

6
curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e991c.md
View File

@@ -7,17 +7,17 @@ dashedName: step-83
# --description--
Nest three `div` elements within `.fb2b` and give them a class of `fb2-window`. These will be windows for this section of the building.
Niste drei `div`-Elemente innerhalb von `.fb2b` und gib ihnen eine Klasse von `fb2-window`. Dies werden die Fenster für diesen Abschnitt des Bauelements sein.
# --hints--
You should add three `div` elements within `.fb2b`.
Du solltest drei `div`-Elemente innerhalb von `.fb2b` hinzufügen.
```js
assert.equal(document.querySelectorAll("div.fb2b > div")?.length, 3);
```
You should give the three new `div` elements each a class of `fb2-window`.
Du solltest den drei neuen `div` Elementen jeweils eine Klasse von `fb2-window` geben.
```js
assert.equal(document.querySelectorAll("div.fb2-window")?.length, 3);

4
curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e991d.md
View File

@@ -7,11 +7,11 @@ dashedName: step-84
# --description--
Add your `window-wrap` class to `.fb2b` to position the new window elements.
Füge deine `window-wrap`-Klasse zu `.fb2b` hinzu, um deine neuen Fensterelemente zu positionieren.
# --hints--
You should add the class `window-wrap` to `.fb2b`.
Du solltest deine Klasse `window-wrap` zu `.fb2b` hinzufügen.
```js
assert.exists(document.querySelector("div.fb2b.window-wrap"));

8
curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e991e.md
View File

@@ -7,23 +7,23 @@ dashedName: step-85
# --description--
Give the `.fb2-window` elements a `width` of `22%`, `height` of `100%`, and a `background-color` of your `--window-color3` variable.
Gib den `.fb2-window`-Elementen eine `width` von `22%`, `height` von `100%` und eine `background-color` aus deiner `--window-color3` Variable.
# --hints--
You should give the `.fb2-window` elements a `width` of `22%`.
Du solltest den `.fb2-window`-Elementen eine `width` von `22%` geben.
```js
assert.equal(new __helpers.CSSHelp(document).getStyle(".fb2-window")?.width, "22%");
```
You should give the `.fb2-window` elements a `height` of `100%`.
Du solltest den `.fb2-window`-Elementen eine `height` von `100%` geben.
```js
assert.equal(new __helpers.CSSHelp(document).getStyle(".fb2-window")?.height, "100%");
```
You should give the `.fb2-window` elements a `background-color` of `--window-color3`.
Du solltest den `.fb2-window`-Elementen eine `background-color` von `--window-color3` geben.
```js
assert.equal(new __helpers.CSSHelp(document).getStyle(".fb2-window")?.backgroundColor.trim(), "var(--window-color3)");

6
curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e991f.md
View File

@@ -7,17 +7,17 @@ dashedName: step-86
# --description--
Move the `background-color` property and value from `.fb2` to `.fb2b` to just color the section and not the container.
Verschiebe die `background-color`-Eigenschaft und den Wert von `.fb2` nach `.fb2b`, um nur den Abschnitt und nicht den Container zu färben.
# --hints--
You should remove the `background-color` property from `.fb2`.
Du solltest die `background-color`-Eigenschaft aus `.fb2` verschieben.
```js
assert.isEmpty(new __helpers.CSSHelp(document).getStyle(".fb2")?.backgroundColor);
```
You should give `.fb2b` a `background-color` of `--building-color3`.
Du solltest `.fb2b` eine `background-color` von `--building-color3` geben.
```js
assert.equal(new __helpers.CSSHelp(document).getStyle(".fb2b")?.backgroundColor.trim(), "var(--building-color3)");

2
curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e9927.md
View File

@@ -7,7 +7,7 @@ dashedName: step-94
# --description--
Add your `window-wrap` class to the `.fb3a` element to center and space the windows.
Füge deine `window-wrap`-Klasse zu dem `.fb3a`-Element hinzu, um die Fenster zu zentrieren und zu verteilen.
# --hints--

6
curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e992a.md
View File

@@ -7,17 +7,17 @@ dashedName: step-97
# --description--
Give `.fb4b` a `width` of `100%` and `height` of `89%`.
Gib `.fb4b` eine `width` von `100%` und `height` von `89%`.
# --hints--
You should give `.fb4b` a `width` of `100%`.
Du solltest `.fb4b` eine `width` von `100%` geben.
```js
assert.equal(new __helpers.CSSHelp(document).getStyle(".fb4b")?.width, "100%");
```
You should give `.fb4b` a `height` of `89%`.
Du solltest `.fb4b` eine `height` von `89%` geben.
```js
assert.equal(new __helpers.CSSHelp(document).getStyle(".fb4b")?.height, "89%");

6
curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e992b.md
View File

@@ -7,17 +7,17 @@ dashedName: step-98
# --description--
Add your `--building-color1` variable as value of the `background-color` property of `.fb4b`. Then, remove the `background-color` from `.fb4`.
Füge deine `--building-color1`-Variable als Wert der `background-color`-Eigenschaft von `.fb4b` hinzu. Entferne dann die `background-color` von `.fb4`.
# --hints--
You should remove the `background-color` from `.fb4`.
Du solltest die `background-color` aus `.fb4` entfernen.
```js
assert.isEmpty(new __helpers.CSSHelp(document).getStyle(".fb4")?.backgroundColor);
```
You should give `.fb4b` a `background-color` of `--building-color1`.
Du solltest `.fb4b` eine `background-color` von `--building-color1` geben.
```js
assert.equal(new __helpers.CSSHelp(document).getStyle(".fb4b")?.backgroundColor.trim(), "var(--building-color1)");

4
curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e992c.md
View File

@@ -7,7 +7,7 @@ dashedName: step-99
# --description--
Nest six `div` elements within `.fb4b` and give them all a class of `fb4-window`.
Bette innerhalb `.fb4b` sechs `div`-Elemente ein und weise ihnen allen die Klasse `fb4-window` zu.
# --hints--
@@ -17,7 +17,7 @@ Du solltest innerhalb `.fb4b` sechs `div`-Elemente hinzufügen.
assert.equal(document.querySelectorAll("div.fb4b > div")?.length, 6);
```
You should give each new `div` a class of `fb4-window`.
Du solltest jedem neuen `div` die Klasse `fb4-window` zuweisen.
```js
assert.equal(document.querySelectorAll("div.fb4-window")?.length, 6);

8
curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e992d.md
View File

@@ -7,23 +7,23 @@ dashedName: step-100
# --description--
Give the `.fb4-window` elements a `width` of `30%`, `height` of `10%`, and `border-radius` of `50%`. These will make some circular windows for this building.
Gib den `.fb4-window`-Elementen eine `width` von `30%`, `height` von `10%` und `border-radius` von `50%`. Dies wird einige kreisförmige Fenster für dieses Bauelement schaffen.
# --hints--
You should give `.fb4-window` a `width` of `30%`.
Du solltest `.fb4-window` eine `width` von `30%` geben.
```js
assert.equal(new __helpers.CSSHelp(document).getStyle(".fb4-window")?.width, "30%");
```
You should give `.fb4-window` a `height` of `10%`.
Du solltest `.fb4-window` eine `height` von `10%` geben.
```js
assert.equal(new __helpers.CSSHelp(document).getStyle(".fb4-window")?.height, "10%");
```
You should give `.fb4-window` a `border-radius` of `50%`.
Du solltest `.fb4-window` einen `border-radius` von `50%` geben.
```js
assert.equal(new __helpers.CSSHelp(document).getStyle(".fb4-window")?.borderRadius, "50%");

6
curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e992e.md
View File

@@ -7,17 +7,17 @@ dashedName: step-101
# --description--
Fill in the windows with your secondary color for this building. Also add a `margin` of `10%` to give the windows some space.
Fülle die Fenster dieses Bauelement mit deiner Sekundärfarbe aus. Füge außerden eine `margin` von `10%` hinzu, um den Fenstern etwas Abstand zu geben.
# --hints--
You should give `.fb4-window` a `background-color` of `--window-color1`.
Du solltest `.fb4-window` eine `background-color` von `--window-color1` geben.
```js
assert.equal(new __helpers.CSSHelp(document).getStyle(".fb4-window")?.backgroundColor.trim(), "var(--window-color1)");
```
You should give `.fb4-window` a `margin` of `10%`.
Du solltest `.fb4-window` eine `margin` von `10%` geben.
```js
assert.equal(new __helpers.CSSHelp(document).getStyle(".fb4-window")?.margin, "10%");

6
curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e992f.md
View File

@@ -7,17 +7,17 @@ dashedName: step-102
# --description--
The windows are stacked on top of each other on the rightmost purple building. Turn the building into a flexbox parent, and use the `flex-wrap` property to put the windows side by side, and push them down to a new row when they don't fit.
Die Fenster sind auf dem violetten Bauelement ganz rechts übereinander gestapelt. Verwandle das Bauelement in eine übergeordnete Flexbox und verwende die `flex-wrap`-Eigenschaft, um die Fenster nebeneinander zu platzieren und sie in eine neue Reihe zu schieben, wenn der Platz nicht ausreicht.
# --hints--
You should give `.fb4b` a `display` of `flex`.
Du solltest `.fb4b` eine `display` von `flex` geben.
```js
assert.equal(new __helpers.CSSHelp(document).getStyle(".fb4b")?.display, "flex");
```
You should give `.fb4b` a `flex-wrap` of `wrap`.
Du solltest `.fb4b` einen `flex-wrap` von `wrap` geben.
```js
assert.equal(new __helpers.CSSHelp(document).getStyle(".fb4b")?.flexWrap, "wrap");

2
curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e9939.md
View File

@@ -7,7 +7,7 @@ dashedName: step-113
# --description--
Füge `circle closest-corner at 15% 15%,` am oberen Rand der Farbverlaufsliste des Himmels hinzu, wo du eine Richtung für den Farbverlauf setzen würdest. This will move the start of the gradient to `15%` from the top and left. It will make it end at the `closest-corner` and it will maintain a `circle` shape. These are some keywords built into gradients to describe how it behaves.
Füge `circle closest-corner at 15% 15%,` am oberen Rand der Farbverlaufsliste des Himmels hinzu, wo du eine Richtung für den Farbverlauf setzen würdest. This will move the start of the gradient to `15%` from the top and left. It will make it end at the `closest-corner` and it will maintain a `circle` shape. Dies sind einige Schlüsselwörter, die in Farbverläufe eingebaut werden, um zu beschreiben, wie sie sich verhalten sollen.
# --hints--

6
curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e993a.md
View File

@@ -7,7 +7,7 @@ dashedName: step-114
# --description--
A media query can be used to change styles based on certain conditions, and they look like this:
Eine Media Query kann verwendet werden, um Stile auf Grundlage von bestimmten Bedingungen zu ändern, und sie sehen folgendermaßen aus:
```css
@media (condition) {
@@ -15,11 +15,11 @@ A media query can be used to change styles based on certain conditions, and they
}
```
Add an empty media query at the bottom of your stylesheet with a condition of `max-width: 1000px`. Styles added in here will take effect when the document size is 1000px wide or less.
Füge eine leere Media Query am Ende deines Stylesheets mit einer Bedingung von `max-width: 1000px` hinzu. Die hier hinzugefügten Stile werden wirksam, wenn die Dokumentgröße 1000px breit oder kleiner ist.
# --hints--
You should add an empty media query with `max-width: 1000px`.
Du solltest eine leere Media Query mit `max-width: 1000px` hinzufügen.
```js
assert.equal(new __helpers.CSSHelp(document).getCSSRules("media")?.[0]?.media?.mediaText, '(max-width: 1000px)');

8
curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e993c.md
View File

@@ -7,23 +7,23 @@ dashedName: step-116
# --description--
In the `sky` class of the media query, change the two `#ffcf33` color values to `#ccc`, the `#ffff66` to `#445`, and the `#bbeeff` to `#223`. Then you can resize your window to see the background change colors.
Ändere in der `sky`-Klasse der Media Query die beiden `#ffcf33`-Farbwerte in `#ccc`, die `#ffff66` in `#445` und die `#bbeeff` in `#223` um. Dann kannst du die Größe deines Fensters ändern, um zu sehen, wie der Hintergrund seine Farbe ändert.
# --hints--
You should change the first color values from `#ffcf33` to `#ccc`.
Du solltest die ersten Farbwerte von `#ffcf33` zu `#ccc` ändern.
```js
assert.match(new __helpers.CSSHelp(document).getRuleListsWithinMedia("(max-width: 1000px)")?.find(x => x.selectorText===".sky")?.style?.background, /radial-gradient\(\s*circle\s+closest-corner\s+at\s+15%\s+15%\s*,\s+rgb\(\s*204\s*,\s*204\s*,\s*204\s*\)\s*(0%)?\s*,\s*rgb\(\s*204\s*,\s*204\s*,\s*204\s*\)\s+20%/);
```
You should change the second color value from `#ffff66` to `#445`.
Du solltest den zweiten Farbwert von `#ffff66` in `#445` ändern.
```js
assert.match(new __helpers.CSSHelp(document).getRuleListsWithinMedia("(max-width: 1000px)")?.find(x => x.selectorText===".sky")?.style?.background, /radial-gradient\(\s*circle\s+closest-corner\s+at\s+15%\s+15%\s*,\s+rgb\(\s*204\s*,\s*204\s*,\s*204\s*\)\s*(0%)?\s*,\s*rgb\(\s*204\s*,\s*204\s*,\s*204\s*\)\s+20%\s*,\s*rgb\(\s*68\s*,\s*68\s*,\s*85\s*\)\s+21%/);
```
You should change the third color value from `#bbeeff` to `#223`.
Du solltest den dritten Farbwert von `#bbeeff` in `#223` ändern.
```js
assert.match(new __helpers.CSSHelp(document).getRuleListsWithinMedia("(max-width: 1000px)")?.find(x => x.selectorText===".sky")?.style?.background, /radial-gradient\(\s*circle\s+closest-corner\s+at\s+15%\s+15%\s*,\s+rgb\(\s*204\s*,\s*204\s*,\s*204\s*\)\s*(0%)?\s*,\s*rgb\(\s*204\s*,\s*204\s*,\s*204\s*\)\s+20%\s*,\s*rgb\(\s*68\s*,\s*68\s*,\s*85\s*\)\s+21%\s*,\s*rgb\(\s*34\s*,\s*34\s*,\s*51\s*\)\s+100%\s*\)/);

4
curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e993d.md
View File

@@ -7,7 +7,7 @@ dashedName: step-117
# --description--
Füge oben in der Media Query einen `:root`-Selektor hinzu. Then redefine all four of the `--building-color` variables to use the value `#000` there.
Füge oben in der Media Query einen `:root`-Selektor hinzu. Definiere dann alle vier der `--building-color`-Variablen neu, sodass sie dort den Wert `#000` verwenden.
# --hints--
@@ -17,7 +17,7 @@ Du solltest der Media Query einen `:root`-Selektor hinzufügen.
assert.notDeepEqual(new __helpers.CSSHelp(document).getRuleListsWithinMedia("(max-width: 1000px)")?.find(x=>x.selectorText === ":root"), undefined);
```
You should add `--building-color1` with a value of `#000`.
Du solltest `--building-color1` mit einem Wert von `#000` hinzufügen.
```js
assert.equal(new __helpers.CSSHelp(document).getRuleListsWithinMedia("(max-width: 1000px)")?.find(x=>x.selectorText === ":root")?.style?.getPropertyValue("--building-color1")?.trim(), "#000");

2
curriculum/challenges/german/14-responsive-web-design-22/learn-css-variables-by-building-a-city-skyline/5d822fd413a79914d39e993e.md
View File

@@ -9,7 +9,7 @@ dashedName: step-118
Definiere schließlich alle vier `--window-color`-Variablen im `:root`-Selektor der MediaQuery neu, um `#777` zu verwenden. Wenn du damit fertig bist, ändere die Größe des Fensters und beobachte, wie es vom Tag zur Nacht wird.
Variablen werden in erster Linie mit Farben verwendet, und so hast du sie auch hier verwendet. But they can be given any value and used on any property. Dein Projekt sieht großartig aus!
Variablen werden in erster Linie mit Farben verwendet, und so hast du sie auch hier verwendet. Sie können jedoch einen beliebigen Wert erhalten und für jede Eigenschaft verwendet werden. Dein Projekt sieht großartig aus!
# --hints--

4
curriculum/challenges/german/14-responsive-web-design-22/learn-html-forms-by-building-a-registration-form/60ffecefac971607ae73c60f.md
View File

@@ -7,7 +7,7 @@ dashedName: step-62
# --description--
Speaking of `padding`, the submit button is sitting at the bottom of the `form` element. Füge nur im unteren Teil des `form` `2em` von `padding` hinzu.
Apropos `padding`, der Bestätigungsbutton liegt im unteren Teil des `form`-Elements. Füge nur im unteren Teil des `form` `2em` von `padding` hinzu.
# --hints--
@@ -17,7 +17,7 @@ Du solltest die `padding-bottom`-Eigenschaft verwenden.
assert.isNotEmpty(new __helpers.CSSHelp(document).getStyle('form')?.paddingBottom);
```
You should give the `padding-bottom` a value of `2em`.
Du solltest der `padding-bottom` den Wert `2em` zuweisen.
```js
assert.equal(new __helpers.CSSHelp(document).getStyle('form')?.paddingBottom, '2em');

2
curriculum/challenges/german/14-responsive-web-design-22/learn-intermediate-css-by-building-a-picasso-painting/60b69a66b6ddb80858c515b9.md
View File

@@ -7,7 +7,7 @@ dashedName: step-68
# --description--
Use an id selector to create a rule for the element with the id `eyes-div`. Set the `width` to `180px` and the `height` to `50px`.
Verwende einen ID-Selektor, um eine Regel für das Element mit der ID `eyes-div` zu erstellen. Set the `width` to `180px` and the `height` to `50px`.
# --hints--

4
curriculum/challenges/german/14-responsive-web-design-22/learn-more-about-css-pseudo-selectors-by-building-a-balance-sheet/62015a5da1c95c358f079ebb.md
View File

@@ -7,9 +7,9 @@ dashedName: step-37
# --description--
Der `:first-of-type`-Pseudo-Selektor wird verwendet, um das erste Element anzuvisieren, das mit dem Selektor übereinstimmt. Erstelle einen `h1 .flex span:first-of-type`-Selektor, um das erste `span`-Element in deinem `.flex`-Container anzuvisieren. Remember that your `span` elements are reversed, visually, so this will appear to be the second element on the page.
Der `:first-of-type`-Pseudo-Selektor wird verwendet, um das erste Element anzuvisieren, das mit dem Selektor übereinstimmt. Erstelle einen `h1 .flex span:first-of-type`-Selektor, um das erste `span`-Element in deinem `.flex`-Container anzuvisieren. Denke daran, dass deine `span`-Elemente visuell umgekehrt sind, sodass dies als zweites Element auf der Seite erscheint.
Give your new selector a `font-size` property of `0.7em` to make it look like a sub-heading.
Weise deinem neuen Selektor eine `font-size`-Eigenschaft von `0.7em` zu, damit er wie eine Unterüberschrift aussieht.
# --hints--

2
curriculum/challenges/german/14-responsive-web-design-22/learn-responsive-web-design-by-building-a-piano/612e89562043183c86df287c.md
View File

@@ -7,7 +7,7 @@ dashedName: step-9
# --description--
Browsers can apply default margin and padding values to specific elements. To make sure your piano looks correct, you need to reset the box model.
Browser können auf bestimmte Elemente Standardwerte für Margin und Padding anwenden. Um sicherzustellen, dass dein Klavier richtig aussieht, musst du das Boxmodell zurücksetzen.
Füge einen `html`-Regelselektor zu deiner CSS-Datei hinzu und setze die `box-sizing`-Eigenschaft auf `border-box`.

2
curriculum/challenges/german/14-responsive-web-design-22/learn-the-css-box-model-by-building-a-rothko-painting/60a3e3396c7b40068ad6998a.md
View File

@@ -7,7 +7,7 @@ dashedName: step-32
# --description--
Center the `.three` element on the canvas by setting its `margin` to `auto`.
Zentriere das `.three`-Element auf der Canvas, indem du seine `margin` auf `auto` setzt.
# --hints--

16
curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/613e275749ebd008e74bb62e.md
View File

@@ -9,17 +9,27 @@ dashedName: step-8
Una proprietà utile di un _SVG_ (scalable vector graphics - grafica vettoriale scalabile) è che contiene un attributo `path` che permette di scalare l'immagine senza influenzare la risoluzione dell'immagine risultante.
Attualmente, l'elemento `img` sta assumendo la sua dimensione predefinita, che è troppo grande. Ridimensiona l'immagine correttamente usando il suo `id` come selettore e impostando la proprietà `width` a `max(100px, 18vw)`.
Attualmente, l'elemento `img` sta assumendo la sua dimensione predefinita, che è troppo grande. CSS has a `max` function which returns the largest of a set of comma-separated values. For example:
```css
img {
width: max(250px, 25vw);
}
```
In this example, `img` elements will have a minimum width of `250px`. And as the viewport grows, the image will grow accordingly to be 25 percent of the viewport width.
Scale the image using its `id` as a selector, and setting the `width` to to be the maximum of `100px` or `18vw`.
# --hints--
Dovresti usare il selettore `#logo` per selezionare l'elemento `img`.
You should use the `#logo` selector to target the `img` element.
```js
assert.exists(new __helpers.CSSHelp(document).getStyle('#logo'));
```
Dovresti dare a `img` una proprietà `width` con il valore `max(100px, 18vw)`.
You should give the `img` a `width` of `max(100px, 18vw)`.
```js
assert.equal(new __helpers.CSSHelp(document).getStyle('#logo')?.width, 'max(100px, 18vw)');

2
curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/614090d5a22b6f0a5a6b464c.md
View File

@@ -9,7 +9,7 @@ dashedName: step-13
# --description--
Seleziona gli elementi della lista non ordinata dentro gli elementi `nav` e usa _Flexbox_ per distanziare uniformemente gli elementi figli.
Use the `>` selector to target the unordered list elements within the `nav` elements, and use _Flexbox_ to evenly space the children.
# --hints--

2
curriculum/challenges/italian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f02240ff8f09f7ec913c.md
View File

@@ -7,7 +7,7 @@ dashedName: step-36
# --description--
All'interno degli elementi `div.question-block`, annida un elemento `label` e dai all'elemento `label` del contenuto di testo.
Within the `div.question-block` elements, nest one `label` element, and add a `CSS` related question to the `label` text.
# --hints--

16
curriculum/challenges/japanese/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/613e275749ebd008e74bb62e.md
View File

@@ -9,17 +9,27 @@ dashedName: step-8
_SVG_ (scalable vector graphics) の便利な特徴として、SVG は、画像の解像度に影響を与えずに拡大縮小することを可能にする `path` 属性を含みます。
今、`img` 要素はデフォルトのサイズが使われていますが、大きすぎるようです。 正しく表示するため、`id` をセレクターとして使用し、`width` の値を `max(100px, 18vw)` に設定して画像を縮小してください。
今、`img` 要素はデフォルトのサイズが使われていますが、大きすぎるようです。 CSS has a `max` function which returns the largest of a set of comma-separated values. For example:
```css
img {
width: max(250px, 25vw);
}
```
In this example, `img` elements will have a minimum width of `250px`. And as the viewport grows, the image will grow accordingly to be 25 percent of the viewport width.
Scale the image using its `id` as a selector, and setting the `width` to to be the maximum of `100px` or `18vw`.
# --hints--
`#logo` セレクターを使用して `img` 要素を選択する必要があります。
You should use the `#logo` selector to target the `img` element.
```js
assert.exists(new __helpers.CSSHelp(document).getStyle('#logo'));
```
`img` 要素の `width` を `max(100px, 18vw)` に設定する必要があります。
You should give the `img` a `width` of `max(100px, 18vw)`.
```js
assert.equal(new __helpers.CSSHelp(document).getStyle('#logo')?.width, 'max(100px, 18vw)');

2
curriculum/challenges/japanese/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/614090d5a22b6f0a5a6b464c.md
View File

@@ -9,7 +9,7 @@ dashedName: step-13
# --description--
`nav` 要素内の順序なしリスト要素を対象に、_フレックスボックス_ を使用して子要素の間隔を等しくしてください。
Use the `>` selector to target the unordered list elements within the `nav` elements, and use _Flexbox_ to evenly space the children.
# --hints--

2
curriculum/challenges/japanese/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f02240ff8f09f7ec913c.md
View File

@@ -7,7 +7,7 @@ dashedName: step-36
# --description--
`div.question-block` 要素内に `label` 要素を 1 つネストし、その `label` 要素にテキストコンテンツを入れてください
Within the `div.question-block` elements, nest one `label` element, and add a `CSS` related question to the `label` text.
# --hints--

2
curriculum/challenges/portuguese/03-front-end-development-libraries/sass/use-each-to-map-over-items-in-a-list.md
View File

@@ -44,7 +44,7 @@ Note que a variável `$key` é necessária para referenciar as chaves no mapa. C
# --instructions--
Escreva uma diretiva `@each` que passar por uma lista: `blue, black, red` e atribui cada variável à classe `.color-bg`, aonde a parte `color` coloca cada item na cor respectiva. Cada classe também deve definir a propriedade `background-color` para a respectiva cor.
Escreva uma diretiva `@each` que percorra uma lista, `blue, black, red`, e atribua cada variável à classe `.color-bg`, onde a parte `color` mude cada item para a cor respectiva. Cada classe também deve definir a propriedade `background-color` para a respectiva cor.
# --hints--

16
curriculum/challenges/portuguese/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/613e275749ebd008e74bb62e.md
View File

@@ -9,17 +9,27 @@ dashedName: step-8
Uma propriedade útil de um _SVG_ (gráficos vetoriais escaláveis) é o atributo `path` (caminho), que permite que a imagem seja dimensionada sem afetar a resolução da imagem resultante.
Atualmente, o `img` está assumindo que é o tamanho padrão, o que é muito grande. Para arrumar, dimensione a imagem usando o `id` como seletor e defina a largura `width` como `max(100px, 18vw)`.
Atualmente, o `img` está assumindo que é o tamanho padrão, o que é muito grande. CSS has a `max` function which returns the largest of a set of comma-separated values. For example:
```css
img {
width: max(250px, 25vw);
}
```
In this example, `img` elements will have a minimum width of `250px`. And as the viewport grows, the image will grow accordingly to be 25 percent of the viewport width.
Scale the image using its `id` as a selector, and setting the `width` to to be the maximum of `100px` or `18vw`.
# --hints--
Você deve usar o seletor `#logo` para direcionar o elemento `img`.
You should use the `#logo` selector to target the `img` element.
```js
assert.exists(new __helpers.CSSHelp(document).getStyle('#logo'));
```
Você deve dar à `img` uma `width` de `max(100px, 18vw)`.
You should give the `img` a `width` of `max(100px, 18vw)`.
```js
assert.equal(new __helpers.CSSHelp(document).getStyle('#logo')?.width, 'max(100px, 18vw)');

2
curriculum/challenges/portuguese/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/614090d5a22b6f0a5a6b464c.md
View File

@@ -9,7 +9,7 @@ dashedName: step-13
# --description--
Marque os elementos da lista não ordenados dentro dos elementos `nav` e use _Flexbox_ para espaçar igualmente os elementos filhos.
Use the `>` selector to target the unordered list elements within the `nav` elements, and use _Flexbox_ to evenly space the children.
# --hints--

2
curriculum/challenges/portuguese/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f02240ff8f09f7ec913c.md
View File

@@ -7,7 +7,7 @@ dashedName: step-36
# --description--
Dentro dos elementos `div.question-block`, aninhe um elemento `label` e dê ao elemento `label` conteúdo de texto
Within the `div.question-block` elements, nest one `label` element, and add a `CSS` related question to the `label` text.
# --hints--

2
curriculum/challenges/portuguese/15-javascript-algorithms-and-data-structures-22/learn-basic-javascript-by-building-a-role-playing-game/62a8e45cc600c3591cee671a.md
View File

@@ -17,7 +17,7 @@ Você deve usar a atribuição composta com `health`.
assert.match(attack.toString(), /health\s*-=/);
```
Você deve subtrair o nível atual de `health` do monstro.
Você deve subtrair o nível atual do monstro da `health` do personagem.
```js
assert.match(attack.toString(), /health\s*-=\s*monsters\[fighting\]\.level/);

2
curriculum/challenges/portuguese/15-javascript-algorithms-and-data-structures-22/learn-basic-javascript-by-building-a-role-playing-game/62aa20e9cf1be9358f5aceae.md
View File

@@ -7,7 +7,7 @@ dashedName: step-150
# --description--
Adicione uma instrução `else` à primeira instrução `if` dentro da função `attack()`. Na instrução `else`, use o operador `+=` para adicionar o texto `You miss.` até o final do `text.innerText`.
Adicione uma instrução `else` à primeira instrução `if` dentro da função `attack()`. Na instrução `else`, use o operador `+=` para adicionar o texto `You miss.` ao final de `text.innerText`.
# --hints--

16
curriculum/challenges/swahili/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/613e275749ebd008e74bb62e.md
View File

@@ -9,17 +9,27 @@ dashedName: step-8
Sifa muhimu ya _SVG_ (scalable vector graphics) ni kwamba ina sifa ya `path` ambayo inaruhusu picha kuongezwa bila kuathiri matokeo yake.
Kwa sasa, `img` inachukua ukubwa wake wa chaguomsingi, ambao ni mkubwa sana. Kwa usahihi, kadiria picha ukitumia `id` yake kama kiteuzi, na uweke `width` hadi `max(100px, 18vw)`.
Kwa sasa, `img` inachukua ukubwa wake wa chaguomsingi, ambao ni mkubwa sana. CSS has a `max` function which returns the largest of a set of comma-separated values. For example:
```css
img {
width: max(250px, 25vw);
}
```
In this example, `img` elements will have a minimum width of `250px`. And as the viewport grows, the image will grow accordingly to be 25 percent of the viewport width.
Scale the image using its `id` as a selector, and setting the `width` to to be the maximum of `100px` or `18vw`.
# --hints--
Unapaswa kutumia kichaguzi cha `#logo` ili kulenga kipengele cha `img`.
You should use the `#logo` selector to target the `img` element.
```js
assert.exists(new __helpers.CSSHelp(document).getStyle('#logo'));
```
Unapaswa kuipa `img` `width` ya `max(100px, 18vw)`.
You should give the `img` a `width` of `max(100px, 18vw)`.
```js
assert.equal(new __helpers.CSSHelp(document).getStyle('#logo')?.width, 'max(100px, 18vw)');

2
curriculum/challenges/swahili/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/614090d5a22b6f0a5a6b464c.md
View File

@@ -9,7 +9,7 @@ dashedName: step-13
# --description--
Lenga vipengele vya orodha ambavyo havijapangwa ndani ya vipengee vya `nav` na utumie _Flexbox_ ili kuweka nafasi sawa.
Use the `>` selector to target the unordered list elements within the `nav` elements, and use _Flexbox_ to evenly space the children.
# --hints--

2
curriculum/challenges/swahili/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f02240ff8f09f7ec913c.md
View File

@@ -7,7 +7,7 @@ dashedName: step-36
# --description--
Ndani ya vipengele vya `div.question-block`, weka kipengele kimoja cha `label`, na ukipe kipengele cha `label` maudhui ya maandishi
Within the `div.question-block` elements, nest one `label` element, and add a `CSS` related question to the `label` text.
# --hints--

16
curriculum/challenges/ukrainian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/613e275749ebd008e74bb62e.md
View File

@@ -9,17 +9,27 @@ dashedName: step-8
Корисна властивість _SVG_ (масштабована векторна графіка): завдяки атрибуту `path` можна масштабувати зображення без впливу на роздільність вихідного зображення.
Наразі `img` припускає свій розмір за замовчуванням, що є занадто великим. Належним способом виміряйте зображення, використовуючи `id` як селектор та встановлюючи `width` на `max(100px, 18vw)`.
Наразі `img` припускає свій розмір за замовчуванням, що є занадто великим. CSS has a `max` function which returns the largest of a set of comma-separated values. For example:
```css
img {
width: max(250px, 25vw);
}
```
In this example, `img` elements will have a minimum width of `250px`. And as the viewport grows, the image will grow accordingly to be 25 percent of the viewport width.
Scale the image using its `id` as a selector, and setting the `width` to to be the maximum of `100px` or `18vw`.
# --hints--
Ви повинні використати селектор `#logo`, щоб націлити елемент `img`.
You should use the `#logo` selector to target the `img` element.
```js
assert.exists(new __helpers.CSSHelp(document).getStyle('#logo'));
```
Ви повинні надати `img` властивість `width` зі значенням `max(100px, 18vw)`.
You should give the `img` a `width` of `max(100px, 18vw)`.
```js
assert.equal(new __helpers.CSSHelp(document).getStyle('#logo')?.width, 'max(100px, 18vw)');

2
curriculum/challenges/ukrainian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/614090d5a22b6f0a5a6b464c.md
View File

@@ -9,7 +9,7 @@ dashedName: step-13
# --description--
Націльте невпорядковані елементи списку в межах елементів `nav` та використайте _Flexbox_, щоб рівномірно розставити дочірні елементи.
Use the `>` selector to target the unordered list elements within the `nav` elements, and use _Flexbox_ to evenly space the children.
# --hints--

2
curriculum/challenges/ukrainian/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/6145f02240ff8f09f7ec913c.md
View File

@@ -7,7 +7,7 @@ dashedName: step-36
# --description--
В межах елементів `div.question-block` вкладіть один елемент `label` та надайте елементам `label` текстового вмісту
Within the `div.question-block` elements, nest one `label` element, and add a `CSS` related question to the `label` text.
# --hints--