-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
125 lines (123 loc) · 5.4 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
<!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">
<meta name="description" content="Adriano Junior's personal web page with his known technologies and some projects.">
<title>Adriano Junior</title>
<script src="https://unpkg.com/@lottiefiles/lottie-player@latest/dist/lottie-player.js"></script>
<script src="https://kit.fontawesome.com/12a0a41501.js" crossorigin="anonymous"></script>
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<main>
<section class="introduction">
<h1 class="welcome">Welcome!</h1>
<h2 class="meet-text">Meet Adriano Junior</h2>
<figure>
<img src="images/profile.jpeg" alt="A photo of Adriano Junior" class="profile-picture">
</figure>
</section>
<section class="wave-section">
<svg class="upper-wave" width="1920" height="100" viewBox="0 0 1920 100" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M0 85.5023L107.2 76.5958C212.8 67.6893 427.2 49.8763 640 53.4389C852.8 57.0015 1067.2 81.9397 1280 92.6275C1492.8 103.315 1707.2 99.7527 1812.8 97.9714L1920 96.1901V0H1812.8C1707.2 0 1492.8 0 1280 0C1067.2 0 852.8 0 640 0C427.2 0 212.8 0 107.2 0H0V85.5023Z" fill="#006FE6"/>
</svg>
</section>
<section class="about-me">
<h2 class="section-title">About Me</h2>
<lottie-player src="https://assets5.lottiefiles.com/packages/lf20_sSF6EG.json" background="transparent" speed="1" style="width: 300px; height: 300px;" loop autoplay></lottie-player>
<p class="about-me-text">I’m a biomedical engineer student passionate about programming and with a huge desire to inovate and create new things.<br>Also, I'm interested in signal processing, medical devices and neuroengineering.</p>
</section>
<section class="known-technologies">
<h2 class="section-title">Known Technologies</h2>
<div class="card-group">
<div class="card">
<h3 class="card-title"><div id=”<span class="main-title">front-end</span>”...</h3>
<ul class="card-list">
<li>HTML</li>
<li>JavaScript</li>
<li>CSS</li>
<li>PHP</li>
<li>Bootstrap</li>
<li>JQuery</li>
</ul>
</div>
<div class="card">
<h3 class="card-title">class <span class="main-title">BackEnd</span> {...</h3>
<ul class="card-list">
<li>Java</li>
<li>Python</li>
<li>C#</li>
<li>C++</li>
<li>C</li>
<li>Ruby</li>
</ul>
</div>
<div class="card">
<h3 class="card-title">$ cat <span class="main-title">Others</span>.txt</h3>
<ul class="card-list">
<li>Android Studio</li>
<li>Unity3D</li>
<li>Arduino</li>
<li>MySQL</li>
<li>SASS</li>
<li>Git</li>
</ul>
</div>
</div>
</section>
<section class="projects">
<h2 class="section-title">Projects</h2>
<div class="project-left">
<figure>
<img src="images/SlidyPages.png" alt="A screenshot of the SlidyPage's website" class="project-image">
</figure>
<div class="project-description">
<h3 class="project-title">SlidyPages</h3>
<p class="project-description-text">
A script and css stylesheet that allows to create presentations like page with a vertical scroll. Like a PowerPoint Presentation with a vertical scroll, but on the web.
</p>
<a href="/SlidyPages" target="_blank" class="project-link">Check it out here</a>
</div>
</div>
<div class="project-right">
<figure>
<img src="images/CoisasQueAmoEmVoce.png" alt="A screenshot of the Coisas Que Amo em Voce's website" class="project-image">
</figure>
<div class="project-description">
<h3 class="project-title">“Coisas que Amo em Você”</h3>
<p class="project-description-text">
A website using nodejs that I made for my girlfiend that showed her every day a reason on why I love her. It was my first application using MongoDB.
</p>
<a href="https://coisasqueamoemvoce.herokuapp.com" target="_blank" class="project-link">Check it out here</a>
</div>
</div>
<div class="project-left">
<figure>
<img src="images/PersonalPageV2.png" alt="A screenshot of the second version of my personal website" class="project-image">
</figure>
<div class="project-description">
<h3 class="project-title">Personal Site v2</h3>
<p class="project-description-text">
My old personal webpage that used a custom script made by myself called SlidyPages.
</p>
<a href="/v2" target="_blank" class="project-link">Check it out here</a>
</div>
</div>
</section>
</main>
<section class="wave-section">
<svg class="bottom-wave" width="1920" height="100" viewBox="0 0 1920 100" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M1920 100V44.5406L1812.8 46.3765C1707.2 48.2124 1492.8 51.8842 1280 40.8688C1195.03 36.4702 1109.8 29.7299 1024.52 22.9855C896.233 12.8396 767.828 2.68449 640 0.478856C427.2 -3.19295 212.8 15.1661 107.2 24.3456L0 33.5251V100H1920Z" fill="#006FE6"/>
</svg>
</section>
<footer>
<div class="social-networks">
<a href="https://www.linkedin.com/in/adrianorsjr/" class="social-link"><i class="fa fa-linkedin"></i></a>
<a href="https://github.com/Adriano3ds" class="social-link"><i class="fa fa-github"></i></a>
<a href="https://twitter.com/Adriano_RSJR" class="social-link"><i class="fa fa-twitter"></i></a>
</div>
</footer>
</body>
</html>