From f146e5221a40152c9c182852e1b34ed7729c0e66 Mon Sep 17 00:00:00 2001 From: camperbot Date: Sat, 29 May 2021 03:40:43 +0900 Subject: [PATCH] chore(i18n,curriculum): update translations (#42290) --- .../react/render-conditionally-from-props.md | 13 ++++--- .../react/render-conditionally-from-props.md | 13 ++++--- .../create-a-media-query.md | 35 ++++++------------- .../add-items-using-splice.md | 2 +- .../target-elements-by-id-using-jquery.md | 22 ++++++------ .../target-even-elements-using-jquery.md | 20 ++++++----- 6 files changed, 53 insertions(+), 52 deletions(-) diff --git a/curriculum/challenges/chinese-traditional/03-front-end-libraries/react/render-conditionally-from-props.md b/curriculum/challenges/chinese-traditional/03-front-end-libraries/react/render-conditionally-from-props.md index c62492c108..2afa16d83a 100644 --- a/curriculum/challenges/chinese-traditional/03-front-end-libraries/react/render-conditionally-from-props.md +++ b/curriculum/challenges/chinese-traditional/03-front-end-libraries/react/render-conditionally-from-props.md @@ -240,8 +240,11 @@ class GameOfChance extends React.Component { this.handleClick = this.handleClick.bind(this); } handleClick() { - this.setState({ - counter: 0 // Change this line + this.setState(prevState => { + // Complete the return statement: + return { + counter: prevState + } }); } render() { @@ -280,8 +283,10 @@ class GameOfChance extends React.Component { this.handleClick = this.handleClick.bind(this); } handleClick() { - this.setState({ - counter: this.state.counter + 1 + this.setState(prevState => { + return { + counter: prevState.counter + 1 + } }); } render() { diff --git a/curriculum/challenges/chinese/03-front-end-libraries/react/render-conditionally-from-props.md b/curriculum/challenges/chinese/03-front-end-libraries/react/render-conditionally-from-props.md index d183d48e6d..28cc87511d 100644 --- a/curriculum/challenges/chinese/03-front-end-libraries/react/render-conditionally-from-props.md +++ b/curriculum/challenges/chinese/03-front-end-libraries/react/render-conditionally-from-props.md @@ -240,8 +240,11 @@ class GameOfChance extends React.Component { this.handleClick = this.handleClick.bind(this); } handleClick() { - this.setState({ - counter: 0 // Change this line + this.setState(prevState => { + // Complete the return statement: + return { + counter: prevState + } }); } render() { @@ -280,8 +283,10 @@ class GameOfChance extends React.Component { this.handleClick = this.handleClick.bind(this); } handleClick() { - this.setState({ - counter: this.state.counter + 1 + this.setState(prevState => { + return { + counter: prevState.counter + 1 + } }); } render() { diff --git a/curriculum/challenges/espanol/01-responsive-web-design/responsive-web-design-principles/create-a-media-query.md b/curriculum/challenges/espanol/01-responsive-web-design/responsive-web-design-principles/create-a-media-query.md index 6a4d5a4766..7fac9b7096 100644 --- a/curriculum/challenges/espanol/01-responsive-web-design/responsive-web-design-principles/create-a-media-query.md +++ b/curriculum/challenges/espanol/01-responsive-web-design/responsive-web-design-principles/create-a-media-query.md @@ -13,13 +13,13 @@ Las consultas de medios (Media Queries) son una nueva técnica introducida en CS Las consultas de medios se basan en un tipo de medio, y si ese tipo de medio coincide con el tipo de dispositivo en el que se muestra el documento, los estilos se aplican. Puedes tener tantos selectores y estilos dentro de tu consultas de medios como desees. -Este es un ejemplo de una consultas de medios que devuelve el contenido cuando el ancho del dispositivo es menor o igual a 100px: +Aquí hay un ejemplo de una consulta multimedia que devuelve el contenido cuando el ancho del dispositivo es menor o igual a `100px`: ```css @media (max-width: 100px) { /* CSS Rules */ } ``` -y la siguiente consultas de medios devuelve el contenido cuando la altura del dispositivo es mayor o igual a 350px: +y la siguiente consultas de medios devuelve el contenido cuando la altura del dispositivo es mayor o igual a `350px`: ```css @media (min-height: 350px) { /* CSS Rules */ } @@ -33,38 +33,25 @@ Agrega una consultas de medios, de forma que la etiqueta `p` tenga un `font-size # --hints-- -Debes declarar una consulta `@media` para dispositivos con un `height` menor o igual a 800px. +Debes declarar una consulta `@media` para dispositivos con un `height` menor o igual a `800px`. ```js -assert( - $('style') - .text() - .replace(/\s/g, '') - .match(/@media\(max-height:800px\)/g) -); +const media = new __helpers.CSSHelp(document).getCSSRules('media'); +assert(media.some(x => x.conditionText?.includes('(max-height: 800px)'))); ``` -Tu elemento `p` debe tener un `font-size` de 10px cuando el `height` del dispositivo sea menor o igual a 800px. +Tu elemento `p` debe tener un `font-size` de `10px` cuando el `height` del dispositivo sea menor o igual a `800px`. ```js -assert( - $('style') - .text() - .replace(/\s/g, '') - .match(/@media\(max-height:800px\){p{font-size:10px;?}}/g) -); +const rules = new __helpers.CSSHelp(document).getRuleListsWithinMedia('(max-height: 800px)'); +assert(rules?.find(x => x.selectorText === 'p')?.style.fontSize === "10px"); ``` -Tu elemento `p` debe tener un `font-size` inicial de 20px cuando el `height` del dispositivo sea mayor que 800px. +Tu elemento `p` debe tener un `font-size` inicial de `20px` cuando el dispositivo `height` sea superior a `800px`. ```js -assert( - $('style') - .text() - .replace(/\s/g, '') - .replace(/@media.*}/g, '') - .match(/p{font-size:20px;?}/g) -); +const ifPFirst = new __helpers.CSSHelp(document).getCSSRules()?.find(x => x?.selectorText === 'p' || x?.media); +assert(ifPFirst?.style?.fontSize === '20px'); ``` # --seed-- diff --git a/curriculum/challenges/espanol/02-javascript-algorithms-and-data-structures/basic-data-structures/add-items-using-splice.md b/curriculum/challenges/espanol/02-javascript-algorithms-and-data-structures/basic-data-structures/add-items-using-splice.md index 1bb857728f..d4e935809a 100644 --- a/curriculum/challenges/espanol/02-javascript-algorithms-and-data-structures/basic-data-structures/add-items-using-splice.md +++ b/curriculum/challenges/espanol/02-javascript-algorithms-and-data-structures/basic-data-structures/add-items-using-splice.md @@ -19,7 +19,7 @@ numbers.splice(startIndex, amountToDelete, 13, 14); console.log(numbers); ``` -La segunda entrada de `12` es removida, y agregamos `13` y `14` en el mismo índice. El arreglo `numbers` ahora será `[ 10, 11, 12, 13, 14, 15 ]`. +La segunda ocurrencia de `12` es removida, y agregamos `13` y `14` en el mismo índice. El arreglo `numbers` ahora será `[ 10, 11, 12, 13, 14, 15 ]`. Aquí, comenzamos con un arreglo de números. A continuación, pasamos lo siguiente a `splice()`: El índice en el que empezar a borrar elementos (3), el número de elementos a borrar (1), y el resto de argumentos (13, 14) se insertarán a partir de ese mismo índice. Ten en cuenta que puede haber cualquier número de elementos (separados por comas) después de `amountToDelete`, cada uno de los cuales es insertado. diff --git a/curriculum/challenges/espanol/03-front-end-libraries/jquery/target-elements-by-id-using-jquery.md b/curriculum/challenges/espanol/03-front-end-libraries/jquery/target-elements-by-id-using-jquery.md index ff20eab947..dc4081c344 100644 --- a/curriculum/challenges/espanol/03-front-end-libraries/jquery/target-elements-by-id-using-jquery.md +++ b/curriculum/challenges/espanol/03-front-end-libraries/jquery/target-elements-by-id-using-jquery.md @@ -1,6 +1,6 @@ --- id: bad87fee1348bd9aeda08826 -title: Target Elements by id Using jQuery +title: Apunta a elementos por clase usando jQuery challengeType: 6 forumTopicId: 18317 required: @@ -11,27 +11,29 @@ dashedName: target-elements-by-id-using-jquery # --description-- -You can also target elements by their id attributes. +También puedes apuntar a elementos por su atributo id. -First target your `button` element with the id `target3` by using the `$("#target3")` selector. +Primero apunta a tu elemento `button` con el id `target3` usando el selector `$("#target3")`. -Note that, just like with CSS declarations, you type a `#` before the id's name. +Ten en cuenta que, al igual que con las declaraciones CSS, escribes un `#` antes del nombre del id. -Then use jQuery's `.addClass()` function to add the classes `animated` and `fadeOut`. +Luego usa la función `.addClass()` de jQuery para añadir las clases `animated` y `fadeOut`. -Here's how you'd make the `button` element with the id `target6` fade out: +Así es como harás que el elemento `button` con el id `target6` se desvanezca: -`$("#target6").addClass("animated fadeOut")`. +```js +$("#target6").addClass("animated fadeOut"); +``` # --hints-- -You should select the `button` element with the `id` of `target3` and use the jQuery `addClass()` function to give it the class of `animated`. +Debes seleccionar el elemento `button` con el `id` de `target3` y utilizar la función jQuery `addClass()` para darle la clase `animated`. ```js assert($('#target3').hasClass('animated')); ``` -You should target the element with the id `target3` and use the jQuery `addClass()` function to give it the class `fadeOut`. +Debes seleccionar el elemento con el id `target3` y utilizar la función jQuery `addClass()` para darle la clase `fadeOut`. ```js assert( @@ -40,7 +42,7 @@ assert( ); ``` -You should only use jQuery to add these classes to the element. +Solo debes usar jQuery para agregar estas clases al elemento. ```js assert(!code.match(/class.*animated/g)); diff --git a/curriculum/challenges/espanol/03-front-end-libraries/jquery/target-even-elements-using-jquery.md b/curriculum/challenges/espanol/03-front-end-libraries/jquery/target-even-elements-using-jquery.md index 71d4b9738e..71be023d1d 100644 --- a/curriculum/challenges/espanol/03-front-end-libraries/jquery/target-even-elements-using-jquery.md +++ b/curriculum/challenges/espanol/03-front-end-libraries/jquery/target-even-elements-using-jquery.md @@ -1,6 +1,6 @@ --- id: bad87fee1348bd9aed008826 -title: Target Even Elements Using jQuery +title: Apunta a elementos pares utilizando jQuery challengeType: 6 forumTopicId: 18318 required: @@ -11,19 +11,21 @@ dashedName: target-even-elements-using-jquery # --description-- -You can also target elements based on their positions using `:odd` or `:even` selectors. +También puedes apuntar a elementos basado en sus posiciones, usando los selectores `:odd` o `:even`. -Note that jQuery is zero-indexed which means the first element in a selection has a position of 0. This can be a little confusing as, counter-intuitively, `:odd` selects the second element (position 1), fourth element (position 3), and so on. +Ten en cuenta que jQuery es indexado desde el cero, lo que significa que el primer elemento de una selección tiene la posición 0. Esto puede ser un poco confuso, ya que contra-intuitivamente, `:odd` selecciona el segundo elemento (posición 1), cuarto elemento (posición 3), y así sucesivamente. -Here's how you would target all the odd elements with class `target` and give them classes: +Así es como apuntas a todos los elementos impares con la clase `target` y les das clases: -`$(".target:odd").addClass("animated shake");` +```js +$(".target:odd").addClass("animated shake"); +``` -Try selecting all the even `target` elements and giving them the classes of `animated` and `shake`. Remember that **even** refers to the position of elements with a zero-based system in mind. +Intenta seleccionar todos los elementos pares `target` y darle las clases de `animated` y `shake`. Recuerda que **even** se refiere a la posición de los elementos con un sistema de indexado desde cero en mente. # --hints-- -All of the `target` elements that jQuery considers to be even should shake. +Todos los elementos `target` que jQuery considera que son pares deberían agitarse. ```js assert( @@ -31,13 +33,13 @@ assert( ); ``` -You should use the `:even` selector to modify these elements. +Debes usar el selector `:even` para modificar estos elementos. ```js assert(code.match(/\:even/g)); ``` -You should only use jQuery to add these classes to the element. +Solo debes usar jQuery para añadir estas clases al elemento. ```js assert(