Merge pull request 4GeeksAcademy#25 from ElviraQDP/master

changing images url to realtive paths

Author: alesanchezr

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

@@ -4,7 +4,7 @@
 
 
 1. Establece esta URL como la imagen de fondo de la página y repítela solo verticalmente:
-   https://github.com/4GeeksAcademy/css-tutorial-exercises-course/blob/master/.learn/assets/background-vertical.jpg?raw=true
+   [06- backgrund vertical](../../.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`.
 

exercises/06-Practicing-Rules/tests.js

@@ -26,7 +26,7 @@ describe("All the styles should be applied", function () {
     let body=document.querySelector("body");
     let styles=window.getComputedStyle(body);
     expect(styles["background"]).toBe(
-      `url(https://github.com/4GeeksAcademy/css-tutorial-exercises-course/blob/3a2d1dd03f58167a5a4894155af2d3aa4d41d647/.learn/assets/background-vertical.jpg?raw=true) repeat-y`
+      `url(../../.learn/assets/background-vertical.jpg?raw=true) repeat-y`
     );
   });
   it("the font-family should be 'Times New Roman'", function () {

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

@@ -14,7 +14,7 @@ En este ejercicio, puedes agregar tu código solo arriba del **READ ONLY BLOCK**
 3. Haz que las filas impares de las tablas tengan fondo amarillo usando `tr:nth-child`.
 
 
-![Example Image](https://github.com/4GeeksAcademy/css-tutorial-exercises-course/blob/master/.learn/assets/07-1.png?raw=true)
+![Example Image](../../.learn/assets/07-1.png?raw=true)
 
 
 

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

@@ -18,7 +18,7 @@ In this exercise, you can add your code only above the **READ ONLY BLOCK** of th
 3. Change the odd rows of the tables to a yellow background using `tr:nth-child`.
 
 
-![Example Image](https://github.com/4GeeksAcademy/css-tutorial-exercises-course/blob/master/.learn/assets/07-1.png?raw=true)
+![Example Image](../../.learn/assets/07-1.png?raw=true)
 
 
 

exercises/08-Rounded-Image/README.es.md

@@ -4,7 +4,7 @@ Muchos sitios web usan imágenes de perfil redondeadas ¡una técnica que realme
 
 La forma obvia de crear una imagen de perfil redondeada es crear una etiqueta de imagen y aplicar un `border-radius: 100%`. El problema con este enfoque es que solo funciona para imágenes cuadradas... Las imágenes de perfil generalmente tienen diferente altura y ancho no se verán como un círculo, se verán como óvalos:
 
-![Example Image](https://github.com/4GeeksAcademy/css-tutorial-exercises-course/blob/master/.learn/assets/08-1.png?raw=true)
+![Example Image](../../.learn/assets/08-1.png?raw=true)
 
 ## 📝 Instrucciones:
 

exercises/08-Rounded-Image/README.md

@@ -4,7 +4,7 @@ A lot of websites use rounded profile images, a technique that really makes a we
 
 The obvious way create a rounded profile picture is to create an image tag and apply `border-radius:100%`. The problem with this approach, is that it only works for squared pictures... Profile pictures with different height and width will not look like a circle, they will look like ovals:
 
-![Example Image](https://github.com/4GeeksAcademy/css-tutorial-exercises-course/blob/master/.learn/assets/08-1.png?raw=true)
+![Example Image](../../.learn/assets/08-1.png?raw=true)
 
 ## 📝 Instructions:
 

exercises/09-Anchor-Styles/README.es.md

@@ -2,7 +2,7 @@
 
 A las personas les gusta sentir que están haciendo clic en algo, uuna manera de lograrlo es fingir un efecto 3D. Para hacerlo, los diseñadores normalmente juegan con los bordes, por ejemplo:
 
-![Example Image](https://github.com/4GeeksAcademy/css-tutorial-exercises-course/blob/master/.learn/assets/09-1.png?raw=true)
+![Example Image](../../.learn/assets/09-1.png?raw=true)
 
 Puedes controlar qué reglas css se aplican a cada estado de un `anchor` utilizando los selectores: `:hover` (para el mouse) o `active` (para presionar el mouse), por ejemplo:
 

exercises/09-Anchor-Styles/README.md

@@ -2,7 +2,7 @@
 
 People like to feel that they are clicking on something, a great approach to accomplish that is by faking a 3D effect. To do so, designers normally play with the borders, for example:
 
-![Example Image](https://github.com/4GeeksAcademy/css-tutorial-exercises-course/blob/master/.learn/assets/09-1.png?raw=true)
+![Example Image](../../.learn/assets/09-1.png?raw=true)
 
 You can control what css rules apply to each state of an anchor by using the `:hover` (for mouse hover) or `:active` (for mouse pressing) selectors, example:
 

exercises/12-Relative-Length-EM-REM/README.es.md

@@ -20,6 +20,6 @@ rem: Relativo al font-size original de la página.
 
 El resultado debería verse así:
 
-![Example Image](https://github.com/4GeeksAcademy/css-tutorial-exercises-course/raw/master/.learn/assets/12-1.png?raw=true)
+![Example Image](../../.learn/assets/12-1.png?raw=true)
 
 

exercises/12-Relative-Length-EM-REM/README.md

@@ -22,6 +22,6 @@ REM: Relative to the original font-size of the page.
 
 
 The result should look like this:
-![Example Image](https://github.com/4GeeksAcademy/css-tutorial-exercises-course/blob/master/.learn/assets/12-1.png?raw=true)
+![Example Image](../../.learn/assets/12-1.png?raw=true)
 
 

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

@@ -20,4 +20,4 @@ Siga estos pasos para que su enlace (anchor) se vea así
 
 6. Dentro del selector de hover: cambie el fondo del botón a un color naranja más oscuro.
 
-![Example Image](https://github.com/4GeeksAcademy/css-tutorial-exercises-course/blob/master/.learn/assets/13-1.gif?raw=true)
+![Example Image](../../.learn/assets/13-1.gif?raw=true)

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

@@ -18,4 +18,4 @@ Anchors are not only used within text- when you are going to use anchors outside
 
 6. Inside of the :hover selector change the background of the button to a darker orange.
 
-![Example Image](https://github.com/4GeeksAcademy/css-tutorial-exercises-course/blob/master/.learn/assets/13-1.gif?raw=true)
+![Example Image](../../.learn/assets/13-1.gif?raw=true)