Skip to content

Commit 9486301

Browse files
alesanchezralesanchezr
authored
Merge branch 'master' into master
2 parents 5b6dcd6 + 626e0b4 commit 9486301

File tree

51 files changed

+522
-129
lines changed

Some content is hidden

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

51 files changed

+522
-129
lines changed

‎.learn/resets/04.1-Combined-Rules/styles.css

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+
}

‎.learn/resets/04.2-Apply-several-classes/index.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 Class selector
7+
</title>
8+
</head>
9+
10+
<body>
11+
<div class="card spades">9</div>
12+
</body>
13+
</html>

‎.learn/resets/04.3-id-Selector/index.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>

‎.learn/resets/04.3-id-Selector/styles.css

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+
}

‎.learn/resets/05-Specificity/index.html

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>

‎.learn/resets/05-Specificity/styles.css

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+

‎.learn/resets/06-Practicing-Rules/index.html

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.

‎.learn/resets/07-Very-Specific-Rules/index.html

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>

‎.learn/resets/07-Very-Specific-Rules/styles.css

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+
}

‎.learn/resets/08-Rounded-Image/index.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+
<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>

‎.learn/resets/08-Rounded-Image/styles.css

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+
}

‎.learn/resets/09-Anchor-Styles/index.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+
<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>

‎.learn/resets/09-Anchor-Styles/styles.css

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+
}

‎.learn/resets/10-Your-Own-Font/index.html

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>

‎.learn/resets/10-Your-Own-Font/styles.css

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+
}

‎.learn/resets/11-Font-Awesome-Icons/index.html

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>

‎.learn/resets/11-Font-Awesome-Icons/styles.css

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+
}

‎.learn/resets/12-Relative-Length-EM-REM/index.html

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>

‎.learn/resets/12-Relative-Length-EM-REM/styles.css

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 */

‎.learn/resets/13-Anchor-Like-Button/index.html

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>

‎.learn/resets/13-Anchor-Like-Button/styles.css

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+
}

‎bc.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
{
22
"language": "css",
33
"preview": "https://github.com/4GeeksAcademy/css-tutorial-exercises-course/blob/master/preview.png?raw=true",
4+
"repository": "https://github.com/4GeeksAcademy/css-tutorial-exercises-course",
45
"title": "Learn CSS Interactively",
56
"intro": "https://www.youtube.com/watch?v=BDKdUPDez-U",
67
"description": "Learn CSS with an interactive and auto-graded tutorial with dozens of exercises.",

‎exercises/00-Welcome/README.es.md

Lines changed: 14 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -4,26 +4,27 @@ intro: "https://www.youtube.com/watch?v=BDKdUPDez-U"
44

55
# ¡¡Bienvenido a los ejercicios de CSS!!
66

7-
Mi nombre es Alejandro Sanchez [@alesanchezr](https://twitter.com/alesanchezr). ¡¡Estoy muy contento de que estés aquí!! 🎉 😂
8-
Aprender a programar es dificil ¡necesitas entrenamiento! Envíame un DM en Twittwer si tienes alguna pregunta.
9-
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.
109

1110
Durante este curso aprenderás los siguientes conceptos:
1211

13-
1. Cómo aplicarle CSS a tu sitio web de tres maneras diferentes: Inline, agrupandolo dentro de una etiqueta `<style>`o sando una hoja de estilos `<link>` externa.
14-
2. A seleccionar Elementos HTML de tu sitio web para aplicarle estilos.
15-
3. A aplicar Reglas CSS (estilos) a esos elementos.
16-
5. Aprenderás los trucos más populares de CSS.
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.
1718

18-
Puede que ya hayas notado que HTML te permite crear solo sitios web básicos. Nadie quiere ver un sitio web blanco con un texto horrible ¡Así que es hora de aprender todo sobre CSS! Aprende a embellecer tu sitio web ¡Hagamos que brille!
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!
1920

2021
## Colaboradores
2122

22-
Agradecimientos a estas increíbles personas: ([emoji key](https://github.com/kentcdodds/all-contributors#emoji-key)):
23+
Muchas gracias a estas personas maravillosas ([emoji key](https://github.com/kentcdodds/all-contributors#emoji-key)):
2324

24-
1. [Alejandro Sanchez (alesanchezr)](https://github.com/alesanchezr), contribution: (coder) :computer: (idea) 🤔, (build-tests) :warning:, (pull-request-review) :eyes: (build-tutorial) :white_check_mark: (documentation) :book:
25-
1. [Paolo Lucano (plucodev)](https://github.com/plucodev), contribution: (coder), (build-tests) :warning:
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:
2627

27-
This project follows the
28+
Este proyecto sigue las especificaciones
2829
[all-contributors](https://github.com/kentcdodds/all-contributors)
29-
specification. Contributions of any kind are welcome!
30+
¡Todas las contribuciones son bienvenidas!

‎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)