-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
89 lines (89 loc) · 5.61 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
<!DOCTYPE html>
<html>
<head>
<title>Vitor A.</title>
<link rel="icon" type="image/x-icon" href="./res/images/v-icon.png">
<link rel="stylesheet" href="./res/reset.css">
<link rel="stylesheet" href="./res/styles.css">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Source+Code+Pro&display=swap" rel="stylesheet">
<script src="./res/system.js"></script>
</head>
<body>
<header>
<h1>Vitor Augusto</h1>
<nav>
<i id="about-me-title"><a href="#about-me">Sobre Mim</a></i>
<i id="projects-title"><a href="#projects">Projetos</a></i>
<i id="skills-title"><a href="#skills">Habilidades</a></i>
<i id="contact-title"><a href="#footer">Contato</a></i>
</nav>
</header>
<main>
<section class="about-me" id="about-me">
<div class="about-me-text">
<h2 class="about-me-title">Sobre Mim</h2>
<p class="about-me-description">Em 2016 eu desenvolvi a curiosidade pela programação. A partir desta época, comecei a pesquisar e estudar por conta própria e aprendi
sobre o desenvolvimento de jogos, web, servidores e diversos outros tópicos que me chamavam a atenção. Em 2018, comecei a estudar para
vestibulares com o intuíto de passar em uma faculdade de medicina. Após 2 anos esse meu objetivo foi concluído, porém decidi seguir uma
área na qual eu tinha mais afinidade. Desse modo, eu comecei o curso de Engenharia Mecatrônica.</p>
<p class="about-me-description">Atualmente estou qualificando minhas habilidades em um curso de Engenharia de Software do exterior para me inserir de vez no mercado de
programação. Durante estes anos, desenvolvi uma extrema facilidade em aprender qualquer tipo de conceito ou linguagem de programação.
Escrever códigos para mim é tão natural quanto ler um livro. </p>
</div>
<img id="profile-picture" src="./res/images/profile-picture.png"/>
</section>
<section class="projects" id="projects">
<h2 class="projects-title">Projetos</h2>
<section class="games">
<h3 class="game-development-title">Desenvolvimento de Jogos</h3>
<p class="game-development-description">O meu projeto mais recente foi voltado para os estudos de game design e ciência da computação. No projeto que eu denominei "Rise of The Dying Sun",
decidi criar um jogo em que um personagem silencioso explora um sistema solar vazio. Para isso, programei a física de atração gravitacional dos
planetas utilizando fórmulas e conceitos físicos reais. Este e outros projetos podem ser encontrados no meu GitHub. </p>
<div class="game-gifs">
<img class="game-gif" src="./res/gifs/game-gif-1.gif">
<img class="game-gif" src="./res/gifs/game-gif-2.gif">
<img class="game-gif" src="./res/gifs/game-gif-3.gif">
</div>
</section>
<section class="web-development">
<h3 class="web-development-title">Desenvolvimento Web</h3>
<p class="web-development-description">Atualmente estou estudando desenvolvimento web com o curso de engenharia de software da codecademy - situada em Nova Iorque. Um exemplo prático
destes estudos é esse e outros diversos sites que eu venho criando com o intuíto de aprendizado. Para o desenvolvimento, estou utilizando HTML,
CSS e Javascript. Junto disso, estou me familiarizando com diversas ferramentas do front-end e back-end.</p>
</section>
</section>
<section class="skills" id="skills">
<h2 class="skills-title">Habilidades</h2>
<section class="skill-icons">
<img class="skill-icon" src="./res/images/html-5.png">
<img class="skill-icon" src="./res/images/css-3.png">
<img class="skill-icon" src="./res/images/js.png">
<img class="skill-icon" src="./res/images/letra-c.png">
<img class="skill-icon" src="./res/images/do-sustenido.png">
</section>
</section>
</main>
<footer id="footer">
<div class="contact-site">
<img src="./res/images/linkedin.png">
<a href="https://www.linkedin.com/in/vitor-a-871326134/" target="blank">Linkedin</a>
</div>
<div class="contact-site">
<img src="./res/images/github.png">
<a href="https://github.com/vitor-a14" target="blank">Github</a>
</div>
<div class="contact-site">
<img src="./res/images/outlook.png">
<a href="https://outlook.live.com/mail/0/" target="blank">[email protected]</a>
</div>
</footer>
<div id="language">
<div id="flags">
<img onclick="SelectPortuguese()" id="portuguese" src="./res/images/brazil-flag.png">
<img onclick="SelectEnglish()" id="english" src="./res/images/united-kingdom-flag.png">
</div>
</div>
</body>
</html>