diff --git a/exercises/04.1-Combined-Rules/README.es.md b/exercises/04.1-Combined-Rules/README.es.md index 59f7be55..5babd4d5 100644 --- a/exercises/04.1-Combined-Rules/README.es.md +++ b/exercises/04.1-Combined-Rules/README.es.md @@ -2,7 +2,7 @@ Los archivos CSS ocupan espacio en tu servidor y también tardan en descargarse (como todo); es otro documento de texto que el navegador debe descargar antes de mostrar la página, por lo que es importante mantener el documento CSS lo más pequeño posible. -Una forma de hacerlo es combinando varias propiedades en una, como con "border": +Una forma de hacerlo es combinando varias propiedades en una, como con `border`: ```css border-color: black; @@ -16,7 +16,7 @@ Las propiedades de border se pueden consolidar en una sola línea así: border: black 1px solid; ``` -# 📝 Instrucciones: +## 📝 Instrucciones: 1. Combina las 4 reglas de padding en una sola utilizando la regla `padding`. @@ -25,7 +25,7 @@ border: black 1px solid; *El `background-size` no se puede combinar, los navegadores aún no lo admiten.* -## Pista: +## 💡 Pista: -- Como usar el background-size: http://lmgtfy.com/?q=css+background -- Como usar el padding: http://lmgtfy.com/?q=css+padding +- Cómo usar el background-size: http://lmgtfy.com/?q=css+background +- Cómo usar el padding: http://lmgtfy.com/?q=css+padding diff --git a/exercises/04.1-Combined-Rules/README.md b/exercises/04.1-Combined-Rules/README.md index bd17ad14..b96b4536 100644 --- a/exercises/04.1-Combined-Rules/README.md +++ b/exercises/04.1-Combined-Rules/README.md @@ -4,9 +4,9 @@ tutorial: "https://youtu.be/watch?v=uQS5QeEE-B4" # `04.1` Combined Rules -CSS files take space on your server and also take time to download (like everything); it is yet another text document that the browser has to download before rendering the page, which is why is important to keep the CSS document as small as possible. +CSS files take up space on your server and also take time to download (like everything); it is yet another text document that the browser has to download before rendering the page, which is why it's important to keep the CSS document as small as possible. -One way to do that is by combining several properties into one such as with `border`: +One way to do that is by combining several properties into one, such as with `border`: ```css border-color: black; @@ -14,7 +14,7 @@ border-style: solid; border-width: 1px; ``` -Border's properties can be consolidated into a single line as: +Border's properties can be consolidated into a single line like this: ```css border: black 1px solid; @@ -24,11 +24,11 @@ border: black 1px solid; 1. Combine the 4 padding rules into just one using the `padding` rule. -2. Combine the all background rules, but the `background-size`, into just one line using the `background:` rule. +2. Combine all background rules, but the `background-size`, into just one line using the `background:` rule. *The `background-size` cannot be combined, the browsers don't support it yet.* -## Hint: +## 💡 Hint: - How to use the background-size: http://lmgtfy.com/?q=css+background diff --git a/exercises/04.1-Combined-Rules/tests.js b/exercises/04.1-Combined-Rules/tests.js index c6f62acc..8480b590 100644 --- a/exercises/04.1-Combined-Rules/tests.js +++ b/exercises/04.1-Combined-Rules/tests.js @@ -11,7 +11,7 @@ describe("All the styles should be applied", ()=> { const link = document.querySelector("link"); const title = document.querySelector('title'); - test("The body tag should not contains any inline style", ()=> { + test("The body tag should not contain any inline style", ()=> { document.querySelector( "head" ).innerHTML = ``; @@ -19,7 +19,7 @@ describe("All the styles should be applied", ()=> { expect(body.style._values).toEqual(emptyBodyInlineStyle); }); - test("the width should be '50px'", ()=> { + test("The width should be '50px'", ()=> { // get computed styles of any element you like document.querySelector( "head" @@ -37,7 +37,7 @@ describe("All the styles should be applied", ()=> { expect(orangeHoverSelector).toBe('50px'); }); - test("the height should be '50px'", ()=> { + test("The height should be '50px'", ()=> { // get computed styles of any element you like document.querySelector( "head" @@ -55,7 +55,7 @@ describe("All the styles should be applied", ()=> { expect(orangeHoverSelector).toBe('50px'); }); - test("the background-size should be contain", ()=> { + test("The background-size should be 'contain'", ()=> { document.querySelector( "head" ).innerHTML = ``; @@ -72,7 +72,7 @@ describe("All the styles should be applied", ()=> { expect(orangeHoverSelector).toBe('contain'); }); - test("the background should include the shorthand property", ()=> { + test("The background should include the shorthand property", ()=> { document.querySelector( "head" ).innerHTML = ``; @@ -102,7 +102,7 @@ describe("All the styles should be applied", ()=> { expect(orangeHoverSelector).toContain('url(https://github.com/4GeeksAcademy/css-tutorial-exercises-course/blob/3a2d1dd03f58167a5a4894155af2d3aa4d41d647/.learn/assets/baby.jpg?raw=true)'); }); - test("the padding should include the shorthand property in the right order (top, right, bottom, left)", ()=> { + test("The padding should include the shorthand property in the right order (top, right, bottom, left)", ()=> { document.querySelector( "head" ).innerHTML = ``;