-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
216 lines (197 loc) · 11.3 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
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
<link href="https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,400;0,700;1,100;1,300;1,400;family=Open+Sans:ital,wght@0,300;0,400;0,600;1,600;family=Roboto:ital,wght@0,100;0,300;0,400;0,500;1,400;1,500&;display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Fjalla+One&family=Source+Sans+Pro&display=swap" rel="stylesheet">
<link rel="stylesheet" href="./CSS/estilos.css">
<title>Hola! Soy Ángel :)</title>
<link rel="icon" type="images/png" href="images/favicon.png">
<script src="https://kit.fontawesome.com/7f0cacb580.js" crossorigin="anonymous"></script>
</head>
<body>
<i class="icon-menu burguer-button" id="burger-menu"></i>
<header class="header">
<div class="container">
<figure class="logo-imageContainer">
<img class="logo" src="images/logo.png" height="70" alt="Logo de Angel Gonzalez">
</figure>
<nav class="menu">
<ol>
<li>
<a class="link" href="#experiencia">Experiencia</a>
</li>
<li>
<a class="link" href="#contacto">Contacto</a>
</li>
</ol>
</nav>
</div>
</header>
<section class="hero">
<div class="container">
<div class="hero-text">
<h1>
Hey! Soy <br><strong>Ángel González</strong><br>
</h1>
<p> { Mechatronic Engineer / Software / Geek Inside }</p>
</div>
<figure class="hero-image">
<img src="images/perfilAngel.png" width="400" height="400" alt="">
</figure>
</div>
</section>
<section id="experiencia" class="journey">
<div class="container">
<h2>Mi viaje</h2>
</div>
<div class="container2">
<article class="experience">
<figure class="experience-imageContainer">
<img class="experience-image" src="images/urcologo.jpg" width="200px" height="200px" alt="logotipo avanade">
</figure>
<div class="experience-details">
<h3 class="experience-name">Urco TES</h3>
<h4 class="experience-position">Mechatronic Engineer</h4>
<p class="experience-city">Málaga</p>
<p class="experience-description">Ensamblar y reparar una motocicleta eléctrica destinada a llevar un panel publicitario LCD. <br><br>
Responsabilidades/tareas diarias: <br>
- Ensamblar vehículos y paneles LCD. <br>
- Mantenimiento y reparación de la electrónica. <br>
- Mantenimiento y reparación de vehículos. <br>
- Mantenimiento de la batería. <br>
- Relación con proveedores. <br><br>
Resultados de las acciones anteriores: <br>
- Buen manejo de las herramientas. <br>
- Buenos conocimientos de electrónica. <br>
- Conocimientos generales sobre motores eléctricos. <br><br>
Entorno técnico: <br>
Motos eléctricas, baterías, controladores de motores, manejo de la electrónica.
</p>
</div>
</article>
<article class="experience">
<figure class="experience-imageContainer">
<img class="experience-image" src="images/logo-avanade.png" width="200px" height="200px" alt="logotipo avanade">
</figure>
<div class="experience-details">
<h3 class="experience-name">Avanade</h3>
<h4 class="experience-position">Analyst, Software Engineer</h4>
<p class="experience-city">Málaga</p>
<p class="experience-description">Desarrollo Web y Consultoría de Software. <br>
Fui parte del equipo de desarrollo web con tecnología .NET. <br>
Trabajé apoyando varios proyectos en funcionamiento y desarrollando nuevos proyectos basados en<br>
entornos .NET, administré las bases de datos con SQL y asistí a los requerimientos del cliente. <br><br>
Responsabilidades/tareas diarias:<br>
- Resolver cuestiones técnicas.<br>
- Análisis de la especificación de los requisitos. <br>
- Diseño e implementación de código. <br>
- Depurar errores de programación. <br>
- Escribir documentación, diagramas de diseño. <br><br>
Resultados de las acciones anteriores: <br>
- Buen conocimiento de la gestión de datos. <br>
- Experiencia en el trabajo con un equipo internacional. <br><br>
Entorno técnico: <br>
Microsoft Studio, ASP.NET, C#, SQL, PL/SQL, JavaScript, CSS, HTML, Microsoft Team, Visual Basic 6, LINQ, API REST, Windows Form.
</p>
</div>
</article>
<article class="experience">
<figure class="experience-imageContainer">
<img class="experience-image" src="images/aero-logo.jpg" width="200px" height="200px" alt="logotipo avanade">
</figure>
<div class="experience-details">
<h3 class="experience-name">AERO Electric Vehicle Racing Team</h3>
<h4 class="experience-position">Laboratory Assistant</h4>
<p class="experience-city">Málaga</p>
<p class="experience-description">PIE17-120. Proyecto de Innovación Estudiantil. Diseño y fabricación de un Vehículo Eléctrico Ligero (LEV). El propósito era construir el vehículo eléctrico ligero más efectivo posible. <br><br>
Estuve a cargo de la electrónica y el diseño del BMS (Sistema de Gestión de la Batería) y la interfaz con el piloto utilizando los paneles de Arduino y LCD. <br><br>
Responsabilidades/tareas diarias: <br>
- Documentar los requisitos del proyecto. <br>
- Diseñar la arquitectura electrónica del vehículo. <br>
- Programación de Arduino. <br><br>
Resultados de las acciones anteriores: <br>
- Hice un estudio sobre la dinámica de una motocicleta eléctrica en un banco de potencia. <br>
- Desarrollé un temporizador para medir los tiempos con un panel de control. <br>
- Desarrollé un BMS (Battery Management System) para una batería de litio con Arduino. <br>
- Buen manejo al soldar los componentes electrónicos. <br>
- Diseñar la caja del panel de control con SolidWorks. <br><br>
Entorno técnico: <br>
Vehículo eléctrico, microcontrolador, baterías, SolidWorks, Arduino.
</p>
</div>
</article>
</div>
</section>
<section class="skills">
<div class="container">
<h2 class="skills-title">Herramientas y tecnologías</h2>
<div class="skills-icons">
<i class="fab fa-npm" aria-hidden="true"></i>
<i class="fab fa-js-square" aria-hidden="true"></i>
<i class="fab fa-html5" aria-hidden="true"></i>
<i class="fab fa-css3-alt" aria-hidden="true"></i>
<i class="fab fa-git" aria-hidden="true"></i>
<i class="fab fa-node" aria-hidden="true"></i>
<i class="fab fa-github" aria-hidden="true"></i>
<i class="fab fa-bootstrap" aria-hidden="true"></i>
<i class="fab fa-slack" aria-hidden="true"></i>
</div>
<p style="color: lightgray;">- { - } -</p>
<div class="skills-ux">
<p>Design Thinking</p>
<p>UX/UI</p>
<p>JQuery</p>
<p>VS Code</p>
<p>Analytics</p>
</div>
</div>
</section>
<section id="contacto" class="contact">
<div class="container">
<h2>Contáctame en Likedin o Twitter</h2>
<div class="social">
<a href="https://twitter.com/angelgonzaleh" class="social-link twitter" target="_blank"></a>
<a href="https://instagram.com/angelgonzaleh" class="social-link instagram" target="_blank"></a>
<a href="https://linkedin.com/in/angelgonzalezev" class="social-link linkedin" target="_blank"></a>
<a href="https://github.com/angelgonzalezev" class="social-link github" target="_blank"></a>
</div>
</div>
</section>
<footer class="footer">
<div class="container">
<div>
<p>2020. Desarrollo Web</p>
</div>
<div>
<p>Diseñado con 💚 por <a href="https://twitter.com/angelgonzaleh" target="_blank">@AngelGonzalez</a></p>
</div>
</div>
</footer>
<script>
const ipad = window.matchMedia('screen and (max-width: 767px)');
const menu = document.querySelector('.menu');
const burguerButton = document.querySelector('#burger-menu');
burguerButton.addEventListener('click', hideShow)
ipad.addListener(validation)
function validation(event){
if(event.matches){
burguerButton.addEventListener('click', hideShow)
}
else{
burguerButton.removeEventListener('click', hideShow)
}
}
validation(ipad);
function hideShow(){
if(menu.classList.contains('is-active')){
menu.classList.remove('is-active');
}
else{
menu.classList.add('is-active');
}
}
</script>
</body>
</html>