forked from codigofacilito/vacaciones-cody
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
155 lines (140 loc) · 5.16 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Mis vacaciones</title>
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<main>
<div class="container-hero">
<header>
<nav>
<div class="cody-img">
<img src="./images/cody2.png" alt="cody">
</div>
<div class="container-items">
<a href="index.html">
<img src="./images/home_yellow.svg" alt="icon-home">
<p>Inicio</p>
</a>
<a href="fotos.html">
<img src="./images/collections_yellow.svg" alt="icon-collec">
<p>Fotos</p>
</a>
</div>
</nav>
<div class="container-info">
<h1>Estas son mis Vacaciones</h1>
<p>Soy Cody, un aspirante a Dev, en 2019, organicé un viaje para desestresarme del código, y en esta página
quiero compartirlo contigo.</p>
</div>
<div class="wave" style="height: 150px; overflow: hidden;"><svg viewBox="0 0 500 150" preserveAspectRatio="none"
style="height: 100%; width: 100%;">
<path d="M-13.82,-2.45 C113.15,288.64 349.20,-49.98 525.11,80.42 L500.00,150.00 L0.00,150.00 Z"
style="stroke: none; fill: #013f88;"></path>
</svg></div>
</header>
</div>
<div class="container">
<section class="section-one">
<header>
<h2>Mis vacaciones Frontend</h2>
</header>
<p> Durante el verano de 2019, decidí comenzar a aprender desarrollo frontend, por lo que durante mi viaje,
estuve
aprendiendo HTML, CSS, y JavaScript </p>
<p> Cada tarde, después de conocer nuevos lugares en mis vacaciones, practicaba mis habilidades en tecnologías
frontend, construyendo esta página </p>
<p> Estos son los cursos que estuve tomando </p>
<div class="cursos">
<div class="box-1">
<div class="btn">
<spam>Curso profesional de Desarrollo Web</spam>
</div>
</div>
<div class="box-2">
<div class="btn">
<spam>Curso para crear mi primera página web</spam>
</div>
</div>
</div>
</section>
<section class="section-two">
<header>
<h2>Ruta de aprendizaje 2021</h2>
<p> También me propuse aprender nuevas tecnologías durante 2021</p>
</header>
<ul>
<li> Flexbox, y Grid </li>
<li> Animaciones con CSS y JavaScript </li>
<li> AJAX </li>
<li> HTML semántico </li>
<li> Entre otros </li>
</ul>
</section>
<section class="section-three">
<header>
<h2>Colabora en mi página</h2>
</header>
<p>
Como parte de mi formación Frontend, aprendí acerca de Git y GitHub, por lo que decidí subir mi código a
GitHub
</p>
<p>
Puedes ayudarme a mejorar mi página, haciendo un fork de mi página, y enviando un pull request.
</p>
<p>
Si nunca antes has colaborado con un repositorio, en Código Facilito hay un tutorial que lo explica
<a href="https://www.youtube.com/watch?v=fLQeXM4Cuqk" target="_blank">Ir al tutorial</a>
</p>
</section>
<section class="section-four">
<header>
<h2>Aquí te comparto algunas fotos de mis vacaciones</h2>
<p>¡Bien! Sé que estás aquí por mis vacaciones, aquí te comparto algunas fotos que tomé:</p>
</header>
<p>
Puedes ver más, en la galería de fotos de mi página
<a href="fotos.html">Ir a la galería</a>
</p>
</section>
<div class="contenedor">
<div class="fotos slider-contenedor">
<div class="contenido-slider">
<img src="images/2.jpg" alt="Cody acampando">
</div>
<div class="contenido-slider">
<img src="images/3.jpg" alt="Cody en una alberca">
</div>
<div class="contenido-slider">
<img src="images/1.jpg" alt="Cody en la playa">
</div>
</div>
</div>
<section class="section-five">
<header>
<h2>La importancia de las vacaciones</h2>
<p>Aprender a programar y escribir código, puede ser estresante, por eso es muy importante que periódicamente
nos desconectemos y descansemos apropiadamente</p>
<p>Durante mis vacaciones aprendí que existen distintos beneficios de descansar:</p>
<ol>
<li>Mejora la salud mental</li>
<li>Incrementa la motivación</li>
<li>Reduce el burnout</li>
<li>Mejora tu productividad y creatividad</li>
</ol>
</header>
</section>
</div>
<footer>
<p>
Developed With 🧡 By <a href="https://github.com/JoseGonzalez-git/vacaciones-cody" target="_blank">JoseGonzalez-git</a>
</p>
</footer>
</main>
<script src="./js/main.js"></script>
</body>
</html>