-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
230 lines (193 loc) · 9.7 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Victória Duarte | Portfolio</title>
<link rel="stylesheet" href="styles/style.css">
<link rel="stylesheet" href="styles/reset.css">
<link rel="stylesheet" href="components/main-header.css">
<link rel="stylesheet" href="components/main-action.css">
<link rel="stylesheet" href="components/main-button.css">
<link rel="stylesheet" href="components/main-box.css">
<link rel="stylesheet" href="components/main-title.css">
<link rel="stylesheet" href="components/main-subtitle.css">
<link rel="stylesheet" href="components/main-banner.css">
<link rel="stylesheet" href="components/main-section.css">
<link rel="stylesheet" href="components/skill-tech.css">
<link rel="stylesheet" href="components/wrapper-skill.css">
<link rel="stylesheet" href="components/progress-bar.css">
<link rel="stylesheet" href="components/wrapper-project.css">
<link rel="stylesheet" href="components/card-project.css">
<link rel="stylesheet" href="components/main-photo.css">
<link rel="stylesheet" href="components/main-description.css">
<link rel="stylesheet" href="components/main-footer.css">
<link rel="stylesheet" href="components/main-form.css">
<link rel="stylesheet" href="components/main-label.css">
<link rel="stylesheet" href="components/main-input.css">
<link rel="stylesheet" href="components/icon-menu.css">
<link rel="stylesheet" href="components/icon-close.css">
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200" />
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
</head>
<body onresize="resize()">
<header id="header" class="main-header">
<img src="img/logo.png" alt="Victória Logo">
<a class="icon-menu" href="#menu">
<span class="material-symbols-outlined" onclick="openMenu()">menu</span>
</a>
<nav id="menu" class="menu">
<a onclick=" selectMainAction()" class="main-action" href="#skills">Skills</a>
<a onclick=" selectMainAction()" class="main-action" href="#projects">Projects</a>
<a onclick=" selectMainAction()" class="main-action" href="#about">About</a>
<a onclick=" selectMainAction()" class="main-action" href="#contact">Contact</a>
<a onclick=" selectMainAction()" class="main-button" href="Victória's Resume.pdf" download="Victória's Resume.pdf" type="application/pdf">Download CV</a>
<a class="icon-close">
<span class="material-symbols-outlined" onclick="closeMenu()">close</span>
</a>
</nav>
</header>
<section class="main-banner">
<div class="wrapper">
<div class="main-box">
<h1 class="main-title">Victória Duarte</h1>
<h2 class="main-subtitle">Software Test Developer</h2>
</div>
<div class="navigation">
<a class="main-button" href="Victória's Resume.pdf" download="Victória's Resume.pdf" type="application/pdf">Download CV</a>
<a class="main-button" href="#contact">Contact</a>
</div>
</div>
</section>
<section class="main-section" id="skills">
<h2 class="main-title -second">Skills</h2>
<div class="wrapper-skill">
<article class="skill-tech">
<img class="icon" src="img/icon-html.png" alt="HTML icon">
<div class="right">
<h3 class="title">HTML</h3>
<progress class="progress-bar" max="100" value="60">
60%
</progress>
</div>
</article>
<article class="skill-tech">
<img class="icon" src="img/icon-css.png" alt="CSS icon">
<div class="right">
<h3 class="title">CSS</h3>
<progress class="progress-bar" max="100" value="50">
50%
</progress>
</div>
</article>
<article class="skill-tech">
<img class="icon" src="img/icon-javascript.png" alt="JavaScript icon">
<div class="right">
<h3 class="title">JavaScript</h3>
<progress class="progress-bar" max="100" value="30">
30%
</progress>
</div>
</article>
<article class="skill-tech">
<img class="icon" src="img/icon-git.png" alt="Git icon">
<div class="right">
<h3 class="title">Git</h3>
<progress class="progress-bar" max="100" value="80">
80%
</progress>
</div>
</article>
<article class="skill-tech">
<img class="icon" src="img/icon-sql.png" alt="SQL icon">
<div class="right">
<h3 class="title">SQL</h3>
<progress class="progress-bar" max="100" value="60">
60%
</progress>
</div>
</article>
<article class="skill-tech">
<img class="icon" src="img/icon-software-testing.png" alt="Software Testing icon">
<div class="right">
<h3 class="title">Software Testing</h3>
<progress class="progress-bar" max="100" value="60">
60%
</progress>
</div>
</article>
<article class="skill-tech">
<img class="icon" src="img/icon-cypress.png" alt="Cypress icon">
<div class="right">
<h3 class="title">Cypress</h3>
<progress class="progress-bar" max="100" value="30">
30%
</progress>
</div>
</article>
<article class="skill-tech">
<img class="icon" src="img/icon-robot-framework.png" alt="Robot Framework icon">
<div class="right">
<h3 class="title">Robot Framework</h3>
<progress class="progress-bar" max="100" value="80">
80%
</progress>
</div>
</article>
</div>
</section>
<section class="main-section -bgBlackSecond -bdFirst" id="projects">
<h2 class="main-title -second">Projects</h2>
<div class="wrapper-project">
<article class="card-project">
<a class="project" href="https://github.com/victoriaduarte" target="_blank">
<img class="cover" src="img/project-portfolio.png" alt="Logo of Portfolio">
</a>
</article>
<article class="card-project">
<a class="project" href="https://github.com/victoriaduarte/robot-framework-basics" target="_blank">
<img class="cover" src="img/project-robot.png" alt="Robot Framework image">
</a>
</article>
<article class="card-project">
<a class="project" href="https://github.com/victoriaduarte/serverest-api-testing" target="_blank">
<img class="cover" src="img/project-serverest.png" alt="Logo of ServerRest">
</a>
</article>
</div>
</section>
<section class="main-section -bgBlack -bdSecond" id="about">
<h2 class="main-title -second">About</h2>
<div class="main-photo">
<img src="img/photo.jpeg" alt="Victória's photo">
</div>
<p class="description">
Hello! My name is Victória, I'm 27 years old and I work as a Software Test Developer for 5 years. I have experience in writing test cases, reporting bugs, executing manual tests and developing automated tests. I'm an organized person with attention to detail and empathy. Working in a team, I love to write documentation to keep things organized and to share knowledge. I am currently studying HTML, CSS and JavaScript to learn more about software development and to improve my skills in test automation. Furthermore, I'm also studying and practicing English to improve my communication skills.
</p>
</section>
<section class="main-section -bdBlack" id="contact">
<h2 class="main-title -second">Contact</h2>
<form class="main-form">
<label class="main-label" for="iname">Name</label>
<input class="main-input" type="text" name="name" id="iname" required>
<label class="main-label" for="iemail">Email</label>
<input class="main-input" type="email" name="email" id="iemail" required>
<label class="main-label" for="imessage">Message</label>
<textarea class="main-input -textarea" name="message" id="imessage" cols="0" required></textarea>
<input class="main-button -bgSecond -full" type="submit" value="Send Message">
</form>
</section>
<footer class="main-footer">
<a href="https://www.linkedin.com/in/victoria-regina-duarte/" target="_blank">
<img src="img/icon-linkedin.png" alt="Linkedin logo">
</a>
<a href="https://github.com/victoriaduarte" target="_blank">
<img src="img/icon-github.png" alt="Github logo">
</a>
</footer>
<a id="page-top" href="#header">
<img src="img/up-arrow.png" alt="">
</a>
<script src="scripts/menu.js"></script>
</body>
</html>