-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
159 lines (148 loc) · 6.02 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Mi CV</title>
<link rel="stylesheet" href="reset.css" />
<link rel="stylesheet" href="./css/estilos.css" />
</head>
<body>
<div class="layout">
<aside class="layout__aside">
<section class="aside__user-info">
<!-- Información General del Usuario -->
<div class="user-info__general">
<div class="user-info__container-image">
<img
src="img/profile-image.jpg"
alt="Foto de perfil de pedro"
width="300px"
class="user-info__image"
/>
</div>
<h2 class="user-info__name">Pedro de Jesús Bernabé Maya</h2>
<h4 class="user-info__job">
Estudiante de Ingeniería en Computación y Sistemas
</h4>
</div>
<nav class="layout__menu">
<ul class="menu__list">
<li class="menu__option">
<a href="" class="menu__link">
<i class="fa-solid fa-envelope"></i>
</a>
</li>
<li class="menu__option">
<a href="" class="menu__link">
<i class="fa-brands fa-github"></i>
</a>
</li>
<li class="menu__option">
<a href="" class="menu__link">
<i class="fa-brands fa-linkedin"></i>
</a>
</li>
</ul>
</nav>
<nav class="layout__list">
<ul class="list__personal-data">
<li class="list__item">
<i class="fa-solid fa-cake-candles list__icon"></i>
<p>26/12/1999</p>
</li>
<li class="list__item">
<i class="fa-solid fa-phone list__icon"></i>
<p>7471092251</p>
</li>
<li class="list__item">
<i class="fa-solid fa-location-dot list__icon"></i>
<p>Puebla, Pue</p>
</li>
</ul>
</nav>
</section>
<!--Fin User Info-->
</aside>
<main class="layout__content">
<!-- Sección Perfil -->
<section class="layout__section">
<h2 class="section__name">Perfil</h2>
<div class="section__profile">
<p class="profile__description">
Entusiasta de la tecnología y los datos, con un gran interes por el desarrollo web. Tengo poca experiencia en el campo, pero con gran interés por aprender cosas nuevas y trabajar.
</p>
</div>
</section>
<!-- Sección Educación -->
<section class="layout__section">
<h2 class="section__name">Educación</h2>
<div class="section__education">
<table class="education__table">
<tr>
<th class="table__heading">Años</th>
<th class="table__heading">Institución</th>
</tr>
<tr>
<td class="table__data">agosto/2015 - julio/2018</td>
<td class="table__data">Bachillerato <span class="table__data--block">Centro Escolar Chilpancingo</span></td>
</tr>
<tr>
<td class="table__data">agosto/2018 - actualidad</td>
<td class="table__data">Licenciatura en Ingeniería en Computación y Sistemas <span class="table__data--block">Universidad Popular Autonoma del Estado de Puebla (UPAEP)</span></td>
</tr>
</table>
</div>
</section>
<!-- Sección Proyectos -->
<section class="layout__section">
<h2 class="section__name">Proyectos</h2>
<div class="section__projects">
<div class="projects__data">
<p class="projects__name">
Mantenimiento de Edificios D y E (UPAEP)
</p>
<p class="projects__description">Desarrollo de un sistema web para el control de inventario en los edificios E y D de la Universidad Popular Autonoma del Estado de Puebla</p>
<a href="https://proydweb.com/proyectos/2022/cuc/index.php" class="projects__link">Link al proyecto</a>
</div>
<div class="projects__data">
<p class="projects__name">
Encuesta Web
</p>
<p class="projects__role">Rol: <em>Frontend Developer</em></p>
<p class="projects__description">Desarrollo de una página web para encuestar a vendedores en la ciudad de Puebla y almacenar su ubicación, mostrandola en un mapa de la ciudad.</p>
</div>
</div>
</section>
<!-- Sección Habilidades -->
<section class="layout__section">
<h2 class="section__name">Habilidades</h2>
<div class="section__skills">
<ul class="skills__menu">
<li class="skills__item">Trabajo en equipo</li>
<li class="skills__item">HTML</li>
<li class="skills__item">CSS</li>
<li class="skills__item">JavaScript</li>
<li class="skills__item">Bases de Datos</li>
<li class="skills__item">SQL</li>
</ul>
</div>
</section>
<!-- Sección Idiomas -->
<section class="layout__section">
<h2 class="section__name">Idiomas</h2>
<div class="section__languages">
<ul class="languages__menu">
<li class="language__item">Español (nativo)</li>
<li class="language__item">Inglés</li>
</ul>
</div>
</section>
</main>
</div>
<script
src="https://kit.fontawesome.com/88bce5dbef.js"
crossorigin="anonymous"
></script>
</body>
</html>