-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
201 lines (198 loc) · 12.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
<!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">
<!-- Подключение шрифтов ссылками -->
<!-- <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=Inter:wght@400;500;600;700;800;900&display=swap"
rel="stylesheet"> -->
<link rel="stylesheet" href="css/reset-styles.css">
<link rel="stylesheet" href="css/styles.css">
<link rel="stylesheet" href="css/adaptive.css">
<link rel="shortcut icon" href="images/shortcut_icon_solarvito.svg" type="image/svg+xml">
<title>Solarvito</title>
</head>
<body>
<header>
<div class="container">
<div class="header-block">
<a href="#" class="header-block__log-in">
<svg width="16" height="16" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
<path
d="M8 8C8.99456 8 9.94839 7.60491 10.6517 6.90165C11.3549 6.19839 11.75 5.24456 11.75 4.25C11.75 3.25544 11.3549 2.30161 10.6517 1.59835C9.94839 0.895088 8.99456 0.5 8 0.5C7.00544 0.5 6.05161 0.895088 5.34835 1.59835C4.64509 2.30161 4.25 3.25544 4.25 4.25C4.25 5.24456 4.64509 6.19839 5.34835 6.90165C6.05161 7.60491 7.00544 8 8 8ZM10.5 4.25C10.5 4.91304 10.2366 5.54893 9.76777 6.01777C9.29893 6.48661 8.66304 6.75 8 6.75C7.33696 6.75 6.70107 6.48661 6.23223 6.01777C5.76339 5.54893 5.5 4.91304 5.5 4.25C5.5 3.58696 5.76339 2.95107 6.23223 2.48223C6.70107 2.01339 7.33696 1.75 8 1.75C8.66304 1.75 9.29893 2.01339 9.76777 2.48223C10.2366 2.95107 10.5 3.58696 10.5 4.25ZM15.5 14.25C15.5 15.5 14.25 15.5 14.25 15.5H1.75C1.75 15.5 0.5 15.5 0.5 14.25C0.5 13 1.75 9.25 8 9.25C14.25 9.25 15.5 13 15.5 14.25ZM14.25 14.245C14.2487 13.9375 14.0575 13.0125 13.21 12.165C12.395 11.35 10.8612 10.5 8 10.5C5.1375 10.5 3.605 11.35 2.79 12.165C1.9425 13.0125 1.7525 13.9375 1.75 14.245H14.25Z" />
</svg>
Войти
</a>
<a href="#" class="header-block__new-advertisement">
Новое объявление
<svg width="10" height="10" viewBox="0 0 10 10" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
<path
d="M5 0C5.16576 0 5.32473 0.0658481 5.44194 0.183058C5.55915 0.300269 5.625 0.45924 5.625 0.625V4.375H9.375C9.54076 4.375 9.69973 4.44085 9.81694 4.55806C9.93415 4.67527 10 4.83424 10 5C10 5.16576 9.93415 5.32473 9.81694 5.44194C9.69973 5.55915 9.54076 5.625 9.375 5.625H5.625V9.375C5.625 9.54076 5.55915 9.69973 5.44194 9.81694C5.32473 9.93415 5.16576 10 5 10C4.83424 10 4.67527 9.93415 4.55806 9.81694C4.44085 9.69973 4.375 9.54076 4.375 9.375V5.625H0.625C0.45924 5.625 0.300269 5.55915 0.183058 5.44194C0.0658481 5.32473 0 5.16576 0 5C0 4.83424 0.0658481 4.67527 0.183058 4.55806C0.300269 4.44085 0.45924 4.375 0.625 4.375H4.375V0.625C4.375 0.45924 4.44085 0.300269 4.55806 0.183058C4.67527 0.0658481 4.83424 0 5 0Z" />
</svg>
</a>
</div>
</div>
</header>
<main>
<div class="container">
<div class="categories-search">
<a href="./index.html" class="categories-search__header">Доска объявлений</a>
<a href="#" class="categories-search__all-categories">
<svg width="20" height="20" viewBox="0 0 20 20" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd"
d="M5.625 14.375C5.625 14.2092 5.69085 14.0503 5.80806 13.9331C5.92527 13.8158 6.08424 13.75 6.25 13.75H18.75C18.9158 13.75 19.0747 13.8158 19.1919 13.9331C19.3092 14.0503 19.375 14.2092 19.375 14.375C19.375 14.5408 19.3092 14.6997 19.1919 14.8169C19.0747 14.9342 18.9158 15 18.75 15H6.25C6.08424 15 5.92527 14.9342 5.80806 14.8169C5.69085 14.6997 5.625 14.5408 5.625 14.375ZM3.125 9.375C3.125 9.20924 3.19085 9.05027 3.30806 8.93306C3.42527 8.81585 3.58424 8.75 3.75 8.75H16.25C16.4158 8.75 16.5747 8.81585 16.6919 8.93306C16.8092 9.05027 16.875 9.20924 16.875 9.375C16.875 9.54076 16.8092 9.69973 16.6919 9.81694C16.5747 9.93415 16.4158 10 16.25 10H3.75C3.58424 10 3.42527 9.93415 3.30806 9.81694C3.19085 9.69973 3.125 9.54076 3.125 9.375ZM0.625 4.375C0.625 4.20924 0.690848 4.05027 0.808058 3.93306C0.925268 3.81585 1.08424 3.75 1.25 3.75H13.75C13.9158 3.75 14.0747 3.81585 14.1919 3.93306C14.3092 4.05027 14.375 4.20924 14.375 4.375C14.375 4.54076 14.3092 4.69973 14.1919 4.81694C14.0747 4.93415 13.9158 5 13.75 5H1.25C1.08424 5 0.925268 4.93415 0.808058 4.81694C0.690848 4.69973 0.625 4.54076 0.625 4.375Z" />
</svg>
<p class="categories-search__all-categories_text">
Все категории
</p>
</a>
<form action="" class="categories-search__search-form">
<input type="" class="categories-search__search-form_input" placeholder="Поиск по объявлениям"
aria-label="Поиск">
<button class="categories-search__search-button">
<p class="categories-search__search-button_text"></p>
Найти
</p>
<svg width="16" height="16" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
<path
d="M11.742 10.344C12.7103 9.02268 13.144 7.38448 12.9563 5.75714C12.7687 4.1298 11.9735 2.63333 10.7298 1.56712C9.48616 0.500915 7.88579 -0.0564028 6.24888 0.0066704C4.61197 0.0697435 3.05923 0.748556 1.90131 1.9073C0.743395 3.06605 0.0656939 4.61927 0.00379204 6.25623C-0.0581098 7.89318 0.500353 9.49315 1.56745 10.736C2.63455 11.9789 4.13159 12.7731 5.75906 12.9596C7.38654 13.1461 9.02442 12.7112 10.345 11.742H10.344C10.374 11.782 10.406 11.82 10.442 11.857L14.292 15.707C14.4796 15.8946 14.7339 16.0001 14.9992 16.0002C15.2645 16.0003 15.5189 15.895 15.7065 15.7075C15.8942 15.52 15.9997 15.2656 15.9997 15.0003C15.9998 14.7351 15.8946 14.4806 15.707 14.293L11.857 10.443C11.8213 10.4068 11.7828 10.3734 11.742 10.343V10.344ZM12 6.49999C12 7.22226 11.8578 7.93746 11.5814 8.60475C11.305 9.27204 10.8999 9.87836 10.3891 10.3891C9.87841 10.8998 9.27209 11.3049 8.6048 11.5813C7.93751 11.8577 7.22231 12 6.50004 12C5.77777 12 5.06258 11.8577 4.39528 11.5813C3.72799 11.3049 3.12168 10.8998 2.61096 10.3891C2.10023 9.87836 1.69511 9.27204 1.41871 8.60475C1.14231 7.93746 1.00004 7.22226 1.00004 6.49999C1.00004 5.0413 1.57951 3.64236 2.61096 2.61091C3.64241 1.57946 5.04135 0.999994 6.50004 0.999994C7.95873 0.999994 9.35768 1.57946 10.3891 2.61091C11.4206 3.64236 12 5.0413 12 6.49999Z" />
</svg>
</button>
</form>
</div>
</div>
<div class="divider"></div>
<div class="container">
<p class="advertisments__header">
Рекомендации для вас
</p>
<div class="advertisments">
<a href="#" class="advertisments__card">
<img src="images/advertisments/girls.png" alt="advertisment image" class="advertisments__card-image">
<p class="advertisments__card-header">
Жена и её лучшая подруга
</p>
<span class="advertisments__card-price">
20 000 ₽
</span>
<p class="advertisments__card-location-date">Москва, Ленинский проспект <br> Сегодня 14:12 </p>
</a>
<a href="#" class="advertisments__card">
<img src="images/advertisments/cat.png" alt="advertisment image" class="advertisments__card-image">
<p class="advertisments__card-header">
Кот Уголёк
</p>
<span class="advertisments__card-price">
Бесценен
</span>
<p class="advertisments__card-location-date">Москва, Ленинский проспект <br> Сегодня 14:12 </p>
</a>
<a href="#" class="advertisments__card">
<img src="images/advertisments/girls.png" alt="advertisment image" class="advertisments__card-image">
<p class="advertisments__card-header">
Жена и её лучшая подруга
</p>
<span class="advertisments__card-price">
20 000 ₽
</span>
<p class="advertisments__card-location-date">Москва, Ленинский проспект <br> Сегодня 14:12 </p>
</a>
<a href="#" class="advertisments__card">
<img src="images/advertisments/cat.png" alt="advertisment image" class="advertisments__card-image">
<p class="advertisments__card-header">
Кот Уголёк
</p>
<span class="advertisments__card-price">
Бесценен
</span>
<p class="advertisments__card-location-date">Москва, Ленинский проспект <br> Сегодня 14:12 </p>
</a>
<a href="#" class="advertisments__card">
<img src="images/advertisments/girls.png" alt="advertisment image" class="advertisments__card-image">
<p class="advertisments__card-header">
Жена и её лучшая подруга
</p>
<span class="advertisments__card-price">
20 000 ₽
</span>
<p class="advertisments__card-location-date">Москва, Ленинский проспект <br> Сегодня 14:12 </p>
</a>
<a href="#" class="advertisments__card">
<img src="images/advertisments/cat.png" alt="advertisment image" class="advertisments__card-image">
<p class="advertisments__card-header">
Кот Уголёк
</p>
<span class="advertisments__card-price">
Бесценен
</span>
<p class="advertisments__card-location-date">Москва, Ленинский проспект <br> Сегодня 14:12 </p>
</a>
<a href="#" class="advertisments__card">
<img src="images/advertisments/girls.png" alt="advertisment image" class="advertisments__card-image">
<p class="advertisments__card-header">
Жена и её лучшая подруга
</p>
<span class="advertisments__card-price">
20 000 ₽
</span>
<p class="advertisments__card-location-date">Москва, Ленинский проспект <br> Сегодня 14:12 </p>
</a>
<a href="#" class="advertisments__card">
<img src="images/advertisments/cat.png" alt="advertisment image" class="advertisments__card-image">
<p class="advertisments__card-header">
Кот Уголёк
</p>
<span class="advertisments__card-price">
Бесценен
</span>
<p class="advertisments__card-location-date">Москва, Ленинский проспект <br> Сегодня 14:12 </p>
</a>
<a href="#" class="advertisments__card">
<img src="images/advertisments/girls.png" alt="advertisment image" class="advertisments__card-image">
<p class="advertisments__card-header">
Жена и её лучшая подруга
</p>
<span class="advertisments__card-price">
20 000 ₽
</span>
<p class="advertisments__card-location-date">Москва, Ленинский проспект <br> Сегодня 14:12 </p>
</a>
<a href="#" class="advertisments__card">
<img src="images/advertisments/cat.png" alt="advertisment image" class="advertisments__card-image">
<p class="advertisments__card-header">
Кот Уголёк
</p>
<span class="advertisments__card-price">
Бесценен
</span>
<p class="advertisments__card-location-date">Москва, Ленинский проспект <br> Сегодня 14:12 </p>
</a>
<a href="#"class="advertisments__card">
<img src="images/advertisments/girls.png" alt="advertisment image" class="advertisments__card-image">
<p class="advertisments__card-header">
Жена и её лучшая подруга
</p>
<span class="advertisments__card-price">
20 000 ₽
</span>
<p class="advertisments__card-location-date">Москва, Ленинский проспект <br> Сегодня 14:12 </p>
</a>
<a href="#" class="advertisments__card">
<img src="images/advertisments/cat.png" alt="advertisment image" class="advertisments__card-image">
<p class="advertisments__card-header">
Кот Уголёк
</p>
<span class="advertisments__card-price">
Бесценен
</span>
<p class="advertisments__card-location-date">Москва, Ленинский проспект <br> Сегодня 14:12 </p>
</a>
</div>
</div>
</main>
</body>
</html>