-
Notifications
You must be signed in to change notification settings - Fork 0
/
about.html
218 lines (209 loc) · 9.47 KB
/
about.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
<!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>About me</title>
<link rel="stylesheet" href="./assets/css/index.css" />
</head>
<body>
<header class="header">
<div class="container-lg">
<nav class="navbar">
<input type="checkbox" name="menu" id="menu" style="display: none" />
<div class="navbar__header">
<a href="./index.html" class="header__logo text-decoration-none">
<h1 class="head-md semibold">Bruno Saenz</h1>
</a>
<label for="menu" class="button__menu">
<div></div>
<div></div>
<div></div>
</label>
</div>
<ul class="navbar__links list-style-none">
<li>
<a href="./article.html" class="link text semibold">Articles</a>
</li>
<li>
<a href="./portafolio.html" class="link text semibold"
>Portafolio</a
>
</li>
<li>
<a href="./about.html" class="link text semibold">About</a>
</li>
<li>
<a
href="./contact.html"
class="button button--primary button--sm text text-decoration-none"
>
Contact Me
</a>
</li>
</ul>
</nav>
</div>
</header>
<section class="py-3 bg-primary-darker text-white">
<div class="container-lg">
<h2 class="head-xl regular mb-1">
Hi I'm
<strong class="semibold text-primary-regular">Bruno Saenz</strong>,
full stack developer looking for new adventures
</h2>
<p class="text-xl light">
Full-Stack Web Developer Junior with experience in customer service
for previous jobs. Passionate about technology, resolution of
problems and other challenges that programming requires. Pointing at the
results, people, service and personal growth and
professional. Motivated to work with an outstanding team, and
complement them with my skills related to communication
assertive and effective
</p>
</div>
</section>
<main class="section-md">
<div class="container-lg">
<div class="article-summary__header">
<h2 class="head-lg semibold">My Skills</h2>
</div>
<div class="article-summary__content">
<div class="article-summary__card">
<h3 class="head-md regular my-0.5">
<img
class="h3__icon"
src="./assets/images/Icon.png"
alt="icon"
/>Ruby
</h3>
<p class="text-lg light my-0.5" style="margin-left: 47px">
Ruby is a powerful and versatile tool that allows me to develop high-quality web applications quickly and efficiently. Ruby has an elegant and easy-to-read syntax, which makes it very attractive to developers. Also, the Ruby developer community is very active and friendly, which makes it easy to find help and resources online to improve my skills and develop more complex projects.
</p>
</div>
<div class="article-summary__card">
<h3 class="head-md regular my-0.5">
<img
class="h3__icon"
src="./assets/images/Icon.png"
alt="icon"
/>Ruby on Rails
</h3>
<p class="text-lg light my-0.5" style="margin-left: 47px">
Web framework that allows me to develop applications quickly and efficiently thanks to its MVC structure and its wide collection of libraries and tools. Ruby on Rails has a relatively low learning curve and enables the creation of high-quality, scalable web applications in a short time. Additionally, Ruby on Rails has a large developer community and extensive online documentation, which makes it easy to troubleshoot and improve my developer skills.
</p>
</div>
<div class="article-summary__card">
<h3 class="head-md regular my-0.5">
<img
class="h3__icon"
src="./assets/images/Icon.png"
alt="icon"
/>JavaScript
</h3>
<p class="text-lg light my-0.5" style="margin-left: 47px">
JavaScript is an essential programming language for web development, as it allows you to create interactive and dynamic applications on the client side. In addition, it has a wide range of libraries and frameworks that facilitate the development of complex web applications.
</p>
</div>
<div class="article-summary__card">
<h3 class="head-md regular my-0.5">
<img
class="h3__icon"
src="./assets/images/Icon.png"
alt="icon"
/>React
</h3>
<p class="text-lg light my-0.5" style="margin-left: 47px">
React is a highly efficient, scalable, and modular JavaScript library for building user interfaces. It uses a component-based approach that allows for code reuse and is widely used for modern web application development. It has a large number of online resources and a large community of developers that contribute to its constant growth.
</p>
</div>
<div class="article-summary__card">
<h3 class="head-md regular my-0.5">
<img
class="h3__icon"
src="./assets/images/Icon.png"
alt="icon"
/>Git & Github
</h3>
<p class="text-lg light my-0.5" style="margin-left: 47px">
GitHub is an online platform for hosting and managing source code repositories. It is widely used by developers around the world to collaborate on open source and private projects, and has a wide range of tools and features to make development and project management easier.
</p>
</div>
<div class="article-summary__card">
<h3 class="head-md regular my-0.5">
<img
class="h3__icon"
src="./assets/images/Icon.png"
alt="icon"
/>Postgresql
</h3>
<p class="text-lg light my-0.5" style="margin-left: 47px">
PostgreSQL is a free, open source, highly scalable and reliable relational database management system with extensive features and advanced tools for web and enterprise applications.
</p>
</div>
</div>
</div>
</main>
<main class="section-md">
<div class="container-lg">
<div class="article-amenities__header">
<h2 class="head-lg semibold">My Hobbies</h2>
</div>
<div class="article-amenities__content">
<div>
<img
class="article__img"
src="https://cdn.shopify.com/s/files/1/1468/2844/products/IMG_3191_1024x1024.jpg?v=1657046786"
alt="Guitar epiphone G310"
/>
</div>
<div>
<h3 class="article-amenities__h3 head-md regular my-0.5">Music</h3>
<p class="article-amenities__p text-lg light my-0.5">
La música es una de tus pasiones y disfrutas escuchar una amplia variedad de géneros. Te gusta explorar nuevos artistas y canciones, y también te gusta tocar algún instrumento musical como la guitarra o el ukulele.
</p>
</div>
<div>
<img
class="article__img"
src="http://media.steampowered.com/apps/csgo/blog/images/fb_image.png?v=6"
alt="Video Game called Counter Strike"
/>
</div>
<div>
<h3 class="article-amenities__h3 head-md regular my-0.5">Games</h3>
<p class="article-amenities__p text-lg light my-0.5">
Los juegos, eres un apasionado de los videojuegos y disfrutas de diferentes géneros como los juegos de aventuras, estrategia y deportes. También te gusta jugar juegos de mesa con amigos y familiares para pasar un buen rato juntos.
</p>
</div>
<div>
<img
class="article__img"
src="https://www.adobe.com/es/express/create/photo-collage/media_1e44e705240fd0a4f2c4f446c3a98ae75d9dd4ad5.png?width=750&format=png&optimize=medium"
alt="Sports"
/>
</div>
<div>
<h3 class="article-amenities__h3 head-md regular my-0.5">Sports</h3>
<p class="article-amenities__p text-lg light my-0.5">
El deporte es una parte importante de tu vida y te gusta mantener un estilo de vida activo. Disfrutas de deportes como el fútbol, el baloncesto o el tenis, y también te gusta correr y hacer ejercicio en el gimnasio para mantenerte en forma.
</p>
</div>
</div>
</div>
</main>
<footer>
<div class="container-md footer__content">
<h2 class="head-xl semibold">Can I help you?</h2>
<a href="./contact.html" class="text-decoration-none">
<button
class="button button--lg button--primary button--footer text-lg text-primary-darker text-decoration-none"
>
get in touch!
</button>
</a>
</div>
</footer>
</body>
</html>