Merge branch '4GeeksAcademy:master' into ex4.3

Author: ElviraQDP

exercises/01-Hello-World/README.es.md

@@ -37,4 +37,4 @@ Usamos CSS para selectionar todas las etiquetas `<a>` y luego hacerlas `pink`.
 
 Debería verse así:
 
-![01 Hello World Exercise Preview](https://github.com/4GeeksAcademy/css-tutorial-exercises-course/blob/master/.learn/assets/01-1.png?raw=true)
+![01 Hello World Exercise Preview](../../.learn/assets/01-1.png?raw=true)

exercises/01-Hello-World/README.md

@@ -36,4 +36,4 @@ We use CSS to tell (selected) all the anchor tags and make then pink.
 
 It should look like this:
 
-![01 Hello World Exercise Preview](https://github.com/4GeeksAcademy/css-tutorial-exercises-course/blob/master/.learn/assets/01-1.png?raw=true)
+![01 Hello World Exercise Preview](../../.learn/assets/01-1.png?raw=true)

exercises/01.1-The-Style-Tag/README.es.md

@@ -18,4 +18,4 @@ Puedes tener cuantas etiquetas `<style>`quieras pero se recomienda solo tener un
 
 Debería verse así:
 
-![01 Hello World Exercise Preview](https://github.com/4GeeksAcademy/css-tutorial-exercises-course/blob/master/.learn/assets/01.1-1.png?raw=true)
+![01 Hello World Exercise Preview](../../.learn/assets/01.1-1.png?raw=true)

exercises/03-Inline-Styles/README.es.md

@@ -25,4 +25,4 @@ Puedes agregar tantas reglas CSS como desees, dentro de la misma línea, separad
 
 ### 💡Pista:
 
-- Como usar el background-size: http://lmgtfy.com/?q=css+inline+style
+- Como usar el background-color: http://lmgtfy.com/?q=css+inline+style

exercises/03-Inline-Styles/README.md

@@ -25,4 +25,4 @@ Will set the color of that specific link to red and the font-size to 14px
 
 ### 💡 Hint:
 
-- How to use the background-size: http://lmgtfy.com/?q=css+inline+style
+- How to use the background-color: http://lmgtfy.com/?q=css+inline+style

exercises/04.1-Combined-Rules/README.es.md

@@ -19,7 +19,7 @@ border: black 1px solid;
 # 📝 Instrucciones:
 
 
-1. Combina las 4 reglas de padding una sola utilizando la regla `padding`.
+1. Combina las 4 reglas de padding en una sola utilizando la regla `padding`.
 
 2. Combina todas las reglas de background, menos el `background-size`, en una sola línea usando la regla `background:`.
 

exercises/04.2-Apply-several-classes/README.es.md

@@ -20,4 +20,4 @@ Remmplaza la propiedad `spades` de la clase del `<div>` por la clase `heart` y o
 
 ## Resultado:
 
-![Poker Card Heart](https://github.com/4GeeksAcademy/css-tutorial-exercises-course/blob/master/.learn/assets/04.2-1.png?raw=true)
+![Poker Card Heart](../../.learn/assets/04.2-1.png?raw=true)

exercises/04.2-Apply-several-classes/README.md

@@ -24,4 +24,4 @@ Replace the class property `spades` of the `<div>` with the class `heart` and lo
 
 ## Expected result:
 
-![Poker Card Heart](https://github.com/4GeeksAcademy/css-tutorial-exercises-course/blob/master/.learn/assets/04.2-1.png?raw=true)
+![Poker Card Heart](../../.learn/assets/04.2-1.png?raw=true)

exercises/05-Specificity/README.es.md

@@ -11,16 +11,6 @@ Se trata del nivel de especificidad. Si especificas que tu `div` con `id="thirdi
 
 1. Anula el color de fondo (`background-color`) de `#thirditem` sin eliminar ningún código CSS, simplemente agrega al CSS una regla más específica al final del documento para anular el color de fondo a verde.
 
-<<<<<<< HEAD
 ## 💡 Pista:
-=======
-1. Anula el color de fondo (background-color) de #thirditem sin eliminar ningún código CSS, simplemente agrega al CSS una regla más específica al final del documento para anular el color de fondo actual y que cambie a verde.
-
-
-### 💡 Pista:
->>>>>>> 1d998c3c73ff7c97c513d625df93c9c4041e6cf0
-
-Puedes usar la anotación **!important** :
-https://css-tricks.com/when-using-important-is-the-right-choice/
-
 
++ Puedes usar la anotación **!important** : https://css-tricks.com/when-using-important-is-the-right-choice/

exercises/06-Practicing-Rules/README.es.md

@@ -2,8 +2,7 @@
 
 ## 📝 Instrucciones:
 
-1. Establece esta URL como la imagen de fondo de la página y repítela solo verticalmente:
-   [06- backgrund vertical](../../.learn/assets/background-vertical.jpg?raw=true)
+1. Establece esta URL como la imagen de fondo de la página y repítela solo verticalmente: `../../.learn/assets/background-vertical.jpg?raw=true`
 
 2. Cambia el tipo de fuente (`font-type`) del `h1` a `Courier` y el resto del sitio web a `Times New Roman`.
 
@@ -21,4 +20,4 @@
 
 ## El resultado debería ser algo como esto:
 
-![Example Image](https://github.com/4GeeksAcademy/css-tutorial-exercises-course/raw/master/.learn/assets/06-1.png?raw=true)
+![Example Image](../../.learn/assets/06-1.png?raw=true)

exercises/06-Practicing-Rules/README.md

@@ -6,27 +6,22 @@ tutorial: "https://www.youtube.com/watch?v=4wguurrl-lU"
 
 ## 📝 Instructions:
 
+1. Set this URL as the background image of the page, and repeat it vertically only: `../../.learn/assets/background-vertical.jpg?raw=true`
 
-1. Set this URL as the background image of the page, and repeat it vertically only:
-   [06- backgrund vertical](../../.learn/assets/background-vertical.jpg?raw=true)
-
-2. Change the font-type of the `h1` to `Courier`
-   and the rest of the website to `Times new Roman`.
+2. Change the font-type of the `h1` to `Courier` and the rest of the website to `Times new Roman`.
 
 3. Change the color of `h1` to `red`.
 
 4. Make all the `h2's` with an `underline`.
 
 5. Center the `h1` to the middle.
 
-6. Add a `left padding` to the whole document
-   of `20px` to make it easier to read.
+6. Add a `left padding` to the whole document of `20px` to make it easier to read.
 
 7. Add a white `semi-transparent background (0.2)` to the `first paragraph` to make it easier to read (you have tu use rgba for that) and write down "3 reasons you know you are learning". Then apply a `padding` of `5px` to all sides of that paragraph.
 
 8. Change the `anchor` "hover" color to `green` and remove the underline (you have to actually hover the anchor to test it).
 
-
 ## The result should be something like this:
 
 ![Example Image](../../.learn/assets/06-1.png?raw=true)

exercises/07-Very-Specific-Rules/README.es.md

@@ -8,7 +8,7 @@ En este ejercicio, puedes agregar tu código solo arriba del **READ ONLY BLOCK**
 
 1. Establece el color de texto `ul` a rojo (`red`) (anula los conflictos siendo más específico).
 
-2. Establece el color de fondo (`backgrounf-color`) del segundo `li` del `ol` a verde (`green`) (no uses el selector #id).
+2. Establece el color de fondo (`background-color`) del segundo `li` del `ol` a verde (`green`) (no uses el selector #id).
 
 3. Haz que las filas impares de las tablas tengan fondo amarillo usando `tr:nth-child`.
 

exercises/10-Your-Own-Font/README.es.md

@@ -1,8 +1,8 @@
 # `10` Tu Propia Fuente
 
-Aquí puedes encontrar las fuentes de Google:  https://fonts.google.com
+Aquí puedes encontrar las fuentes de Google: https://fonts.google.com
 
-ELige la que más te guste, y úsala vinculando tu sitio web con la URL en la que se almacena la fuente. Tienes que hacer eso en la etiqueta `<head>` del documento HTML de esta manera:
+Elige la que más te guste, y úsala vinculando tu sitio web con la URL en la que se almacena la fuente. Tienes que hacer eso en la etiqueta `<head>` del documento HTML de esta manera:
 
 ```Plain/Text
 <link href="https://fonts.googleapis.com/css?family=YOUR_FONT" rel="stylesheet">
@@ -14,5 +14,5 @@ Después de vincular tu fuente, debes asignar la regla CSS `font-family` a lo qu
 
 1. Enlaza cualquier fuente de google que desee en el sitio web.
 
-2. Aplica esa `font-family`(familia de fuentes)específica a `#myTitle`.
+2. Aplica esa `font-family` (familia de fuentes) específica a `#myTitle`.
 

exercises/11-Font-Awesome-Icons/README.es.md

@@ -9,7 +9,7 @@ Font-awesome resuelve el problema de la "imagen" creando una nueva fuente en don
 Después de vincular tu sitio web con font-awesome, puedes usar lo siguiente para codificar e insertar un icono específico:
 
 ```html
-<i class="fa fa-camera-retro"></i> 
+<i class="fas fa-camera-retro"></i> 
 <!--"camera-retro" será el nombre de tu icono-->
 
 Puedes encontrar todos los nombres disponibles aquí: http://fontawesome.io/icons/

exercises/11-Font-Awesome-Icons/README.md

@@ -9,13 +9,13 @@ Font-awesome solve the "image" problem by creating a new font- each letter is a
 After linking your website with font-awesome, you can use the following code to insert a specific icon:
 
 ```html
-<i class="fa fa-camera-retro"></i> 
+<i class="fas fa-camera-retro"></i>
 <!-- "camera-retro" will be the name of the icon -->
 
 You can find all the available names here: http://fontawesome.io/icons/
 ```
 
 ## 📝 Instructions:
 
-Add two more items into your list and add a different icon at the beginning of each item.
+1. Add two more items into your list and add a different icon at the beginning of each item.
 

exercises/11-Font-Awesome-Icons/tests.js

@@ -35,7 +35,7 @@ describe("All the styles should be applied", function() {
       expect(li[i].innerHTML).toBeTruthy();
     }
   });
-  it('the i tag should have a class "fa"', function() {
+  it('the i tag should have a class "fas"', function() {
     //or use query selector to compare hoy mane scriptags do we have
     const icon = document.querySelectorAll("i");
     expect(document.querySelector("i")).toBeTruthy();

exercises/13-Anchor-Like-Button/README.es.md

@@ -10,7 +10,7 @@ Siga estos pasos para que tu enlace (`anchor`) se vea así:
 
 2. Bordes redondeados: establece el `border-radius` en `4px`.
 
-3. Encuentra y aplica el color: usa el selector de `color`(color picker) para encontrar el color exacto y aplicaselo al`background`.
+3. Encuentra y aplica el color: usa el selector de `color` (color picker) para encontrar el color exacto y aplicárselo al `background`.
 
 4. Eliminar subrayado: establece `text-decoration` a `none`.
 

learn.json

@@ -14,7 +14,7 @@
     "config": {
         "disableGrading": true,
         "editor": {
-            "version": "1.0.71"
+            "version": "1.0.72"
         }
     }
 }