-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
160 lines (156 loc) · 5.83 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
<!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" />
<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=Poppins:wght@300;400;600;700&display=swap"
rel="stylesheet"
/>
<link rel="icon" type="image/png" sizes="32x32" href="./img/favicon-32x32.png">
<link rel="stylesheet" href="./styles/style.css" />
<title>Seirama</title>
</head>
<body class="container">
<nav class="nav">
<a class="nav__logo" href="#"><img src="./img/Logo.png" alt="Logo Seirama" class="nav__logo-img"></a>
<ul class="nav__list">
<li class="nav__item"><a href="#" class="nav__link">Contribute</a></li>
<li class="nav__item"><a href="#" class="nav__link">Info</a></li>
<li class="nav__item"><a href="#" class="nav__link">About</a></li>
<li class="nav__item"><a href="#" class="nav__link">Article</a></li>
</ul>
<a href="index.html" class="nav__button--desktop btn btn--blue">Chat Bot</a>
</nav>
<div class="nav__button--mobile">
<a href="#" class="btn btn--blue">Chat Bot</a>
</div>
<header class="header">
<div class="header__text-box">
<hi class="heading-1">
<span class="heading-1__first">
<span class="heading-1--blue">Bangkit</span>
<span class="heading-1--yellow">Bersama</span>
</span>
<span class="heading-1__second">& Lawan Virus Corona</span>
</hi>
<p>
Bangkit bersama tuntaskan Covid 19 dengan berbagi informasi seputar
fasilitas Kesehatan, ICU, Oksigen untuk yang membutuhkan.
</p>
<a href="./info.html" class="btn btn--blue">Dapatkan Informasi</a>
</div>
<div class="header__illustration">
<img
src="./img/cherry-vacation-during-covid-pandemic 1.png"
alt="Illustration Covid Vacation"
class="header__img"
/>
</div>
</header>
<main class="main">
<section class="section-covid-info">
<h2 class="heading-2">Informasi COVID-19</h2>
<p class="covid-info__text">
Informasi seputar ketersedian ICU, Oksigen, Vaksis, dan Donor Darah
bagi pasien Covid-19.
</p>
<div class="covid-info__information">
<figure class="covid-info__img">
<img
src="./img/cherry-432 1.png"
alt="Doctor Illustration"
/>
</figure>
<div class="covid-info__icon-item">
<div class="covid-info__icon-box">
<img
src="./img/Icon ICU.png"
alt="Icon ICU"
class="covid-info__icon"
/>
<h4 class="heading-4">Info ICU</h4>
</div>
<div class="covid-info__icon-box">
<img
src="./img/Icon Oxygen.png"
alt="Icon Oksigen"
class="covid-info__icon"
/>
<h4 class="heading-4">Info Oksigen</h4>
</div>
<div class="covid-info__icon-box">
<img
src="./img/Info Vaksin.png"
alt="Icon Vaksin"
class="covid-info__icon"
/>
<h4 class="heading-4">Info Vaksin</h4>
</div>
<div class="covid-info__icon-box">
<img
src="./img/Icon Info Donor.png"
alt="Icon Donor"
class="covid-info__icon"
/>
<h4 class="heading-4">Info Donor</h4>
</div>
</div>
<figure class="covid-info__img">
<img
src="./img/clip-451.png"
alt="Doctor Illustration"
/>
</figure>
</div>
<p class="covid-info__text">
Bantu berbagi Informasi seputar Isi ulang Oksigen ketersedian ICU,
Donor darah dan Vaksin.
</p>
<a href="#" class="btn btn--yellow">Upload Informasi</a>
</section>
<section class="section-covid-about">
<div class="covid-about__illustration">
<img
src="./img/Corona Illustration.png"
alt="Virus Illustration"
class="covid-about__img"
/>
</div>
<div class="covid-about__text-box">
<h2 class="heading-2">Informasi Apa Yang Akan Didapatkan?</h2>
<div class="covid-about__list">
<div class="covid-about__number">1.</div>
<p class="covid-about__text">
Anda Mendapatkan Informasi Seputar ICU, Oksigen,
Vaksin, Donor darah bagi yang terpapar COVID-19
</p>
<div class="covid-about__number">2.</div>
<p class="covid-about__text">
Selain Website anda juga bisa menggunakan Chat-Bot untuk
mendapatkan Informasi seputar COVID-19.
</p>
<div class="covid-about__number">3.</div>
<p class="covid-about__text">
Kami juga mengajak teman - teman sekalian untuk saling bahu
membahu untuk ikut serta kontribusi Informasi seputar COVID-19
yang saat ini dibutuhkan.
</p>
</ul>
</div>
</section>
</main>
<footer class="footer">
<p class="footer__copyright">
Follow Us On Instagram :
<a href="https://www.instagram.com/seiramaofficial" class="footer__link" target="_blank">
@seirama
</a>
</p>
<p class="footer__copyright">© Seirama, Food Sharing Community</p>
</footer>
</body>
</html>