Merge pull request 4GeeksAcademy#53 from Sadiel0/anchor-like-button

tommygonzaleza · web-flow · commit 1ec03b5b2f06 · 2022-07-26T17:15:54.000-04:00
Added missing instructions to the Readme
diff --git a/exercises/13-Anchor-Like-Button/README.es.md b/exercises/13-Anchor-Like-Button/README.es.md
@@ -10,15 +10,17 @@ 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 aplicárselo al `background`.
+3. Haz que el `border` sea `1px solid #ffffff`
 
-4. Eliminar subrayado: establece `text-decoration` a `none`.
+4. Encuentra y aplica el color: usa el selector de `color` (color picker) para encontrar el color exacto y aplicárselo al `background`.
 
-5. Establecer el color del texto en blanco (`white`)
+5. Eliminar subrayado: establece `text-decoration` a `none`.
+
+6. Establecer el color del texto en blanco (`white`)
 
 *Para que el botón se vea diferente cuando el usuario pasa el mouse por encima, usamos el selector `:hover`: http://lmgtfy.com/?q=how+to+use+the+hover*
 
-6. Dentro del selector `:hover` cambia el fondo del botón a un color naranja más oscuro.
+7. Dentro del selector `:hover` cambia el fondo del botón a `#cc7a00`.
 
 ## Reultado esperado:
 
diff --git a/exercises/13-Anchor-Like-Button/README.md b/exercises/13-Anchor-Like-Button/README.md
@@ -8,15 +8,17 @@ Anchors are not only used within text- when you are going to use anchors outside
 
 2. Rounded borders: Set `border-radius` to `4px`.
 
-3. Find and apply the color: Use the color picker to find the color and apply make the background to that color.
+3. Set the `border` to `1px solid #ffffff`
 
-4. Remove underline: Set `text-decoration` to `none`.
+4. Find and apply the color: Use the color picker to find the color and apply make the background to that color.
 
-5. Set the color of the text to `white`.
+5. Remove underline: Set `text-decoration` to `none`.
+
+6. Set the color of the text to `white`.
 
 *To make the button look different when the user hovers over with the mouse, we use the `:hover` selector: http://lmgtfy.com/?q=how+to+use+the+hover*
 
-6. Inside of the `:hover` selector change the background of the button to a `darker orange`.
+7. Inside of the `:hover` selector change the background of the button to `#cc7a00`.
 
 ## Expected result:
 
diff --git a/exercises/13-Anchor-Like-Button/solution-hide.css b/exercises/13-Anchor-Like-Button/solution-hide.css
@@ -0,0 +1,14 @@
+.orange-btn {
+	/*your code here*/
+	padding: 10px;
+	border-radius: 4px;
+	border: 1px solid #ffffff;
+	background-color: rgb(255, 153, 51);
+	text-decoration: none;
+	color: white;
+}
+
+.orange-btn:hover {
+	/*YOUR CODE HERE FOR THE HOVER STATE*/
+	background: #cc7a00;
+}
diff --git a/exercises/13-Anchor-Like-Button/styles.css b/exercises/13-Anchor-Like-Button/styles.css
@@ -1,7 +1,9 @@
 .orange-btn {
 	/*your code here*/
+    
 }
 
 .orange-btn:hover {
 	/*YOUR CODE HERE FOR THE HOVER STATE*/
-}
+
+}
diff --git a/exercises/13-Anchor-Like-Button/tests.js b/exercises/13-Anchor-Like-Button/tests.js
@@ -75,7 +75,7 @@ describe("All the styles should be applied", function () {
     let orangeHoverSelector="";
     for (let i=0; i<cssArray.length; i++) {
       if (cssArray[i].selectorText===".orange-btn:hover") {
-        orangeHoverSelector=cssArray[i].style.background;
+        orangeHoverSelector=cssArray[i].style.background ;
       }
     }
 
diff --git a/learn.json b/learn.json
@@ -16,4 +16,4 @@
     "editor": {
         "version": "1.0.73"
     }
-}
+}

Original file line number	Diff line number	Diff line change
`@@ -75,7 +75,7 @@ describe("All the styles should be applied", function () {`
`75`	`75`	`let orangeHoverSelector="";`
`76`	`76`	`for (let i=0; i<cssArray.length; i++) {`
`77`	`77`	`if (cssArray[i].selectorText===".orange-btn:hover") {`
`78`		`- orangeHoverSelector=cssArray[i].style.background;`
	`78`	`+ orangeHoverSelector=cssArray[i].style.background ;`
`79`	`79`	`}`
`80`	`80`	`}`
`81`	`81`
Original file line number	Diff line number	Diff line change
`@@ -16,4 +16,4 @@`
`16`	`16`	`"editor": {`
`17`	`17`	`"version": "1.0.73"`
`18`	`18`	`}`
`19`		`-}`
	`19`	`+}`