-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathboka.html
108 lines (102 loc) · 5.65 KB
/
boka.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
<!DOCTYPE html>
<html lang="ru">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta charset="utf-8">
<title>Boka!</title>
<link href="https://fonts.googleapis.com/css?family=Roboto:100,300,400" rel="stylesheet">
<link href="css/normalize.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</head>
<body>
<header class="main-header">
<div class="container header__container">
<div class="header__wrapper">
<a class="logo" href="#"><img src="img/logo.png" width="136" height="96" alt="logo"></a>
<div class="language">
<button class="language__item language__item--current">English</button>
<button class="language__item">Bangla</button>
<button class="language__item">Arabic</button>
<button class="language__item">Spanish</button>
</div>
</div>
<div class="header__search">
<img class="search__img" src="img/boka.png" width="261" height="62" alt="boka!">
<p class="search__paragraph">A great dating place</p>
<a class="btn search__btn" href="#">Discover</a>
</div>
</div>
</header>
<main>
<h1 class="visually-hidden">Boka!</h1>
<div class="container">
<div class="registration">
<img class="registration__img" src="img/get.png" width="431" height="80" alt="get-started">
<form class="registration__form" action="https://echo.htmlacademy.ru" method="post">
<ul class="form__list">
<li class="form__item form__gender">
<h2 class="gender__title">I am</h2>
<input class="visually-hidden gender__radio gender__radio--men" type="radio" name="gender" id="gender__men" value="men">
<label class="gender__label gender__label--men" for="gender__men">
Men
</label>
<input class="visually-hidden gender__radio gender__radio--women" type="radio" name="gender" id="gender__women" value="women">
<label class="gender__label gender__label--women" for="gender__women">
Women
</label>
</li>
<li class="form__item form__partner">
<h2 class="partner__title">Looking for</h2>
<input class="visually-hidden partner__radio partner__radio--men" type="radio" name="partner" id="partner__men" value="men">
<label class="partner__label partner__label--men" for="partner__men">
Men
</label>
<input class="visually-hidden partner__radio partner__radio--women" type="radio" name="partner" id="partner__women" value="women">
<label class="partner__label partner__label--women" for="partner__women">
Women
</label>
</li>
<li class="form__item form__email">
<label class="email__label" for="email">
email</label>
<input class="email" type="email" name="email" id="email" placeholder="wrobi1267@gmail.com">
</li>
<li class="form__item form__password">
<label class="password__label" for="password">
Password</label>
<input class="password" type="password" name="password" id="password" placeholder="*************">
</li>
</ul>
<button class="btn form__btn" type="submit">Join now</button>
</form>
<p class="registration__paragraph">By registrating you agree to the Terms and Conditions or Privacy Policy. You will receive all communication from Boka directly in your mail box.</p>
</div>
<div class="description">
<img class="description__photo" src="img/foto.png" width="1166" height="950" alt="photo">
<h2 class="description__title">Tips for first dating</h2>
<p class="description__paragraph">Dating is sometimes harder then it should be. After countless dinner and drinks, it can be tempting to throw in the towel and resign to nights of forever watching Netflix alone in your bed.
But when dating is done right, it can be amazing, and those great dates often lead to great relationships. So consider this your dating playbook, with all the information you need to survive the first date and make sure there's a second one...
</p>
</div>
</div>
</main>
<footer class="main-footer">
<div class="container">
<p class="footer__paragraph">Copyright 2017 Boka. All rights reserved. 1170pxX4000px.</p>
<nav class="footer__navigation">
<ul class="navigation__list">
<li class="navigation__item"><a class="navigation__item--link" href="#">About us</a></li>
<li class="navigation__item"><a class="navigation__item--link" href="#">Terms</a></li>
<li class="navigation__item"><a class="navigation__item--link" href="#">Privacy</a></li>
<li class="navigation__item"><a class="navigation__item--link" href="#">Cutomer Care</a></li>
<li class="navigation__item"><a class="navigation__item--link" href="#">Contact us</a></li>
<li class="navigation__item"><a class="navigation__item--link" href="#">Press</a></li>
</ul>
</nav>
</div>
</footer>
<script src="js/script.js">
</script>
</body>
</html>