-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
402 lines (375 loc) · 20.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
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="">
<title>Birge</title>
<!-- Google Fonts -->
<link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;700;900&family=Ubuntu:wght@700&display=swap"
rel="stylesheet">
<!-- Font Awesome -->
<script defer src="https://use.fontawesome.com/releases/v6.2.0/js/all.js"></script>
<!-- CSS Stylesheets -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-gH2yIJqKdNHPEq0n4Mqa/HGKIhSkIHeL5AyhkYV8i59U5AR6csBvApHHNl/vI1Bx" crossorigin="anonymous">
<link href="css/styles.css" rel="stylesheet">
<link rel="icon" href="img/favicon.ico">
</head>
<body>
<!-- Navigation -->
<nav class="navbar navbar-expand-lg navbar-dark bg-dark sticky-top" id="mainNav">
<div class="container">
<a class="navbar-brand" href="/index.html">Birge</a>
<button class="navbar-toggler navbar-toggler-right" type="button" data-bs-toggle="collapse"
data-bs-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false"
aria-label="Toggle navigation">
Menu
<i class="fas fa-bars"></i>
</button>
<div class="collapse navbar-collapse" id="navbarResponsive">
<ul class="navbar-nav ms-auto">
<li class="nav-item">
<a class="nav-link" href="#about">Обо мне</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#team">Наша команда</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#features">Особенности</a>
</li>
<li class="nav-item dropdown">
<a href="#" class="nav-link dropdown-toggle" role="button" data-bs-toggle="dropdown" aria-expanded="false">
Ещё
</a>
<ul class="dropdown-menu">
<li><a class="dropdown-item" href="resume.pdf">Резюме</a>
</li>
<li><a class="dropdown-item" href="presentation.pdf">Презентация</a>
</li>
<li>
<hr class="dropdown-divider ">
</li>
<li><a class="dropdown-item" data-bs-toggle="modal" data-bs-target="#info">Связаться</a>
</li>
</ul>
</li>
</ul>
</div>
</div>
</nav>
<section class="colored-section" id="title">
<!-- Title -->
<div class="container-fluid">
<div class="row">
<div class="col-lg-6">
<h1 class="big-heading">ӨЗБЕХАН ЖАЛҒАС</h1>
<h5>— bizben birge bol 💜🧡</h5>
<div class="zhalgas">
<p class="small">
Привет! Меня зовут Жалгас и я баллотируюсь на пост президента школы.</h6>
<p class="small">
Я являюсь членом студенческого совета нашей школы 2 года и состою в самоуправлении общежития с 7-класса!
</p>
<p class="small">
За весь этот период я не только набрался опыта в организации масштабных мероприятий, а также вырос как
лидер, готовый к решению любых проблем.
</p>
<table class="table">
<tr>
<td>
<p class="small">• За 2 года в студенческом совете я участвовал в организации таких мероприятий,
как:
<br>
-Movie Night; <br>
-Miss NIS; <br>
-Mister NIS; <br>
-Vienna Ball. <br>
Благодаря чему я получил награду "Активист Года" в нашей школе.
</p>
</td>
<td>
<p class="small">
• Вместе с этим я занимаюсь бальными танцами, шахматами и баскетболом: <br>
-первый разряд по шахматам; <br>
-участником сборной нашей школы; <br>
-лидирующий бальник в танцевальном ансамбле школы. <br>
</p>
</td>
</tr>
</table>
</div>
</div>
<div class="col-lg-6">
<img class="title-image" src="img/zhalgas.jpeg" alt="iphone-mockup">
</div>
</div>
</div>
</section>
<!-- Modals -->
<div class="modal fade" id="info" tabindex="-1" aria-labelledby="infoLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="infoLabel">Связаться</h5>
</div>
<div class="modal-body">
<div class="container-fluid" style="padding-left: 30px; padding-right: 30px;">
<div class="row">
<div class="col-lg-6">
<h5>Присоединяйся!</h5>
<a href="https://chat.whatsapp.com/KIFPP3QRn1TIGAtm3lEuCg" class="btn btn-primary"><i
class="fa-brands fa-whatsapp"></i>WhatsApp</a>
<a href="https://t.me/+sgmk-e16JA43YTQy" class="btn btn-primary"><i
class="fa-brands fa-telegram"></i>Telegram</a>
<br>
<img class="logo-image" src="img/logo.png" alt="iphone-mockup">
</div>
<div class="col-lg-6">
<h3 class="contact">Данные</h3>
<p class="small">
Телефон: +7 776 900 8060 <br>
E-mail: birgenisphmd@gmail.com <br>
</p>
<ul class="list-inline text-center">
<h2>Соц. сети</h1>
<li class="list-inline-item">
<a href="https://www.instagram.com/oz.zhalgas/">
<span class="fa-stack fa-lg">
<i class="fas fa-circle fa-stack-2x"></i>
<i class="fab fa-instagram fa-stack-1x fa-inverse"></i>
</span>
</a>
</li>
<li class="list-inline-item">
<a href="https://www.instagram.com/birgecouncil/">
<span class="fa-stack fa-lg">
<i class="fas fa-circle fa-stack-2x"></i>
<i class="fab fa-instagram fa-stack-1x fa-inverse"></i>
</span>
</a>
</li>
<li class="list-inline-item">
<a href="https://www.tiktok.com/@birgenis">
<span class="fa-stack fa-lg">
<i class="fas fa-circle fa-stack-2x"></i>
<i class="fab fa-tiktok fa-stack-1x fa-inverse"></i>
</span>
</a>
</li>
</div>
</div>
</div>
</div>
<button type="button" class="btn btn-dark" data-bs-dismiss="modal">Закрыть</button>
</div>
</div>
</div>
<!-- Features -->
<section class="white-section" id="about">
<div class="container-fluid">
<div class="row">
<div class="col-lg-6 col-md-10 mx-auto">
<h2>Кто мы.</h2>
<p>Мы — команда <b>Birge</b> и мы выдвигаем свою кандидатуру на выборы президента школы НИШ ФМН
г.Нур-Султан🧡<br></p>
<p>Мы считаем, что каждый ученик должен чувствовать поддержку сообщества НИШ. Все обсуждения и решения мы
проводим <b>ВМЕСТЕ</b>, прислушиваясь к каждому. <br></p>
<p>Голосуй за <b>Жалгаса</b> — команду Birge, чтобы во всей школе веяла атмосфера единства и поддержки. <br>
</p>
<p><em><b>Birge Bol🧡💜<br>#voteforbirge<br>#voteforzhalgas<br></b></em></p>
</div>
<div class="col-lg-6 col-md-10 mx-auto">
<h3>Expertise.</h3>
<div class="progress">
<div class="progress-bar bg-primary" role="progressbar" style="width: 75%" aria-valuenow="100"
aria-valuemin="0" aria-valuemax="100">Problem-solving</div>
</div> <br>
<div class="progress">
<div class="progress-bar bg-warning" role="progressbar" style="width: 65%" aria-valuenow="100"
aria-valuemin="0" aria-valuemax="100">Organizational</div>
</div> <br>
<div class="progress">
<div class="progress-bar bg-danger" role="progressbar" style="width: 85%" aria-valuenow="100"
aria-valuemin="0" aria-valuemax="100">Leadership</div>
</div> <br>
<div class="progress">
<div class="progress-bar bg-primary" role="progressbar" style="width: 65%" aria-valuenow="100"
aria-valuemin="0" aria-valuemax="100">Communication</div>
</div> <br>
<div class="progress">
<div class="progress-bar bg-success" role="progressbar" style="width: 85%" aria-valuenow="100"
aria-valuemin="0" aria-valuemax="100">Teamwork</div>
</div> <br>
</div>
</div>
<div class="row">
<div class="feature-box col-lg-4">
<i class="icon fas fa-crosshairs fa-4x"></i>
<h3 class="feature-title">Единство и взаимопонимание.</h3>
<p>Команда Birge ценит <b>единство и взаимопонимание</b>. Каждый ученик школы, высказывая свою идею, получит
гарантированную поддержку от нашей команды.<br></p>
</div>
<div class="feature-box col-lg-4">
<i class="icon fas fa-heart fa-4x"></i>
<h3 class="feature-title">Честность и сплоченность.</h3>
<p>Как студенческий совет, мы будем работать <b>честно и сплоченно</b>. Все ученики будут чувствовать и уже
чувствуют тепло и уют. <br></p>
</div>
<div class="feature-box col-lg-4">
<i class="icon fas fa-comments fa-4x"></i>
<h3 class="feature-title">Дружелюбность.</h3>
<p>Атмосфера Birge - <b>дружелюбная и понимающая</b>. Во всей команде царит сплоченность и единство. В наших
планах сплотить, объединить школьное комьюнити. <br></p>
</div>
</div>
</div>
</section>
<!-- Team -->
<section class="colored-section" id="team">
<h1 style="padding-top: 50px;">Наша команда: </h1>
<div id="team-carousel" class="carousel slide" data-ride="false">
<div class="carousel-inner">
<div class="carousel-item container-fluid">
<img data-bs-toggle="modal" data-bs-target="#aidana" class="team-image" src="img/aidana.jpeg" alt="">
<br>
<h2 class="team-text">Айдана</h2>
<p class="small">(клик по фото)</p>
</div>
<!-- Modal -->
<div class="modal fade" id="aidana" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Айдана</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
10G, inst: <a href="https://www.instagram.com/berkimbayyeva/">@berkimbayyeva</a>
</div>
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
</div>
</div>
</div>
<div class="carousel-item container-fluid">
<img data-bs-toggle="modal" data-bs-target="#ramadan" class="team-image" src="img/ramadan.jpeg"
alt="">
<br>
<h2 class="team-text">Рамадан</h2>
<p class="small">(клик по фото)</p>
</div>
<!-- Modal -->
<div class="modal fade" id="ramadan" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Рамадан</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
10B, inst: <a href="https://www.instagram.com/ramadan_marat/">ramadan_marat</a>
</div>
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Закрыть</button>
</div>
</div>
</div>
<div class="carousel-item container-fluid active">
<img class="team-image" src="img/team.JPG" alt="">
</div>
<a class="carousel-control-prev" href="#team-carousel" role="button" data-bs-slide="prev">
<span class="carousel-control-prev-icon"></span>
</a>
<a class="carousel-control-next" href="#team-carousel" role="button" data-bs-slide="next">
<span class="carousel-control-next-icon"></span>
</a>
</div>
</div>
</section>
<!-- features -->
<section class="white-section" id="features">
<h2 class="section-heading">Что я предлагаю</h2>
<p>"Больше всего я люблю быть надежным — это самое чистое наслаждение."</p>
<p class="small">- Эдгар Лоренс Доктороу, "Билли Батгейт"</p>
<div class="container-fluid">
<div class="row">
<div class="card col-lg-4 mx-auto">
<div class="card-header">
<h3>Менторство.</h3>
</div>
<div class="card-body">
<p>Программа нацелена на сплочение старшего и младшего класса внутри шанырака, то есть благодаря специальным
ивентам и нашей поддержке, мы будем развивать внутренние взаимоотношения шаныраков. </p>
<p>Также, планируются подпроекты, такие как "Проектное менторство" и "Тематическое менторство", первое
нацелено на развитие связи между членами СК и учениками вне СК, благодаря проектам, идеи которых будут
предлагать ученики, а члены студ. совета будут помогать им в реализации данных проектов. "Тематическое
менторство" будет нацелено на помощь ученикам интересующимися той или иной сферой, благодаря менторам
которые имеют навыки и опыт в этих самых сферах</p>
</div>
</div>
<div class="card col-lg-4 mx-auto">
<div class="card-header">
<h3>День свободной формы.</h3>
</div>
<div class="card-body">
<p>День свободной формы или же день самовыражения! Только с нами вы сможете посетить школу в свободной
форме, тем самым повысить эффективность обучения и разукрасить ваши школьные будни!</p>
</div>
</div>
<div class="card col-lg-9 mx-auto">
<div class="card-header">
<h3>Поступление, проекты и портфолио.</h3>
</div>
<div class="card-body">
<p> В течении года будут организованы форумы, конференции от известных личностей в сфере образования. Также
будут организованы мероприятия Case Championship и откроется новый клуб по собиранию портфолио.
</p>
<p>Case Championship - это турнир среди нескольких команд, которым дают определенный кейс, проблему, и они
за час должны придумать хорошее решение и презентовать его.
Кейсы берутся с сайтов компаний, и это прям оооочень может пригодиться при поступлении, так как все
сертификаты будут вручены от именитых компаний, которые и дадут нам кейс.
</p>
</div>
</div>
<div class="card col-lg-9 mx-auto">
<div class="card-header">
<h3>Мероприятие со школами COASH.</h3>
</div>
<div class="card-body">
<p>Многим в школе известно существование спортивных соревнований в сети школ COASH. Но ведь далеко не каждый
интересуется спортом, что же делать ученикам, которые хотели бы отличиться своими эрудированностью и
знаниями?
Наша команда хочет внести еще одно мероприятие, которое будет проводиться на постоянной основе среди COASH
школ—викторина.
</p>
<p>
Викторина подразумевает под собой именно то, о чем вы подумали - кнопка для дачи ответа, школьная сборная,
волнения, перед дачей ответа ведущему и сертификаты/награды после каждой победы в турнире.
Все это будет проводиться между разными школами, что даст возможность защитить имя своей школы и
познакомиться с другими разными крутыми и интересными ребятами.
Также будем дальше развивать COASH и сетевые ивенты между другими школами НИШ, организовывая уже под нашим
крылом спортивные и развлекательные мероприятия, как: <br>
•Vienna Ball<br>
•BrainRing<br>
•KVN<br>
•Спортивная лига по многим дисциплинам COASH(Сезонные игры)</p>
</div>
</div>
</div>
<div class="feedback">
<h3>Есть предложения? Свяжись с нами, и мы ответим</h3>
<a href="#cta"><button class="btn btn-lg btn-block btn-outline-dark" type="button" data-bs-toggle="modal"
data-bs-target="#info">Связаться</button></a>
</div>
</div>
<div class="additional-links">
<h1>#voteforzhalgas</h1>
<h6 class="small">made by: @dtekio</h1>
</div>
</section>
<!-- Bootstrap core JavaScript -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/js/bootstrap.bundle.min.js"
integrity="sha384-A3rJD856KowSb7dwlZdYEkO39Gagi7vIsF0jrRAoQmDKKtQBHUuLZ9AsSv4jD4Xa"
crossorigin="anonymous"></script>
</body>
</html>