-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathindex.html
336 lines (301 loc) · 13.9 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
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta
name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"
/>
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>Bal Caritate - ASII</title>
<!-- To be imported as it is here if the deployment is changed from github pages -->
<link rel="stylesheet" href="./css/variables.css" />
<link rel="stylesheet" href="./css/common.css" />
<link rel="stylesheet" href="./css/helpers.css" />
<link rel="stylesheet" href="./css/header.css" />
<link rel="stylesheet" href="./css/about.css" />
<link rel="stylesheet" href="./css/intro.css" />
<link rel="stylesheet" href="./css/beneficiaries.css" />
<link rel="stylesheet" href="./css/other.css" />
<link rel="stylesheet" href="./css/slideshow.css" />
<link rel="stylesheet" href="./css/coordonatori.css" />
<link rel="stylesheet" href="./css/program.css" />
<link rel="stylesheet" href="./css/partners.css" />
<link rel="stylesheet" href="./css/footer.css" />
<link rel="stylesheet" href="./css/contact.css" />
</head>
<body>
<div id="acasa" class="screen-container">
<!-- Header -->
<!-- <image src="assets/svg/header.svg" /> -->
<header id="sticky">
<div class="row flex-wrap px-3 py-3 items-center justify-between">
<div class="header-flag">
<div class="header-logo-container row flex-wrap items-center justify-evenly">
<a href="https://www.asii.ro/" target="blank">
<img class="header-logo" src="assets/svg/asii.svg" />
</a>
<a href="https://www.info.uaic.ro/" target="blank">
<img class="header-logo" src="assets/svg/fii.svg" />
</a>
</div>
</div>
<div class="row flex-wrap uppercase">
<a class="px-3 py-3 link" href="#acasa">Acasă</a>
<a class="px-3 py-3 link" href="#about">Despre</a>
<a class="px-3 py-3 link" href="#beneficiaries">Beneficiari</a>
<a class="px-3 py-3 link" href="#program">Program</a>
</div>
</div>
</header>
<!-- Title Page -->
<div class="row intro-container centered-container ">
<div class="flex-1">
<div class="title">Crăciun din inimă de student</div>
<div class="description">
Te-ai uitat vreodată iarna pe cerul înstelat? Simți căldura pe care o transmit stelele prin lumina
lor ce te veghează în timp ce aștepți cu nerăbdare sărbătorile? Hai să ne imaginăm acum că în timp
ce te uiți la stele îți este frig și foame…parcă ai dori ca lumina aceea să fie mai caldă. Asociația
Studenților Informaticieni Ieșeni te invită să fii “The Spark of Hope” pentru persoanele ce au nevoie
de mai multă căldură în viața lor prin intermediul Ediției a 18-a a Balului de Caritate “Crăciun din inimă de student”.
Citește în continuare pentru a afla mai multe detalii!
</div>
</div>
<div class="flex-1">
<img class="intro-image" src="assets/images/intro.jpg" />
</div>
</div>
</div>
<!-- Despre -->
<div id="about" class="my-3">
<div id="about-top" class="">
<div id="about-top-title">Despre eveniment</div>
</div>
<div id="about-content" class="row">
<div id="about-content-description" class="row">
<div id="about-content-description-text">
<p class="blue-700-text">
Poate surpriza cea mai mare a ediției de anul acesta este aceea că, evenimentul va avea loc fizic,
în data de 17 decembrie 2021 la ora 18:00 la Centrul de Evenimente Agora. Așa cum v-am obișnuit,
seara va fi plină de evenimente muzicale, dans și voie bună și presărată cu suflete calde dornice de
a face bine. Prețul biletului este de 40 de lei și se va achiziționa de la intrare, de unde veți putea
pleca și cu un mic suvenir confecționat de voluntarii noștri muncitori în schimbul unei mici donații.
Orice sumă adițională va putea fi donată fie în seara evenimentului, ori în contul asociației. Ușa este
deschisă tuturor, de la mic la mare! Noi suntem bucuroși să împărtășim cu fiecare dintre voi, bucuria de a dărui.
</p>
</div>
<div id="about-content-description-imgwrap">
<img id="about-content-description-imgwrap-img" src="assets/images/copaci.png" alt="" />
</div>
</div>
<div id="about-content-details">
<div id="about-content-details-text">
<b class="bold-text">17 Decembrie, ora 18:00</b>
<p>
Pe parcursul evenimentului vei avea posibilitatea să contribui financiar printr-o donație în
contul ASII.
</p>
</div>
<div id="about-content-details-imgwrap">
<img
id="about-content-details-imgwrap-img"
src="assets/svg/about-details-illustrations.svg"
alt=""
/>
</div>
</div>
</div>
</div>
<!-- Beneficiari -->
<div id="beneficiaries" class="my-6">
<div id="beneficiaries-top">
<div id="beneficiaries-top-title">Beneficiar eveniment</div>
</div>
<div id="beneficiaries-content">
<div id="beneficiaries-content-description" class="py-6">
<div id="beneficiaries-content-description-imgwrap">
<img id="beneficiaries-content-description-imgwrap-img" src="assets/svg/mistletoe.svg" alt="" />
</div>
<p class="px-6 blue-200-text">
Ediția de anul acesta are ca scop ajutorarea familiilor și cazurilor speciale din împrejurul Iașului.
Din păcate, dintotdeauna norocul nu s-a împărțit egal printre oameni, cu atât mai mult cu cât situația
actuală este una ce lasă în urmă multe pagube și zile triste. Pentru mulți, garanția cinei nu există,
mulți copii nu știu bucuria de a desface cadourile sau de a fi ridicați de părinți pentru a pune steaua în vârf.
Noi credem în importanța gesturilor mici și credem că în fiecare dintre noi există o mică stea ce poate lumina
asupra aproapelui nostru. Nu e nevoie de sume mari sau cadouri scumpe, e nevoie de un gând bun, o mângâiere caldă
și o donație după posibilitățile fiecăruia, deoarece doar așa putem aduce de Crăciun, lumina în multe case în care
nu a mai fost de mult.
</p>
<div class="px-6 py-3">
<p id="beneficiaries-content-description-help" class="bold-text red-text pb-3">Poți ajuta si tu!</p>
<p class="blue-200-text">
Invitația noastră către tine de anul acesta este să ne ajuți să îi reamintim Moșului adresele
copiilor proveniți din medii defavorizate, din postura unui elf muncitor și darnic. Fiecare
copil merită să se bucure de inocența vârstei atât cât încă se poate!
</p>
</div>
<div id="beneficiaries-content-description-IBANwrap" class="white-text">
<h1 class="bold-text white-text">Cont IBAN</h1>
<p class="white-text">RO24BRDE240SV22901182400</p>
<p class="white-text">Asociatia Studentilor Informaticieni Ieseni</p>
</div>
</div>
<div id="beneficiaries-content-imgwrap">
<img id="beneficiaries-content-imgwrap-img" src="assets/svg/beneficiaries-background.svg" alt="" />
</div>
</div>
</div>
<!-- Other -->
<div id="other" class="my-6">
<div id="other-description">
<h1 class="my-3 white-text bold-text">Alte metode</h1>
<p class="white-text">
Dacă dorești să contribui cu bunuri greu perisabile, îmbrăcăminte, jucării, sau orice alt tip de
donație, acestea se vor strânge în seara evenimentului de către voluntarii prezenți.
</p>
</div>
<div id="other-counterWrapper" class="center">
<div id="other-counterWrapper-counter">
<div class="row centered-container justify-evenly blue-200-text bold-text">
<div class="red-line"></div>
<div>Concert colinde</div>
<div class="red-line"></div>
</div>
<div class="row centered-container justify-evenly blue-200-text">
<div>Zile</div>
<div>Ore</div>
<div>Minute</div>
</div>
<div class="row centered-container justify-evenly blue-200-text pt-3">
<div id="days-concert"></div>
<div id="hours-concert"></div>
<div id="minutes-concert"></div>
</div>
<div class="row centered-container blue-200-text pt-3">
<div id="final-concert"></div>
</div>
</div>
</div>
</div>
<!-- Slideshow -->
<div class="slideshow-title my-3 mx-3">Imagini din editiile anterioare</div>
<div class="slideshow-container" id="slideshow"></div>
<br />
<div id="dots" style="text-align: center"></div>
<!-- Program-->
<div id="program" class="relative">
<img src="assets/images/pozasitedesene2.png" class="program-image centered-container" />
<div class="program-content absolute">
<div class="rectangle centerXY">
<p class="program-text">
Te așteptăm pe <b>17 decembrie 2021, ora 18:00</b>
la Centrul de Evenimente Agora, care se afla pe
bis, Șos. Nicolina 115, Iași 707317.
</p>
</div>
</div>
</div>
<!-- Coordonatori-->
<div id="coordonatori" class="coordonatori">
<div class="coord-titlu">
<div class="centrare">
COORDONATORII EVENIMENTULUI
</div>
</div>
<div class="coord ">
<div class="centered-container column centerY">
<div class="centrare">
Ioana Raluca Nastasă
</div>
<div class="centrare">
0743347244
</div>
<div class="centrare">
</div>
</div>
</div>
<div class="coord">
<div class="centered-container column centerY">
<div class="centrare">
Maria Andreea Motoroiu
</div>
<div class="centrare">
0761040061
</div>
<div class="centrare">
</div>
</div>
</div>
</div>
<!-- Partners -->
<div class="partners-title py-3 white-text bold-text uppercase centered-text">Parteneri</div>
<div id="partners" class="centered-container flex-wrap"></div>
<!-- Footer -->
<div class="footer-container">
<div class="relative">
<div class="trees-dimensions flex trees-back centered-container">
<div class="blue-back"></div>
<div class="white-back"></div>
</div>
<div class="absolute trees-dimensions trees-cover">
<div class="flex trees centered-container"></div>
</div>
</div>
<div id="contact">
<h1 class="blue-200-text py-3">Contactează-ne completand formularul de mai jos </h1>
<div class="blue-200-text">
<div class="row" id="contact-name">
<div class="flex-1">
<label for="fname">Nume</label>
<input type="text" id="fname" name="firstname" placeholder="Popescu">
</div>
<div class="flex-1" id="lastName">
<label for="lname">Prenume</label>
<input type="text" id="lname" name="lastname" placeholder="Maria">
</div>
</div>
<label for="email">Email</label>
<input type="email" id="email" name="email" placeholder="[email protected]">
<label for="subject">Subiect</label>
<textarea id="subject" name="subject" placeholder="Mesaj..." style="height:200px"></textarea>
<input type="submit" value="Submit" onclick="submitForm()">
</div>
</div>
<div class="footer row items-center py-3">
<div class="px-3">
<img class="asii-icon" src="assets/svg/asii.svg" />
<div class="event-name">Crăciun din inimă de student</div>
</div>
<div class="flex-1 row justify-between flex-wrap info">
<div class="px-3 py-3">
<div class="title">Despre eveniment</div>
<div class="subtitile"><a href="#acasa" class="blue-200-text">Acasă</a></div>
<div class="subtitle"><a href="#about" class="blue-200-text">Balul de caritate</a></div>
</div>
<div class="px-3 py-3">
<div class="title">Beneficiar</div>
<div class="subtitle"><a href="#beneficiaries" class="blue-200-text">Povestea</a></div>
<div class="subtitle"><a href="#beneficiaries" class="blue-200-text">Donații</a></div>
</div>
<div class="px-3 py-3">
<div class="title">Contactează-ne</div>
<div class="subtitle"><a href="#coordonatori" class="blue-200-text">Coordonatori</a></div>
<div class="subtitle">
<a href="https://www.asii.ro/" target="blank" class="blue-200-text">ASII</a>
</div>
</div>
</div>
<a class="px-3" href="https://www.facebook.com/BaluldeCaritateASII/" target="blank">
<img class="facebook-icon" src="assets/images/facebook.png" />
</a>
</div>
</div>
</body>
<script src="./js/partners.js"></script>
<script src="./js/sticky.js"></script>
<script src="./js/slideshow.js"></script>
<script src="./js/contact.js"></script>
<script src="./js/countdown.js"></script>
</html>