-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
303 lines (299 loc) · 16.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
<!DOCTYPE html>
<html lang="ru">
<head>
<title>Клуб четырёх коней</title>
<!-- meta-теги для поисковых систем -->
<meta charset="UTF-8">
<meta name="author" content="Максим Болотин a.k.a. Mark Bone">
<meta name="description" content="Превратите уездный город в столицу земного шара.">
<meta name="keywords" content="four-horse-club, клуб четырёх коней">
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="robots" content="index, follow">
<!-- meta-теги для социальных сетей -->
<meta property="og:title" content="Клуб четырёх коней">
<meta property="og:type" content="website">
<meta property="og:url" content="https://four-horse-club.netlify.app/">
<meta property="og:description" content="Превратите уездный город в столицу земного шара.">
<meta property="og:image" content="./img/cover.jpg">
<meta property="og:site_name" content="Клуб четырёх коней">
<meta property="og:locale" content="ru_RU">
<!-- meta-теги для x.com -->
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="Клуб четырёх коней">
<meta name="twitter:description" content="Превратите уездный город в столицу земного шара.">
<meta name="twitter:image" content="./img/cover.jpg">
<meta name="theme-color" content="#E7DBD0" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="X-XSS-Protection" content="1; mode=block">
<link rel="icon" href="img/favicon.ico" />
<link rel="apple-touch-icon" href="img/favicon.png" />
<link rel="stylesheet" href="./css/style.css">
<link rel="manifest" href="./manifest.json" />
<script src="./js/ticker/ticker.js" defer></script>
<script src="./js/carousel.js" defer></script>
<script src="./js/support/reorder.js" defer></script>
<script src="./js/mediaquery.js" defer></script>
</head>
<body>
<div class="wrapper">
<header class="header">
<div class="container">
<div class="logo">
<img class="no-touch" src="./img/logo.svg" alt="Клуб четырёх коней">
</div>
<div class="header__content">
<div class="header__title">
<h1 class="h h-1 header__title_row header__title_row_first">Превратите уездный город</h1>
<h1 class="h h-1 header__title_row header__title_row_second">в столицу</h1>
<h1 class="h h-1 header__title_row header__title_row_third">земного шара</h1>
</div>
<div class="header__description">
<span class="t">Оплатите взнос на телеграммы для организации Международного васюкинского турнира по шахматам</span>
</div>
<div class="header__buttons">
<a href="#support" class="link button button_large button_large--b-y no-touch"><span class="t">Поддержать шахматную мысль</span></a>
<a href="#details" class="link button button_large button_large--t-b no-touch"><span class="t">Подробнее о турнире</span></a>
</div>
</div>
</div>
<div class="header__background">
<figure class="background__figure background__figure_layer-7">
<img class="background__figure-img no-touch" src="./img/img-header-c636c3.svg" alt="Солнце">
</figure>
<figure class="background__figure background__figure_layer-6">
<img class="background__figure-img no-touch" src="./img/img-header-ea9eb1.png" alt="Королева">
</figure>
<figure class="background__figure background__figure_layer-5">
<img class="background__figure-img no-touch" src="./img/img-header-deaafc.png" alt="Король">
</figure>
<figure class="background__figure background__figure_layer-4">
<img class="background__figure-img no-touch" src="./img/img-header-dbb4dc.png" alt="Город">
</figure>
<figure class="background__figure background__figure_layer-3">
<img class="background__figure-img no-touch" src="./img/filter.png" alt="Фильтр">
</figure>
<figure class="background__figure background__figure_layer-2">
<img class="background__figure-img no-touch" src="./img/img-header-8c5a6b.png" alt="Пешка">
</figure>
<figure class="background__figure background__figure_layer-1">
<img class="background__figure-img no-touch" src="./img/img-header-012af1.png" alt="Конь">
</figure>
</div>
</header>
<main class="page">
<section class="ticker">
<!-- Бегущая строка вставляется сюда из ticker.js -->
</section>
<section class="support" id="support">
<div class="container">
<div class="support_content">
<div class="support__item support__item-lectionary desk">
<div class="lectionary__title">
<h3 class="h h-3 inline">Чтобы поддержать Международный васюкинский турнир</h3>
<h3 class="h h-3 inline">посетите лекцию на тему: <span class="t-weight_bold t--c-three">«Плодотворная дебютная идея»</strong></h3>
</div>
<figure class="lectionary__figure">
<img class="lectionary__figure-img no-touch" src="./img/img-support-53dd0d.png" alt="«Плодотворная дебютная идея»">
</figure>
</div>
<div class="support__item support__item-session">
<figure class="session__figure">
<img class="session__figure-img session__figure-img_layer-1 no-touch" src="./img/img-support-70176c.png" alt="Сеанс одновременной игры в шахматы на 160 досках гроссмейстера О. Бендера">
<img class="session__figure-img session__figure-img_layer-2 no-touch" src="./img/filter_short.png" alt="Фильтр">
</figure>
<div class="session__content">
<div class="session__title">
<h3 class="h h-3">и Сеанс <span class="t-weight_bold t--c-three">одновременной игры в шахматы на 160 досках</span> гроссмейстера О. Бендера</h3>
</div>
<table class="session__table table">
<tr class="table__row table__row-1 table__row_first">
<th class="table__cell table__col table__col_first"><span class="t t-opacity_seventy">Место проведения:</span></th>
<th class="table__cell table__col table__col_last"><span class="t t-weight_semibold">Клуб «Картонажник»</span></th>
</tr>
<tr class="table__row table__row-2">
<th class="table__cell table__col table__col_first"><span class="t t-opacity_seventy">Дата и время мероприятия:</span></th>
<th class="table__cell table__col table__col_last"><span class="t t-weight_semibold">22 июня 1927 г. в 18:00</span></th>
</tr>
<tr class="table__row table__row-3">
<th class="table__cell table__col table__col_first"><span class="t t-opacity_seventy">Стоимость входных билетов:</span></th>
<th class="table__cell table__col table__col_last"><span class="t t-weight_semibold">20 коп.</span></th>
</tr>
<tr class="table__row table__row-4 table__row_anyway">
<th class="table__cell table__col table__col_first"><span class="t t-opacity_seventy">Плата за игру:</span></th>
<th class="table__cell table__col table__col_last"><span class="t t-weight_semibold">50 коп.</span></th>
</tr>
<tr class="table__row table__row-5 table__row_last">
<th class="table__cell table__col table__col_first"><span class="t t-opacity_seventy">Взнос на телеграммы:</span></th>
<th class="table__cell table__col table__col_last"><span class="t t-weight_semibold"><span class="t-decorated_s t-decorated_s--c-three no-touch">100 руб.</span><span class="t no-touch"> </span>21 руб. 16 коп.</span></th>
</tr>
</table>
<div class="session__note">
<p class="t--c-four">По всем вопросам обращаться в администрацию к К. Михельсону</p>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="details" id="details">
<div class="container">
<div class="details__content carousel carousel_view-single carousel_navigation-dots">
<div class="details__title">
<div class="details__title_string-1">
<h2 class="h h-2">Этапы преображения</h2>
</div>
<div class="details__title_string-2">
<h2 class="h h-2">Васюков</h2>
<span class="t t--c-four details__title_sub">Будущие источники обогащения васюкинцев</span>
</div>
</div>
<div class="details-items__wrapper">
<ol class="details__items carousel__items list">
<div class="carousel__item">
<div class="details__item details__grid-cell--1-2">
<div class="details__subitem">
<li class="item_content">
<span class="t t-weight_medium">Строительство железнодорожной магистрали Москва-Васюки</span>
</li>
</div>
<div class="details__subitem">
<li class="item_content">
<span class="t t-weight_medium">Открытие фешенебельной гостиницы «Проходная пешка» и других небоскрёбов</span>
</li>
</div>
</div>
</div>
<div class="carousel__item">
<div class="details__item details__grid-cell--3">
<li class="item_content">
<span class="t t-weight_medium">Поднятие сельского хозяйства в радиусе на тысячу километров: производство овощей, фруктов, икры, шоколадных конфет</span>
</li>
</div>
</div>
<div class="carousel__item">
<div class="details__item details__grid-cell--4-5">
<div class="details__subitem">
<li class="item_content">
<span class="t t-weight_medium">Строительство дворца<br>для турнира</span>
</li>
</div>
<div class="details__subitem">
<li class="item_content">
<span class="t t-weight_medium">Размещение гаражей<br>для гостевого<br>автотранспорта</span>
</li>
</div>
</div>
</div>
<div class="carousel__item">
<div class="details__item details__grid-cell--6">
<li class="item_content">
<span class="t t-weight_medium">Постройка сверхмощной радиостанции для передачи всему миру сенсационных результатов</span>
</li>
</div>
</div>
<div class="carousel__item">
<div class="details__item details__grid-cell--7">
<li class="item_content">
<span class="t t-weight_medium">Создание аэропорта «Большие Васюки» с регулярным отправлением почтовых самолётов и дирижаблей во все концы света, включая Лос-Анжелос и Мельбурн</span>
</li>
</div>
</div>
</ol>
<div class="no-touch details-figure__wrapper">
<figure class="details__figure">
<img class="no-touch details__figure__img" src="./img/img-details-15a01e.png" alt="Самолёт">
</figure>
</div>
</div>
<div class="details-navigation__wrapper">
<div class="details__navigation navigation mob">
</div>
</div>
</div>
</div>
</section>
<section class="participants">
<div class="container">
<div class="participants__content carousel carousel_navigation-digitals carousel_autoscroll-true">
<div class="participants__title">
<h2 class="h h-2">Участники турнира</h2>
</div>
<div class="participants__navigation navigation">
</div>
<ul class="participants__items carousel__items list">
<li class="participants__item carousel__item">
<figure class="item__figure">
<img class="no-touch item__figure-img" src="./img/img-participants-4f82b1.png" alt="Хозе-Рауль Капабланка">
</figure>
<div class="item__title">
<span class="t t-size_l t-weight_semibold">Хозе-Рауль Капабланка</span>
<p class="t t-opacity_sixty">Чемпион мира по шахматам</p>
</div>
<a type="button" onclick="console.log('href не задан');" class="button button_small no-touch"><span class="t t-size_s t-weight_medium">Подробнее</span></a>
</li>
<li class="participants__item carousel__item">
<figure class="item__figure">
<img class="no-touch item__figure-img" src="./img/img-participants-4f82b1.png" alt="Эммануил Ласкер">
</figure>
<div class="item__title">
<span class="t t-size_l t-weight_semibold">Эммануил Ласкер</span>
<p class="t t-opacity_sixty">Чемпион мира по шахматам</p>
</div>
<a type="button" onclick="console.log('href не задан');" class="button button_small no-touch"><span class="t t-size_s t-weight_medium">Подробнее</span></a>
</li>
<li class="participants__item carousel__item">
<figure class="item__figure">
<img class="no-touch item__figure-img" src="./img/img-participants-4f82b1.png" alt="Александр Алехин">
</figure>
<div class="item__title">
<span class="t t-size_l t-weight_semibold">Александр Алехин</span>
<p class="t t-opacity_sixty">Чемпион мира по шахматам</p>
</div>
<a type="button" onclick="console.log('href не задан');" class="button button_small no-touch"><span class="t t-size_s t-weight_medium">Подробнее</span></a>
</li>
<li class="participants__item carousel__item">
<figure class="item__figure">
<img class="no-touch item__figure-img" src="./img/img-participants-4f82b1.png" alt="Арон Нимцович">
</figure>
<div class="item__title">
<span class="t t-size_l t-weight_semibold">Арон Нимцович</span>
<p class="t t-opacity_sixty">Чемпион мира по шахматам</p>
</div>
<a type="button" onclick="console.log('href не задан');" class="button button_small no-touch"><span class="t t-size_s t-weight_medium">Подробнее</span></a>
</li>
<li class="participants__item carousel__item">
<figure class="item__figure">
<img class="no-touch item__figure-img" src="./img/img-participants-4f82b1.png" alt="Рихард Рети">
</figure>
<div class="item__title">
<span class="t t-size_l t-weight_semibold">Рихард Рети</span>
<p class="t t-opacity_sixty">Чемпион мира по шахматам</p>
</div>
<a type="button" onclick="console.log('href не задан');" class="button button_small no-touch"><span class="t t-size_s t-weight_medium">Подробнее</span></a>
</li>
<li class="participants__item carousel__item">
<figure class="item__figure">
<img class="no-touch item__figure-img" src="./img/img-participants-4f82b1.png" alt="Остап Бендер">
</figure>
<div class="item__title">
<span class="t t-size_l t-weight_semibold">Остап Бендер</span>
<p class="t t-opacity_sixty">Гроссмейстер</p>
</div>
<a type="button" onclick="console.log('href не задан');" class="button button_small no-touch"><span class="t t-size_s t-weight_medium">Подробнее</span></a>
</li>
</ul>
</div>
</div>
</section>
<section class="ticker">
<!-- Бегущая строка вставляется сюда из ticker.js -->
</section>
</main>
<footer class="footer">
<div class="container">
<p class="t t-size_s t-opacity_sixty">Все персонажи, события и цитаты являются вымышленными и не принадлежат создателям сайта. С подробностями можно познакомиться в главе XXXIV романа Ильи Ильфа и Евгения Петрова «Двенадцать стульев».</p>
</div>
</footer>
</div>
</body>
</html>