-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
282 lines (264 loc) · 15.2 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
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
<!DOCTYPE html>
<html lang="es">
<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">
<link href='https://unpkg.com/boxicons@2.1.4/css/boxicons.min.css' rel='stylesheet'>
<title>Product Landing Page</title>
<link rel="shortcut icon" href="./assets/superman-ico.ico" type="image/x-icon">
<link rel="stylesheet" href="styles.css">
</head>
<body>
<header id="header">
<figure class="logo">
<img id="header-img"
src="https://t4.ftcdn.net/jpg/05/80/59/63/240_F_580596313_yKVfja6bIHiGY14Q6MzwKJ38mH6NILfH.jpg"
alt="Egg gold logo" crossorigin="anonymous" rel="noreferrer">
<figcaption class="logo-name">
<h2>Get gold talent</h2>
</figcaption>
</figure>
<nav id="nav-bar">
<ul>
<!-- <li><a class="nav-link" href="#home">Home</a></li> -->
<li><a class="nav-link" href="#promo">Promo</a></li>
<li><a class="nav-link" href="#skills">Skills</a></li>
<li><a class="nav-link" href="#features">Features</a></li>
<li><a class="nav-link contact" href="#contact">Contact</a></li>
</ul>
</nav>
</header>
<main id="main">
<section id="promo">
<article class="promo-video">
<div class="container-news">
<h2>Lanzamiento del cohete Starship</h2>
<p>Que la explosión del mayor y más potente cohete fabricado hasta la fecha termine en
ovación... dice la clase de personas talentosas que trabajan en <span
class="golden">SpaceX</span>, la perseverancia y la constancia son aptitudes muy
importantes si además no te falta inversión.</p>
<p>En <span class="Ggt-1">Get gold talent</span> nos hemos asegurado de que nuestros activos
dispongan como mínimo de estas skills planas/comunes. Para nosotros es la base fundamental para
poder ofrecer grandes talentos.</p>
</div>
<div class="container-video">
<iframe id="video" frameborder="0" type="text/html" croosorigin="anonymous"
src="https://www.dailymotion.com/embed/video/x8k9g35" width="100%" height="100%"
allowfullscreen title="Dailymotion Video Player" allow="autoplay">
</iframe> <!-- ?autoplay=1 -->
</div>
</article>
<article class="promo-skills_common" id="skills">
<ul class="container-icons-skills_common">
<li class="row_icons">
<span class='bx bx-check-circle bx-flashing slow'></span>
<h2>Skills Comunes certificadas entre nuestros activos:</h2>
</li>
<li class="row_icons">
<div>
<span class='bx bx-search-alt bx-tada slow'></span>
</div>
<div class="text-style">
<h3>Creatividad y pensamiento divergente:</h3>
<p>El talento de encontrar soluciones únicas e ingeniosas, generando múltiples ideas a
partir de un solo estímulo o problema.</p>
</div>
</li>
<li class="row_icons">
<div>
<span class='bx bx-group bx-burst slow'></span>
</div>
<div class="text-style">
<h3>Fortaleza de equipo:</h3>
<p>Una colaboración colectiva, sana y competitiva es fundamental para el éxito del
conjunto. Nuestro proceso minucioso en la búsqueda de altas capacidades, garantiza
en ofrecer a nuestros <span class="goldenI">Gold talents</span> con esta valiosa
faceta entre su repertorio.</p>
</div>
</li>
<li class="row_icons">
<div>
<span class='bx bx-cog bx-spin slow'></span>
</div>
<div class="text-style">
<h3>Pensamiento analítico:</h3>
<p>La habilidad de resolver problemas complejos a priori, identificando y descomponiendo
en partes más pequeñas y vulnerables.</p>
</div>
</li>
<li class="row_icons">
<div>
<span class='bx bxs-hand-up bx-fade-up slow'></span>
</div>
<div class="text-style">
<h3>Ambición ética:</h3>
<p>Una aptitud innata que implica una fuerte motivación y deseo de lograr metas y
superar desafíos ambiciosos de manera individual, pero manteniendo un enfoque en la
responsabilidad social y la ética.</p>
</div>
</li>
</ul>
</article>
</section>
<section id="features">
<article class="container-features">
<header class="header-features">
<h2>Sugerimos la continua formación de nuestros talentos, aún así ofrecemos 3 variantes:</h2>
</header>
<div class="boxes-features">
<div class="box" id="junior_fundamental">
<h4>Junior Fundamental</h4>
<p class="price">
<spam class='bx bxs-coin-stack bx-tada coin'></spam>
<spam class='bx bxs-coin-stack bx-tada coin'></spam><span
class='bx bxs-coin-stack bx-tada coin'></span> €
</p>
<div class="skills-1column">
<ul>
<li>Skills comunes</li>
<li>Exp. util. IA</li>
<li>C.I. > 130</li>
<li>HTML</li>
<li>CSS</li>
<li>GIT</li>
<li>GitHub</li>
<li>JavaScript</li>
</ul>
</div>
<p class="required">No requeriremos conocimientos adicionales, únicamente le enseñaremos
nuestros métodos de trabajo.
<br><span class="Ggt">Ggt</span> continuará con su formación extralaboralmente.
</p>
<!-- <audio id="sound1" src="./assets/001-sound-nav.mp3"></audio> -->
<a href="https://www.linkedin.com/in/joaquin-martinez-cortes/" target="_blank" rel="noopener" rel="noreferrer">SELECCIÓN</a>
<!-- document.getElementById('sound1').playbackRate = 2.0; // doble velocidad -->
</div>
<div class="box" id="junior_asistido">
<h4>Junior Asistido</h4>
<p class="price">
<spam class='bx bxs-coin-stack bx-tada coin'></spam>
<spam class='bx bxs-coin-stack bx-tada coin'></spam> €
</p>
<div class="skills-2columns">
<ul>
<li>Skills comunes</li>
<li>Exper. util. IA</li>
<li>C.I. > 130</li>
</ul>
<ul>
<li>HTML / CSS</li>
<li>JavaScript</li>
<li>Git / GitHub</li>
</ul>
</div>
<p class="required promise">Compromiso en continuar formando al activo en habilidades
técnicas, áreas de conocimiento y tecnologías actuales.</p>
<div class="skills-2columns">
<ul>
<li class="not">Angular/React/Vue</li>
<li>Machine Learning</li>
<li>Design UX/UI</li>
<li>TypeScript</li>
<li>Next JS</li>
</ul>
<ul>
<li class="not">Vite</li>
<li>qwik</li>
<li>Svelte</li>
<li>Node JS</li>
<li>SQL / MySql</li>
</ul>
</div>
<!-- <audio id="m" src="./assets/001-sound-nav.mp3"></audio> -->
<a href="https://www.linkedin.com/in/joaquin-martinez-cortes/" target="_blank" rel="noopener"
rel="noreferrer">SELECCIÓN</a>
<!-- <button onclick="document.getElementById('m').play()">SELECCIÓN</button> -->
</div>
<div class="box" id="junior_liberado">
<h4>Junior Liberado</h4>
<p class="price">
<spam class='bx bxs-coin-stack bx-tada coin'></spam>
<spam class='bx bxs-coin-stack bx-tada coin'></spam>
<spam class='bx bxs-coin-stack bx-tada coin'></spam>
<spam class='bx bxs-coin-stack bx-tada coin'></spam>
<spam class='bx bxs-coin-stack bx-tada coin'></spam> €
</p>
<div class="skills-2columns">
<ul>
<li>Skills comunes</li>
<li>Experiencia util. IA</li>
<li>Alto C.I. > 135</li>
</ul>
<ul>
<li>HTML / CSS</li>
<li>JavaScript</li>
<li>Git / GitHub</li>
</ul>
</div>
<p class="required directed">Esta variante establece al activo adquirir los conocimientos
necesarios, dirigidos a las necesidades de la empresa a la que en adelante, prestará sus
servicios.</p>
<div class="skills-1column">
<ul>
<li class="not">BackEnd</li>
<li>FrontEnd</li>
<li>Full Stack</li>
<li>Cyber Security ...</li>
</ul>
</div>
<!-- <audio id="m" src="./assets/001-sound-nav.mp3" ></audio> -->
<a href="https://www.linkedin.com/in/joaquin-martinez-cortes/" target="_blank" rel="noopener"
rel="noreferrer">SELECCIÓN</a>
<!-- <button onclick="document.getElementById('m').play()">SELECCIÓN</button> -->
</div>
</div>
</article>
</section>
<section id="contact">
<article class="container-contact">
<div class="slogan">
<p class="">Todo tiene un comienzo<br>
Guía el camino de tu Gold talent</p>
<div class="social_media">
<a href="https://www.linkedin.com/in/joaquin-martinez-cortes/" target="_blank" rel="noopener" rel="noreferrer"><span
class='bx bxl-linkedin-square socialmedia pincha'></span></a>
<a href=""><span class='bx bxl-github socialmedia'></span></a>
<a href=""><span class='bx bxl-twitter socialmedia'></span></a>
<a href=""><span class='bx bxl-youtube socialmedia'></span></a>
<a href=""><span class='bx bxl-instagram-alt socialmedia'></span></a>
<a href=""><span class='bx bxl-gmail socialmedia'></span></a>
</div>
</div>
<div class="giroBrillo">
<form action="https://www.freecodecamp.com/email-submit" id="form">
<h2>Solicitar <br><span class="Ggt-2">Gold talent</span></h2>
<div class="box-input_label">
<input type="text" id="name" name="name" placeholder="name / nick" required>
<label for="name">Name</label>
<span class='bx bxs-user name-ico'></span>
</div>
<div class="box-input_label">
<input type="email" id="email" name="email" placeholder="email" required>
<label for="email">Email</label>
<span class='bx bxs-envelope email-ico'></span>
</div>
<input type="submit" id="submit" value="Enviar" class="btn-enviar">
</form>
</div>
</article>
</section>
</main>
<footer id="footer">
<div class="contact">
<a href="https://conancos.dev/portfolio">conancos.dev</a>
</div>
<div class="redes-sociales">
<i class="RRSS1"> made</i>
<i class="RRSS2"> with</i>
<i class="RRSS3"> love</i>
<i class="RRSS3"> in 2023</i>
</div>
</footer>
</body>
</html>