-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
134 lines (134 loc) · 8.71 KB
/
Copy pathindex.html
File metadata and controls
134 lines (134 loc) · 8.71 KB
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
<!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>Главная</title>
<link rel="stylesheet" href="style.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=Montserrat+Alternates:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap"
rel="stylesheet">
</head>
<body>
<div class="img">
<img class="falling-img" src="img/hat__santa.png" alt="Колпак санты">
<img class="falling-img" src="img/house.png" alt="Пряничный домик">
<img class="falling-img" src="img/cookies.png" alt="Печенье">
<img class="falling-img" src="img/candy.png" alt="Рождественский леденец">
<img class="falling-img" src="img/ball.png" alt="Елочный шар">
<img class="falling-img" src="img/snow.png" alt="Снежинка">
<img class="falling-img" src="img/cart.png" alt="Подарочная карта">
<script>
const images = document.querySelectorAll('.falling-img');
images.forEach((image, index) => {
image.style.left = `${Math.random() * 100}%`;
image.style.animationDuration = `${Math.random() * 3 + 2}s`;
});
</script>
</div>
<header class="header center">
<div class="header__logo">
<img class="header__img-logo" src="img/santa_hat.png" alt="Шапка санты">
<a class="header__top" href="index.html">
<img class="logo__img" src="img/grain.svg" alt="logo"></a>
</div>
<nav class="header__inform">
<a class="header__inform__link" href="#about-us">О нас</a>
<a class="header__inform__link" href="menu.html">Меню</a>
<a class="header__inform__link" href="#footer">Отзывы</a>
<a class="header__inform__link" href="#footer">Контакты</a>
</nav>
<button class="header__inform__button">
Связаться
</button>
</header>
<section class="content center">
<div class="content__img">
<img class="img__coffe_beans" src="img/coffee_beans.png" alt="Кофейные зерна">
<img class="img__cup" src="img/Cup_Of_Coffee.png" alt="Чашка кофе">
<img class="img__cookies" src="img/cookies_with_chokolate.png" alt="Печенье с шоколадной крошкой">
<img class="img__synabon" src="img/synabon.png" alt="Синабон">
</div>
<div class="content__explain center" id="about-us">
<h1 class="content__title">Добро пожаловать в «Зернышко»</h1>
<p class="content__subtitle">Ароматный кофе и уютная атмосфера каждый день
</p>
<p class="content__text center">
Мы готовим кофе с душой и верим, что каждая чашка — это маленькое наслаждение, созданное для вас.
</p>
<p class="content__text">Мы предлагаем свежие зерна, уникальные авторские рецепты и заботу о природе. Наши
бариста рады подарить
вам
вкус и уют, из-за которых захочется возвращаться снова и снова.
</p>
<a class="content__link center" href="menu.html">Посмотреть меню</a>
</div>
</section>
<footer class="footer center" id="footer">
<a href="index.html" class="footer__logo">
<img src="img/grain.svg" alt="logo">
</a>
<div class="footer__content">
<div class="footer__info">
<nav class="footer__item">
<h3 class="footer__title">Навигация</h3>
<a href="index.html" class="footer__link">Главная</a>
<a href="menu.html" class="footer__link">Меню</a>
</nav>
<div class="footer__item">
<h3 class="footer__title">Контакты</h3>
<a href="tel:++7 908 800 80 80" class="footer__link">+7 908 800 80 80</a>
<a href="mailto:coffee-shop@grain.com" class="footer__link">coffee-shop@grain.com</a>
<div class="footer__icons">
<a href="#"><svg width="24.000504" height="14.000000" viewBox="0 0 24.0005 14" fill="none"
xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<desc>
Created with Pixso.
</desc>
<defs />
<path id="Vector"
d="M23.45 0.94C23.61 0.4 23.45 0 22.65 0L20.03 0C19.36 0 19.05 0.34 18.88 0.72C18.88 0.72 17.55 3.92 15.66 6C15.04 6.6 14.77 6.79 14.43 6.79C14.27 6.79 14.01 6.6 14.01 6.05L14.01 0.94C14.01 0.29 13.83 0 13.27 0L9.15 0C8.73 0 8.48 0.3 8.48 0.59C8.48 1.21 9.42 1.35 9.52 3.1L9.52 6.9C9.52 7.73 9.37 7.88 9.03 7.88C8.14 7.88 5.98 4.67 4.69 1C4.44 0.28 4.19 0 3.52 0L0.9 0C0.15 0 0 0.34 0 0.72C0 1.41 0.88 4.8 4.14 9.28C6.31 12.34 9.37 14 12.15 14C13.82 14 14.02 13.63 14.02 12.99L14.02 10.68C14.02 9.94 14.18 9.8 14.71 9.8C15.1 9.8 15.77 9.99 17.33 11.46C19.11 13.21 19.4 14 20.4 14L23.03 14C23.78 14 24.15 13.63 23.94 12.9C23.7 12.18 22.85 11.12 21.72 9.88C21.11 9.17 20.19 8.4 19.91 8.02C19.52 7.53 19.63 7.31 19.91 6.87C19.91 6.87 23.11 2.45 23.44 0.94L23.45 0.94Z"
fill="#888888" fill-opacity="1.000000" fill-rule="evenodd" />
</svg>
</a>
<a href="#"><svg width="21.000000" height="17.675659" viewBox="0 0 21 17.6757" fill="none"
xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<desc>
Created with Pixso.
</desc>
<defs />
<path id="Vector"
d="M19.29 0.2L0.69 7.41C-0.06 7.74 -0.32 8.42 0.5 8.78L5.28 10.31L16.82 3.14C17.45 2.69 18.09 2.81 17.54 3.3L7.63 12.32L7.31 16.14C7.6 16.73 8.13 16.73 8.47 16.44L11.21 13.83L15.91 17.37C17 18.02 17.59 17.6 17.83 16.41L20.91 1.74C21.23 0.28 20.68 -0.37 19.29 0.2Z"
fill="#888888" fill-opacity="1.000000" fill-rule="nonzero" />
</svg>
</a>
<a href="#"><svg width="19.000000" height="18.000000" viewBox="0 0 19 18" fill="none"
xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<desc>
Created with Pixso.
</desc>
<defs />
<path id="Vector"
d="M11.33 10.73C9.83 12.19 9.73 14.01 9.6 18C13.52 18 16.23 17.98 17.62 16.7C18.98 15.37 19 12.68 19 9.09C14.79 9.22 12.87 9.32 11.33 10.73ZM0 9.09C0 12.68 0.01 15.37 1.37 16.7C2.76 17.98 5.47 18 9.39 18C9.26 14.01 9.16 12.19 7.66 10.73C6.12 9.32 4.2 9.21 0 9.09ZM9.39 0C5.48 0 2.76 0.01 1.37 1.29C0.01 2.62 0 5.31 0 8.9C4.2 8.77 6.12 8.67 7.66 7.26C9.16 5.8 9.26 3.98 9.39 0ZM11.33 7.26C9.83 5.8 9.73 3.98 9.6 0C13.52 0 16.23 0.01 17.62 1.29C18.98 2.62 19 5.31 19 8.9C14.79 8.77 12.87 8.67 11.33 7.26Z"
fill="#888888" fill-opacity="1.000000" fill-rule="nonzero" />
</svg>
</a>
</div>
</div>
</div>
<form action="#" class="footer__form">
<p class="footer__text">
Получайте наши новости и обновления
</p>
<input class="footer__type" placeholder="Ваш e-mail" type="email" name="" id="">
<button class="footer__button">
Подписаться
</button>
</form>
</div>
</footer>
</body>
</html>