Skip to content

Commit 626e0b4

Browse files
authored
Merge pull request 4GeeksAcademy#12 from ElviraQDP/checks
revision of exercises
2 parents 724470d + 2199cb9 commit 626e0b4

File tree

49 files changed

+523
-102
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

49 files changed

+523
-102
lines changed
Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
.what {
2+
width: 50px;
3+
height: 50px;
4+
padding-top: 10px;
5+
padding-left: 30px;
6+
padding-right: 190px;
7+
padding-bottom: 50px;
8+
/* padding: 10px 30px 50px 190px; */
9+
background: rgb(189, 189, 189);
10+
background-image: url(https://assets.breatheco.de/apis/img/funny/baby.jpg);
11+
background-position-x: 100px;
12+
background-repeat: no-repeat;
13+
background-size: contain;
14+
}
Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<link rel="stylesheet" type="text/css" href="./styles.css" />
5+
<title>
6+
04 Class selector
7+
</title>
8+
</head>
9+
10+
<body>
11+
<div class="card spades">9</div>
12+
</body>
13+
</html>
Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<link rel="stylesheet" type="text/css" href="./styles.css" />
5+
<title>
6+
04.3 ID selector
7+
</title>
8+
</head>
9+
10+
<body>
11+
<span>I should look like a button</span>
12+
</body>
13+
</html>
Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
#button1 {
2+
background: #BDBDBD;
3+
border: #5E5E5E;
4+
border-radius: 5px;
5+
}
Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta charset="utf-8" />
5+
<meta name="viewport" content="width=device-width" />
6+
<link rel="stylesheet" type="text/css" href="./styles.css" />
7+
<title>05 Specificity</title>
8+
</head>
9+
<body>
10+
<ul>
11+
<li>My first item of the list</li>
12+
<li>My second item of the list</li>
13+
<li id="thirditem">My third item of the list</li>
14+
<li>My forth item of the list</li>
15+
<li>My fifth item of the list</li>
16+
</ul>
17+
</body>
18+
</html>
Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
ul li{
2+
background: blue;
3+
}
4+
5+
#thirditem{
6+
background: yellow;
7+
}
8+
/****** DON NOT EDIT ANYTHING ABOVE THIS LINE ****/
9+
Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
//nothing to see here

.learn/resets/06-Practicing-Rules/styles.css

Whitespace-only changes.
Lines changed: 82 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,82 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta charset="utf-8" />
5+
<meta name="viewport" content="width=device-width" />
6+
<link rel="stylesheet" type="text/css" href="./styles.css" />
7+
<title>07 Very Specific Rules</title>
8+
</head>
9+
<body>
10+
<h1>The learning essay</h1>
11+
<h2>3 reasons you know you are learning</h2>
12+
<p id="id1">
13+
We are going to explain in this pharagraph the 3 most comon signs that you should look into yourself to recognize if you are learning.
14+
</p>
15+
<ol>
16+
<li>You are able to complete the exercises by yourself.</li>
17+
<li>You understand what the teacher is talking about</li>
18+
<li>Your are able to have conversations about the topic</li>
19+
</ol>
20+
<h2>3 reasons you know love what you are learning</h2>
21+
<ul>
22+
<li>Time passes fast.</li>
23+
<li>You are anxious to finish this excercise and start the next one.</li>
24+
<li>Is 12am and you don't want to go to sleep.</li>
25+
</ul>
26+
<p>
27+
If you can't sleep, what better than watching videos of cats?
28+
<a href="https://www.youtube.com/watch?v=WEgWMOzQ8IE">click here</a>
29+
</p>
30+
31+
<table>
32+
<tr>
33+
<td>Age</td>
34+
<td>Gender</td>
35+
</tr>
36+
<tr>
37+
<td>12 years</td>
38+
<td>Male</td>
39+
</tr>
40+
<tr>
41+
<td>22 years</td>
42+
<td>Female</td>
43+
</tr>
44+
<tr>
45+
<td>11 years</td>
46+
<td>Male</td>
47+
</tr>
48+
<tr>
49+
<td>21 years</td>
50+
<td>Male</td>
51+
</tr>
52+
<tr>
53+
<td>22 years</td>
54+
<td>Female</td>
55+
</tr>
56+
<tr>
57+
<td>10 years</td>
58+
<td>Male</td>
59+
</tr>
60+
<tr>
61+
<td>13 years</td>
62+
<td>Female</td>
63+
</tr>
64+
<tr>
65+
<td>13 years</td>
66+
<td>Male</td>
67+
</tr>
68+
<tr>
69+
<td>10 years</td>
70+
<td>Male</td>
71+
</tr>
72+
<tr>
73+
<td>11 years</td>
74+
<td>Male</td>
75+
</tr>
76+
<tr>
77+
<td>11 years</td>
78+
<td>Male</td>
79+
</tr>
80+
</table>
81+
</body>
82+
</html>
Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
/** Insert your code here **/
2+
3+
/*********** READ ONLY BLOCK ******
4+
You CAN NOT UPDATE anything from here on,
5+
only add lines of code on top of this lines
6+
**/
7+
8+
body {
9+
color: blue;
10+
}
11+
12+
ul li,
13+
ol li {
14+
color: green;
15+
}
Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta charset="utf-8" />
5+
<meta name="viewport" content="width=device-width" />
6+
<link rel="stylesheet" type="text/css" href="./styles.css" />
7+
<title>08 Rounded Image</title>
8+
</head>
9+
10+
<body>
11+
<img class="rounded" src="https://assets.breatheco.de/apis/img/funny/einstein.png" />
12+
</body>
13+
</html>
Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
body {
2+
background: #bdbdbd;
3+
}
4+
.rounded {
5+
border-radius: 100%;
6+
}
Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta charset="utf-8" />
5+
<meta name="viewport" content="width=device-width" />
6+
<link rel="stylesheet" type="text/css" href="./styles.css" />
7+
<title>09 Anchor Styles</title>
8+
</head>
9+
10+
<body>
11+
<a class="threeDimension" href="#">Click me</a>
12+
</body>
13+
</html>
Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
2+
.threeDimension {
3+
display: block;
4+
border: 1px solid;
5+
border-color: #aaa #000 #000 #aaa;
6+
width: 8em;
7+
background: #fc0;
8+
text-decoration: none;
9+
text-align: center;
10+
color: black;
11+
}
12+
13+
a.threeDimension:active {
14+
/* your code here*/
15+
16+
}
Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta charset="utf-8" />
5+
<meta name="viewport" content="width=device-width" />
6+
<!--your code here -->
7+
8+
<link rel="stylesheet" type="text/css" href="./styles.css" />
9+
10+
<title>10 Your Own Font</title>
11+
</head>
12+
<body>
13+
<h1 class="myTitle">My unique font</h1>
14+
</body>
15+
</html>
Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
.myTitle {
2+
/*your code here*/
3+
}
Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta charset="utf-8" />
5+
<meta name="viewport" content="width=device-width" />
6+
<link rel="stylesheet" type="text/css" href="./styles.css" />
7+
<title>11 Font Awesome</title>
8+
</head>
9+
<body>
10+
<ul>
11+
<li><i class="fa fa-camera-retro"></i> Hello</li>
12+
</ul>
13+
</body>
14+
</html>
Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
li {
2+
list-style: none;
3+
}
Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta charset="utf-8" />
5+
<meta name="viewport" content="width=device-width" />
6+
<link rel="stylesheet" type="text/css" href="./styles.css" />
7+
<title>12 Relative Length EM REM</title>
8+
</head>
9+
<body>
10+
<div id="my-first-div">
11+
<h2>First h2 heading</h2>
12+
<h3>First h3 heading</h3>
13+
<p>Here is some nice fake content</p>
14+
</div>
15+
<div id="the-second-one">
16+
<h2>Second h2 heading</h2>
17+
<h3>Second h3 heading</h3>
18+
<p>More fake content but now in the second container</p>
19+
</div>
20+
</body>
21+
</html>
Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
#my-first-div {
2+
font-size: 15px;
3+
}
4+
#the-second-one {
5+
font-size: 25px;
6+
}
7+
8+
/* YOUR CODE BELOW THIS LINE */
Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta charset="utf-8" />
5+
<meta name="viewport" content="width=device-width" />
6+
<link rel="stylesheet" type="text/css" href="./styles.css" />
7+
<title>13 Anchor Like Button</title>
8+
</head>
9+
<body>
10+
<a href="#" class="orange-btn">Beautiful Button</a>
11+
</body>
12+
</html>
Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
.orange-btn {
2+
/*your code here*/
3+
}
4+
5+
.orange-btn:hover {
6+
/*YOUR CODE HERE FOR THE HOVER STATE*/
7+
}

exercises/00-Welcome/README.es.md

Lines changed: 31 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
---
2+
intro: "https://www.youtube.com/watch?v=BDKdUPDez-U"
3+
---
4+
5+
# ¡¡Bienvenido a los ejercicios de CSS!!
6+
7+
Mi nombre es Alejandro Sanchez [@alesanchezr](https://twitter.com/alesanchezr) ¡Estoy muy contento de que estén aquí! 🎉 😂
8+
Aprender a programar es dificil ¡Necesitas coaching! Envíame un DM vía Twitter si tienes alguna pregunta.
9+
10+
Durante este curso aprenderás los siguientes conceptos:
11+
12+
1. Cómo aplicar CSS a tu sitio web de tres formas diferentes:
13+
Inline, agrupando todo dentro de la etiqueta `<style>` o usando una hoja de estilos externa `<link>`,
14+
2. Seleccionar elementos HTML para tu sitio web para aplicarle estilos,
15+
3. Aplicarle reglas CSS (estilos) a esos elementos,
16+
4. A usar las reglas CSS más populares,
17+
5. Aprender los trucos más populares de CSS.
18+
19+
Como te habrás dado cuenta, HTML sólo te permite crear sitios web básicos. Nadie quiere ver un sitio web en blanco con un texto horrible. ¡Así que es hora de aprender CSS! Aprende CSS para que tu sitio web sea hermoso ¡Hagámos que brille!
20+
21+
## Colaboradores
22+
23+
Muchas gracias a estas personas maravillosas ([emoji key](https://github.com/kentcdodds/all-contributors#emoji-key)):
24+
25+
1. [Alejandro Sanchez (alesanchezr)](https://github.com/alesanchezr), contribución: (programador) :computer: (idea) 🤔, (build-tests) :warning:, (pull-request-review) :eyes: (build-tutorial) :white_check_mark: (documentation) :book:
26+
1. [Paolo Lucano (plucodev)](https://github.com/plucodev), contribución: (programador), (build-tests) :warning:
27+
28+
Este proyecto sigue las especificaciones
29+
[all-contributors](https://github.com/kentcdodds/all-contributors)
30+
¡Todas las contribuciones son bienvenidas!
31+

exercises/00-Welcome/README.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ Learning to code is hard, you need coaching! DM me on twitter if you have any qu
99

1010
During this course you will be learning the following concepts:
1111

12-
1. Using how to apply CSS to your website in 3 different ways: Inline, by grouping them together inside a `<style>` tag or using an exeternal stylesheet `<link>`,
12+
1. How to apply CSS to your website in 3 different ways: Inline, by grouping them together inside a `<style>` tag or using an exeternal stylesheet `<link>`,
1313
2. Selecting HTML Elements from your website to apply the styles to.
1414
3. Apply CSS Rules (styles) to those elements.
1515
4. Use the most popular CSS Rules.

0 commit comments

Comments
 (0)