-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
133 lines (130 loc) · 6.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
126
127
128
129
130
131
132
133
<!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="Author: Fernando Silva, School: Microverse, Project: Capstone Project - Module 1"
/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css" />
<script src="https://kit.fontawesome.com/4f02d055e5.js" crossorigin="anonymous"></script>
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<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=Lato&display=swap" rel="stylesheet">
<link href="http://fonts.cdnfonts.com/css/cocogoose" rel="stylesheet">
<link rel="stylesheet" href="css/style.css" />
<title>São Paulo Web Dev Week 2022!</title>
</head>
<body>
<div class="my-top-nav">
<ul class="my-top-nav-items">
<li class="my-top-nav-item"><i class="my-top-nav-link fab fa-facebook-f"></i></li>
<li class="my-top-nav-item"><i class="my-top-nav-link fab fa-twitter"></i></li>
<li class="my-top-nav-item"><a class="my-top-nav-link">English</a></li>
<li class="my-top-nav-item"><a class="my-top-nav-link">Logout</a></li>
</ul>
</div>
<header class="my-header">
<button class="my-menu-btn" type="button">
<i class="fas fa-bars"></i>
</button>
<a href="index.html"><img class="my-logo" src="/images/anhembi-logo.svg" alt="logo Anhembi Parque" /></a>
<nav class="my-nav-menu">
<!-- <i class="fa fa-times close-btn"></i> -->
<ul class="my-nav">
<li class="my-nav-item"><a href="about.html" class="my-nav-link">About</a></li>
<li class="my-nav-item"><a href="#main" class="my-nav-link">Program</a></li>
<li class="my-nav-item"><a href="#speakers" class="my-nav-link">Speakers</a></li>
<li class="my-nav-item"><a href="about.html" class="my-nav-link">Contact Us</a></li>
</ul>
</nav>
<nav class="my-nav-menu-mobile">
<i class="fa fa-times my-close-btn"></i>
<ul class="my-nav-mobile">
<li class="my-nav-item-mobile"><a href="about.html" class="my-nav-link-mobile">About</a></li>
<li class="my-nav-item-mobile"><a href="#main" class="my-nav-link-mobile">Program</a></li>
<li class="my-nav-item-mobile"><a href="#speakers" class="my-nav-link-mobile">Speakers</a></li>
<li class="my-nav-item-mobile"><a href="about.html" class="my-nav-link-mobile">Contact Us</a></li>
</ul>
</nav>
</header>
<main class="my-main">
<!-- headline section -->
<section id="my-headline" class="my-headline">
<div class="my-headline-container">
<p class="my-hello">Hello Developers!</p>
<div class="my-headline-header-container">
<h1 class="my-headline-header">SÃO PAULO<br>WEB DEV WEEK<br>2022</h1>
</div>
<p class="my-headline-description">Meet developers from all over the
world and reach the ultimate level of knowledge and innovation in web development.</p>
<h2 class="my-headline-date">2022.02.27(THU) ~ 28(FRI)</h2>
<p class="my-headline-place">@ Anhembi Convention Palace, São Paulo</p>
</div>
</section>
<!-- program section -->
<section id="my-main" class="my-main-section">
<h2 class="my-main-header">Main Program</h2>
<hr />
<div class="my-main-section-program">
<article class="my-main-program-act">
<i class="fas fa-chalkboard fa-3x"></i>
<h3 class="my-program-act">Lecture</h3>
<p class="my-program-act-description">Listen to the speakers from various countries about the messages of sharing and opening.</p>
</article>
<article class="my-main-program-act">
<i class="fas fa-users fa-3x"></i>
<h3 class="my-program-act">Exhibition</h3>
<p class="my-program-act-description">Appreciate various creations expositors about the latest technology anouncements.</p>
</article>
<article class="my-main-program-act">
<i class="fas fa-bullhorn fa-3x"></i>
<h3 class="my-program-act">Forum</h3>
<p class="my-program-act-description">Have the time to listen and share your thought and opinions with experts for each topic.</p>
</article>
<article class="my-main-program-act">
<i class="fa fa-microphone"></i>
<h3 class="my-program-act">Workshop</h3>
<p class="my-program-act-description">Try creating your own work using open source license rather than just watching at it.</p>
</article>
<article class="my-main-program-act">
<i class="fa fa-grav fa-3x"></i>
<h3 class="my-program-act">Ignite</h3>
<p class="my-program-act-description">Get opportunities to network with developers around the world, also after the summit.</p>
</article>
</div>
<button type="button" class="my-main-program-btn">Join The Web Week Dev!</button>
</section>
<!-- speakers section -->
<section id="speakers" class="my-speakers-section">
<h2 class="my-speakers-header">Speakers</h2>
<hr />
<div class="my-speakers-group"></div>
</section>
</main>
<footer id="my-footer">
<!-- partners section -->
<section class="my-partners">
<h2 class="my-partners-header">Partners</h2>
<hr />
<div class="my-partners-logos">
<img class="my-partner-logo" src="/images/mozilla.png" alt="partner-logo" />
<img class="my-partner-logo" src="/images/airbnb.png" alt="partner-logo" />
<img class="my-partner-logo" src="/images/Google.png" alt="partner-logo" />
</div>
</section>
<!-- footer -->
<section class="my-footer">
<img class="my-footer-logo" src="/images/anhembi-logo.svg" alt="logo" />
<p class="my-footer-text">
2022, Anhembi Convention Palace<br />
©All Rights Reserved
</p>
</section>
</footer>
<script src="scripts/scripts.js"></script>
</body>
</html>