164 lines
4.8 KiB
HTML
164 lines
4.8 KiB
HTML
<!doctype html>
|
||
<html lang="ru">
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||
<title>Кофе бум — меню кофейни</title>
|
||
<style>
|
||
* { margin: 0; padding: 0; box-sizing: border-box; }
|
||
body {
|
||
font-family: -apple-system, "Segoe UI", Roboto, sans-serif;
|
||
background: #1a1a1d;
|
||
color: #f4f4f5;
|
||
line-height: 1.6;
|
||
}
|
||
.hero {
|
||
background: linear-gradient(135deg, #2d2d30 0%, #1a1a1d 100%);
|
||
padding: 60px 20px;
|
||
text-align: center;
|
||
border-bottom: 3px solid #c9a55c;
|
||
}
|
||
.hero h1 {
|
||
font-size: clamp(32px, 8vw, 64px);
|
||
color: #c9a55c;
|
||
margin-bottom: 10px;
|
||
}
|
||
.hero p {
|
||
font-size: clamp(16px, 4vw, 20px);
|
||
color: #a8a8ad;
|
||
}
|
||
.container {
|
||
max-width: 800px;
|
||
margin: 0 auto;
|
||
padding: 40px 20px;
|
||
}
|
||
.section-title {
|
||
font-size: clamp(24px, 6vw, 36px);
|
||
color: #c9a55c;
|
||
margin: 40px 0 20px;
|
||
padding-bottom: 10px;
|
||
border-bottom: 2px solid #3d3d40;
|
||
}
|
||
.menu-item {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: baseline;
|
||
padding: 15px 0;
|
||
border-bottom: 1px dashed #3d3d40;
|
||
}
|
||
.menu-item:last-child {
|
||
border-bottom: none;
|
||
}
|
||
.menu-item-name {
|
||
font-size: clamp(18px, 4vw, 22px);
|
||
font-weight: 500;
|
||
color: #f4f4f5;
|
||
}
|
||
.menu-item-price {
|
||
font-size: clamp(18px, 4vw, 22px);
|
||
font-weight: 600;
|
||
color: #c9a55c;
|
||
white-space: nowrap;
|
||
margin-left: 20px;
|
||
}
|
||
.footer {
|
||
text-align: center;
|
||
padding: 40px 20px;
|
||
background: #2d2d30;
|
||
margin-top: 40px;
|
||
}
|
||
.footer p {
|
||
color: #a8a8ad;
|
||
margin: 5px 0;
|
||
}
|
||
.footer .accent {
|
||
color: #c9a55c;
|
||
font-weight: 600;
|
||
}
|
||
</style>
|
||
</head>
|
||
<body>
|
||
<div class="hero">
|
||
<h1>☕ Кофе бум</h1>
|
||
<p>Уютная кофейня с душой</p>
|
||
</div>
|
||
|
||
<div class="container">
|
||
<h2 class="section-title">Кофе</h2>
|
||
<div class="menu-items">
|
||
<div class="menu-item">
|
||
<span class="menu-item-name">Латте</span>
|
||
<span class="menu-item-price">1 100 ₸</span>
|
||
</div>
|
||
<div class="menu-item">
|
||
<span class="menu-item-name">Капучино</span>
|
||
<span class="menu-item-price">1 100 ₸</span>
|
||
</div>
|
||
<div class="menu-item">
|
||
<span class="menu-item-name">Американо</span>
|
||
<span class="menu-item-price">900 ₸</span>
|
||
</div>
|
||
<div class="menu-item">
|
||
<span class="menu-item-name">Эспрессо</span>
|
||
<span class="menu-item-price">800 ₸</span>
|
||
</div>
|
||
<div class="menu-item">
|
||
<span class="menu-item-name">Флэт уайт</span>
|
||
<span class="menu-item-price">1 200 ₸</span>
|
||
</div>
|
||
<div class="menu-item">
|
||
<span class="menu-item-name">Раф</span>
|
||
<span class="menu-item-price">1 400 ₸</span>
|
||
</div>
|
||
</div>
|
||
|
||
<h2 class="section-title">Пироги и десерты</h2>
|
||
<div class="menu-items">
|
||
<div class="menu-item">
|
||
<span class="menu-item-name">Вишнёвый пирог</span>
|
||
<span class="menu-item-price">1 500 ₸</span>
|
||
</div>
|
||
<div class="menu-item">
|
||
<span class="menu-item-name">Яблочный пирог</span>
|
||
<span class="menu-item-price">1 500 ₸</span>
|
||
</div>
|
||
<div class="menu-item">
|
||
<span class="menu-item-name">Шоколадный брауни</span>
|
||
<span class="menu-item-price">1 300 ₸</span>
|
||
</div>
|
||
<div class="menu-item">
|
||
<span class="menu-item-name">Чизкейк</span>
|
||
<span class="menu-item-price">1 600 ₸</span>
|
||
</div>
|
||
<div class="menu-item">
|
||
<span class="menu-item-name">Круассан</span>
|
||
<span class="menu-item-price">900 ₸</span>
|
||
</div>
|
||
</div>
|
||
|
||
<h2 class="section-title">Дополнительно</h2>
|
||
<div class="menu-items">
|
||
<div class="menu-item">
|
||
<span class="menu-item-name">Сироп (ваниль, карамель, орех)</span>
|
||
<span class="menu-item-price">200 ₸</span>
|
||
</div>
|
||
<div class="menu-item">
|
||
<span class="menu-item-name">Взбитые сливки</span>
|
||
<span class="menu-item-price">300 ₸</span>
|
||
</div>
|
||
<div class="menu-item">
|
||
<span class="menu-item-name">Альтернативное молоко</span>
|
||
<span class="menu-item-price">400 ₸</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="footer">
|
||
<p class="accent">Ждём вас в гости!</p>
|
||
<p>📍 Адрес: уточняется</p>
|
||
<p>📞 Телефон: уточняется</p>
|
||
<p>⏰ Режим работы: уточняется</p>
|
||
</div>
|
||
</body>
|
||
</html>
|