From f8b2af8f91aa52fa5ee04385cadb0e5a32a0e7cc Mon Sep 17 00:00:00 2001 From: Elvira Quiroz Date: Wed, 4 Aug 2021 16:17:50 +0000 Subject: [PATCH 1/2] changing images url to realtive paths --- exercises/06-Practicing-Rules/README.es.md | 2 +- exercises/07-Very-Specific-Rules/README.es.md | 2 +- exercises/07-Very-Specific-Rules/README.md | 2 +- exercises/08-Rounded-Image/README.es.md | 2 +- exercises/08-Rounded-Image/README.md | 2 +- exercises/09-Anchor-Styles/README.es.md | 2 +- exercises/09-Anchor-Styles/README.md | 2 +- exercises/12-Relative-Length-EM-REM/README.es.md | 2 +- exercises/12-Relative-Length-EM-REM/README.md | 2 +- exercises/13-Anchor-Like-Button/README.es.md | 2 +- exercises/13-Anchor-Like-Button/README.md | 2 +- 11 files changed, 11 insertions(+), 11 deletions(-) diff --git a/exercises/06-Practicing-Rules/README.es.md b/exercises/06-Practicing-Rules/README.es.md index dcf68f92..f41916d4 100644 --- a/exercises/06-Practicing-Rules/README.es.md +++ b/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`. diff --git a/exercises/07-Very-Specific-Rules/README.es.md b/exercises/07-Very-Specific-Rules/README.es.md index a27eb0d4..9660c5f4 100644 --- a/exercises/07-Very-Specific-Rules/README.es.md +++ b/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) diff --git a/exercises/07-Very-Specific-Rules/README.md b/exercises/07-Very-Specific-Rules/README.md index 90c25ecd..ac33d20d 100644 --- a/exercises/07-Very-Specific-Rules/README.md +++ b/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) diff --git a/exercises/08-Rounded-Image/README.es.md b/exercises/08-Rounded-Image/README.es.md index e7375c8d..9fa6cd25 100644 --- a/exercises/08-Rounded-Image/README.es.md +++ b/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: diff --git a/exercises/08-Rounded-Image/README.md b/exercises/08-Rounded-Image/README.md index 3e262440..164b2a46 100644 --- a/exercises/08-Rounded-Image/README.md +++ b/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: diff --git a/exercises/09-Anchor-Styles/README.es.md b/exercises/09-Anchor-Styles/README.es.md index 29ab2500..97b09262 100644 --- a/exercises/09-Anchor-Styles/README.es.md +++ b/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: diff --git a/exercises/09-Anchor-Styles/README.md b/exercises/09-Anchor-Styles/README.md index 0340bc88..3ce04f9a 100644 --- a/exercises/09-Anchor-Styles/README.md +++ b/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: diff --git a/exercises/12-Relative-Length-EM-REM/README.es.md b/exercises/12-Relative-Length-EM-REM/README.es.md index 03622fe8..449c18ca 100644 --- a/exercises/12-Relative-Length-EM-REM/README.es.md +++ b/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) diff --git a/exercises/12-Relative-Length-EM-REM/README.md b/exercises/12-Relative-Length-EM-REM/README.md index 51d14481..70e0f727 100644 --- a/exercises/12-Relative-Length-EM-REM/README.md +++ b/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) diff --git a/exercises/13-Anchor-Like-Button/README.es.md b/exercises/13-Anchor-Like-Button/README.es.md index 1a7b5d08..24029f23 100644 --- a/exercises/13-Anchor-Like-Button/README.es.md +++ b/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) diff --git a/exercises/13-Anchor-Like-Button/README.md b/exercises/13-Anchor-Like-Button/README.md index c8078b84..f9bf6617 100644 --- a/exercises/13-Anchor-Like-Button/README.md +++ b/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) \ No newline at end of file +![Example Image](../../.learn/assets/13-1.gif?raw=true) \ No newline at end of file From 57814557bd2a5c59ff9f62a7073860c7c54605b9 Mon Sep 17 00:00:00 2001 From: Elvira Quiroz Date: Mon, 16 Aug 2021 19:43:58 +0000 Subject: [PATCH 2/2] fixing issue from learnpack --- exercises/06-Practicing-Rules/tests.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/exercises/06-Practicing-Rules/tests.js b/exercises/06-Practicing-Rules/tests.js index 79cc8e0e..62263d92 100644 --- a/exercises/06-Practicing-Rules/tests.js +++ b/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 () {