-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
252 lines (243 loc) · 13.2 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
<!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">
<title>Abito - доска объявлений</title>
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/normalize.css">
<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=Roboto:wght@400;700&display=swap" rel="stylesheet">
</head>
<body>
<!-- HEDER START -->
<header class="header container">
<div class="navbar">
<a href="/index.html" class="logo">
<img src="./img/logo.svg" alt="logo:Abito" class="logo-image">
</a>
<div class="navbar-panel">
<button class="close-menu">
<svg width="28" height="28" viewBox="0 0 28 28" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M1 1L27 27M1 27L27 1" stroke="black"/>
</svg>
</button>
<nav class="navbar-menu">
<ul class="menu">
<li class="menu-item">
<a href="#" class="menu-link">Авто</a>
</li>
<li class="menu-item">
<a href="#" class="menu-link">Недвижимость</a>
</li>
<li class="menu-item">
<a href="#" class="menu-link">Работа</a>
</li>
<li class="menu-item">
<a href="#" class="menu-link">Услуги</a>
</li>
</ul>
</nav>
<div class="button-group">
<a href="#" class="button button-link">Вход и регистрация</a>
<a href="#" class="button button-primary">Подать объявление</a>
</div>
</div>
<button class="menu-button"><svg width="30" height="30" viewBox="0 0 30 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M0.937476 2.37501H29.0624C29.58 2.37501 29.9999 1.95498 29.9999 1.43754C29.9999 0.920016 29.5799 0.500061 29.0624 0.500061H0.937476C0.419955 0.500061 0 0.920094 0 1.43754C0 1.95498 0.420033 2.37501 0.937476 2.37501Z" fill="black"/>
<path d="M29.0624 7.06256H0.937476C0.419955 7.06256 0 7.48259 0 8.00003C0 8.51747 0.420033 8.9375 0.937476 8.9375H29.0624C29.58 8.9375 29.9999 8.51747 29.9999 8.00003C29.9999 7.48259 29.58 7.06256 29.0624 7.06256Z" fill="black"/>
<path d="M29.0625 13.625H10.3125C9.79495 13.625 9.375 14.0451 9.375 14.5625C9.375 15.08 9.79503 15.5 10.3125 15.5H29.0625C29.58 15.5 29.9999 15.0799 29.9999 14.5625C30 14.045 29.58 13.625 29.0625 13.625Z" fill="black"/>
</svg>
</button>
</div>
<!-- /.navbar -->
<div class="search-panel">
<input type="search" class="search-input" placeholder="Поиск по объявлениям">
<button class="search-button">
<svg class="search-icon" width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0)">
<path d="M14.6506 14.0012L10.0862 9.43675C10.9465 8.43352 11.4706 7.13293 11.4706 5.71058C11.4706 2.54822 8.89765 -0.0247192 5.7353 -0.0247192C4.20353 -0.0247192 2.76265 0.571751 1.67824 1.6544C0.595589 2.73793 -0.000881376 4.17881 9.77541e-07 5.71058C9.77541e-07 8.87293 2.57294 11.4459 5.7353 11.4459C7.15765 11.4459 8.45912 10.9218 9.46235 10.0615L14.0268 14.6259L14.6506 14.0012ZM5.7353 10.5635C3.06 10.5635 0.882354 8.38675 0.882354 5.71058C0.881472 4.41352 1.38618 3.19499 2.30294 2.2791C3.21882 1.36234 4.43824 0.857634 5.7353 0.857634C8.41059 0.857634 10.5882 3.0344 10.5882 5.71058C10.5882 8.38587 8.41059 10.5635 5.7353 10.5635Z" fill="white"/>
</g>
<defs>
<clipPath id="clip0">
<rect width="15" height="15" fill="white"/>
</clipPath>
</defs>
</svg>
<span class="search-button-text">Найти</span>
</button>
</div>
<!-- /.search-panel -->
</header>
<!-- HEDER END -->
<div class="page-content container">
<main class="main">
<h2 class="page-title">Рекомендации для вас</h2>
<div class="cards">
<div class="card">
<a href="single.html" class="card-link">
<img src="img/card-image.jpg" alt="photo" class="card-image">
</a>
<div class="card-header">
<a href="single.html" class="card-link">
<h3 class="card-title">Электросамокат</h3>
</a>
<button class="like">
<img src="./img/like.svg" alt="like">
</button>
</div>
<strong class="card-price">
10 980 ₽
</strong>
<p class="card-text">Казань, р-н Ново-Савиновский</p>
<p class="card-text">10 июля 11:39</p>
</div>
<!-- /.card -->
<div class="card">
<a href="single.html" class="card-link">
<img src="img/card-image_1.jpg" alt="photo" class="card-image">
</a>
<div class="card-header">
<a href="single.html" class="card-link">
<h3 class="card-title">Пвх материал 2й сорт</h3>
</a>
<button class="like">
<img src="./img/like.svg" alt="like">
</button>
</div>
<strong class="card-price">
170 ₽
</strong>
<p class="card-text">Казань, р-н Вахитовский</p>
<p class="card-text">10 июля 11:39</p>
</div>
<!-- /.card -->
<div class="card">
<a href="single.html" class="card-link">
<img src="img/card-image_2.jpg" alt="photo" class="card-image">
</a>
<div class="card-header">
<a href="single.html" class="card-link">
<h3 class="card-title">Двухсторонняя ветровка для мальчика</h3>
</a>
<button class="like">
<img src="./img/like.svg" alt="like">
</button>
</div>
<strong class="card-price">
2 110 ₽
</strong>
<p class="card-text">Казань, р-н Ново-Савиновский</p>
<p class="card-text">10 июля 11:39</p>
</div>
<!-- /.card -->
<div class="card">
<a href="single.html" class="card-link">
<img src="img/card-image_3.jpg" alt="photo" class="card-image">
</a>
<div class="card-header">
<a href="single.html" class="card-link">
<h3 class="card-title">Пеленальная доска на комод</h3>
</a>
<button class="like">
<img src="./img/like.svg" alt="like">
</button>
</div>
<strong class="card-price">
200 ₽
</strong>
<p class="card-text">Казань, р-н Ново-Савиновский</p>
<p class="card-text">10 июля 11:39</p>
</div>
<!-- /.card -->
<div class="card">
<a href="single.html" class="card-link">
<img src="img/card-image_4.jpg" alt="photo" class="card-image">
</a>
<div class="card-header">
<a href="single.html" class="card-link">
<h3 class="card-title">Участок 8 сот. (ИЖС)</h3>
</a>
<button class="like">
<img src="./img/like.svg" alt="like">
</button>
</div>
<strong class="card-price">
101 980 ₽
</strong>
<p class="card-text">Казань, р-н Ново-Савиновский</p>
<p class="card-text">10 июля 11:39</p>
</div>
<!-- /.card -->
<div class="card">
<a href="single.html" class="card-link">
<img src="img/card-image_5.jpg" alt="photo" class="card-image">
</a>
<div class="card-header">
<a href="single.html" class="card-link">
<h3 class="card-title">Ford Fusion, 2007</h3>
</a>
<button class="like">
<img src="./img/like.svg" alt="like">
</button>
</div>
<strong class="card-price">
304 000 ₽
</strong>
<p class="card-text">Казань, р-н Ново-Савиновский</p>
<p class="card-text">10 июля 11:39</p>
</div>
<!-- /.card -->
</div>
<!-- /.cards -->
</main>
<aside class="sidebar">
<h4 class="page-title">Сервисы и услуги</h4>
<div class="service">
<img src="./img/shipping.svg" alt="icon:shipping" class="service-image">
<h5 class="service-title">Доставка</h5>
<p class="service-text">Проверка при получении и возможность бесплатно вернуть товар</p>
</div>
<div class="service">
<img src="./img/shipping_1.svg" alt="icon:shipping" class="service-image">
<h5 class="service-title">Автотека</h5>
<p class="service-text">Отчёт с историей авто: пробег, владельцы, сведения о залоге, ДТП и ремонтах</p>
</div>
<div class="service">
<img src="./img/shipping_2.svg" alt="icon:shipping" class="service-image">
<h5 class="service-title">Онлайн-бронирование жилья</h5>
<p class="service-text">Посуточная аренда квартир и домов: большой выбор вариантов для поездок по России</p>
</div>
<hr color="#E5E5E5">
<footer class="footer">
<p class="footer-text">© ООО «Абито», 2011–2021</p>
<ul class="footer-menu">
<li class="footer-menu-item">
<a href="#" class="footer-text">Политика конфиденциальности</a>
</li>
<li class="footer-menu-item">
<a href="#" class="footer-text">Обработка данных</a>
</li>
</ul>
<ul class="footer-menu">
<li class="footer-menu-item">
<a href="#" class="footer-link">Реклама на сайте</a>
</li>
<li class="footer-menu-item">
<a href="#" class="footer-link">Вакансии</a>
</li>
<li class="footer-menu-item">
<a href="#" class="footer-link">Помощь</a>
</li>
</ul>
</footer>
</aside>
<!-- /.sidebar -->
</div>
<!-- /.page-content -->
<script src="https://unpkg.com/swiper/swiper-bundle.min.js"></script>
<script src="js/main.js"></script>
</body>
</html>