Merge pull request 4GeeksAcademy#96 from josemoracard/jose11-04.1-combined-rules

fixed text 04.1-combined-rules

Author: tommygonzaleza

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

exercises/04.1-Combined-Rules/README.md

@@ -4,17 +4,17 @@ 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;
 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
 

exercises/04.1-Combined-Rules/tests.js

@@ -11,15 +11,15 @@ 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 = `<style>${css.toString()}</style>`;
     let emptyBodyInlineStyle = {};
     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 = `<style>${css.toString()}</style>`;
@@ -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 = `<style>${css.toString()}</style>`;
@@ -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 = `<style>${css.toString()}</style>`;