-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
145 lines (130 loc) · 7.81 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
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/html">
<head>
<!-- Basic Page Needs
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
<meta charset="utf-8">
<title>Madalena Sousa</title>
<meta name="personal website" content="">
<meta name="madalena sousa" content="">
<!-- Mobile Specific Metas
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- FONT
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
<link href="https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap" rel="stylesheet">
<!-- CSS
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
<link rel="stylesheet" href="css/style.css">
<!-- Favicon
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
<link rel="icon" type="image/png" href="images/favicon.png">
<!-- Libraries
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
<script src="javascript/p5.min.js"></script>
<script src="javascript/starclass.js"></script>
<script src="javascript/stars.js"></script>
</head>
<body style="background-color: white">
<div class="landingpage-nav" style="background-color: #EBE2D3">
<div class="container">
<header>
<nav class="navBar">
<a class="logo" href="index.html">
<div><h3>madalena</h3></div>
<div><h3>sousa</h3></div>
</a>
<div class="nav-menu">
<div class="nav-content">
<a class="nav-item" href="portfolio.html">
<h2>my work</h2>
</a>
<a class="nav-item" href="about.html">
<h2>about</h2>
</a>
<a class="nav-item" href="contact.html">
<h2>let's talk</h2>
</a>
<a class="nav-item" href="https://www.etsy.com/shop/MadalenaSousa" target="_blank">
<h2>etsy shop</h2>
</a>
</div>
</div>
<div class="undermenu"></div>
<div class="hamburger">
<svg viewBox="0 0 19 42" xmlns="http://www.w3.org/2000/svg">
<path d="M19 9C18.4545 8.98346 14.8843 9.08272 11.7438 11.2335C10.0909 14.3768 9.99174 17.4044 10.0083 18C10.0413 17.4706 9.92562 14.2114 8.27273 11.068C5.28099 8.75184 1.5124 8.98346 1 9C1.59504 9.01654 5.1157 8.5864 7.76033 6.93199C9.90909 3.7886 10.0083 0.545956 9.99174 0C9.95868 0.512868 10.405 3.7886 12.0579 6.76654C15.3636 8.75184 18.4711 9.03309 19 9Z"/>
<path d="M18.8137 32.035C18.2661 32.0184 14.6818 32.1181 11.5289 34.2773C9.86947 37.4331 9.7699 40.4726 9.7865 41.0706C9.81968 40.5391 9.70353 37.267 8.04411 34.1112C5.04056 31.7859 1.25709 32.0184 0.742676 32.035C1.34007 32.0516 4.87462 31.6198 7.52969 29.9589C9.68693 26.8031 9.7865 23.5476 9.7699 22.9995C9.73671 23.5144 10.1848 26.8031 11.8442 29.7928C15.163 31.7859 18.2827 32.0683 18.8137 32.035Z"/>
</svg>
</div>
</nav>
</header>
</div>
</div>
<main>
<div class="landingpage-bg" style="background-color: #EBE2D3">
<div class="container">
<div class="landingpage-title revealOnLoad">
<h1>Hi there! I'm Madalena, and I'm a Multimedia Designer</h1>
</div>
<div>
<div id="canvasDiv"></div>
</div>
<div class="display-flex landingpage-links">
<div class="display-flex">
<a href="https://www.linkedin.com/in/madalena-sousa/" target="_blank">linkedin</a>
<a href="https://www.behance.net/madalena-sousa" target="_blank">behance</a>
<a href="https://github.com/MadalenaSousa" target="_blank">github</a>
</div>
<div>
<a href="mailto:madalenaantunessousa@gmail.com" target="_blank">send an email</a>
</div>
</div>
</div>
</div>
<div class="landingpage-bg" style="background-color: white">
<div class="container">
<div class="pageHeader display-flex reveal" style="margin-top: 0">
<div><h1>work</h1></div>
<div class="star-center">
<svg width="105" height="105" viewBox="0 0 105 105" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M105 52.5C101.818 52.4035 80.9917 52.9825 62.6722 65.5285C53.0303 83.8649 52.4518 101.526 52.5482 105C52.741 101.912 52.0661 82.8998 42.4242 64.5634C24.9725 51.0524 2.98898 52.4035 0 52.5C3.47107 52.5965 24.0083 50.0873 39.4353 40.4366C51.9697 22.1002 52.5482 3.18474 52.4518 0C52.259 2.99173 54.8623 22.1002 64.5041 39.4715C83.7879 51.0524 101.915 52.693 105 52.5Z" fill="black"/>
</svg>
</div>
<a href="portfolio.html"><div><h1>see all</h1></div></a>
</div>
<div class="works"></div>
</div>
</div>
<div class="landingpage-bg" style="background-color: black">
<div class="container">
<div class="display-flex contact-links reveal">
<div>
<h1 style="color: white">let's talk</h1>
<a href="mailto:madalenaantunessousa@gmail.com" target="_blank"><div><h4>send an email</h4></div></a>
</div>
<div class="star-center">
<svg width="105" height="105" viewBox="0 0 105 105" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M105 52.5C101.818 52.4035 80.9917 52.9825 62.6722 65.5285C53.0303 83.8649 52.4518 101.526 52.5482 105C52.741 101.912 52.0661 82.8998 42.4242 64.5634C24.9725 51.0524 2.98898 52.4035 0 52.5C3.47107 52.5965 24.0083 50.0873 39.4353 40.4366C51.9697 22.1002 52.5482 3.18474 52.4518 0C52.259 2.99173 54.8623 22.1002 64.5041 39.4715C83.7879 51.0524 101.915 52.693 105 52.5Z" fill="white"/>
</svg>
</div>
</div>
<div class="display-flex contact-links reveal">
<div>
<h1 style="color: white">check out</h1>
<a href="linkedin.com/in/madalena-sousa" target="_blank"><div><h4>linkedin</h4></div></a>
<a href="behance.net/madalena-sousa" target="_blank"><div><h4>behance</h4></div></a>
<a href="github.com/MadalenaSousa" target="_blank"><div><h4>github</h4></div></a>
</div>
</div>
</div>
</div>
</main>
<!-- Scripts
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
<script src="javascript/main.js" type="module"></script>
<script src="javascript/landingpage.js" type="module"></script>
<!-- End Document
–––––––––––––––––––––––––––––––––––––––––––––––––– -->
</body>
</html>