Files
template-for-verstka/ui_kit.html
2024-10-04 18:12:43 +03:00

137 lines
4.5 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!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>UI kit</title>
<link rel="stylesheet" type="text/css" href="/assets/css/gp-style-core.css">
</head>
<style>
/* Стили для выравнивания UI-элеметнов для данной страницы */
.ui__ui-wrapper{
display: grid;
grid-template-columns: repeat(4, 1fr);
grid-column-gap: 30px;
grid-row-gap: 30px;
width: 100vw;
min-height: 100vh;
}
.ui,
.ui__item{
display: flex;
justify-content: center;
align-items: center;
}
/* ВСЕ ОСТАЛЬНЫЕ СТИЛИ ПИШЕМ В style-core.css!!! */
</style>
<body class="ui">
<!-- <div class="lang">
<button class="lang__open">
RU
</button>
<div class="lang__content">
<ul class="lang__list">
<li class="lang__item active">
<a href="#" class="lang__link">
RU
</a>
</li>
<li class="lang__item">
<a href="#" class="lang__link">
EN
</a>
</li>
<li class="lang__item">
<a href="#" class="lang__link">
AR
</a>
</li>
</ul>
</div>
</div> -->
<!-- <div class="mini-profile">
<div class="mini-profile__item">
<div class="lang">
<button class="lang__open">
RU
</button>
<div class="lang__content">
<ul class="lang__list">
<li class="lang__item active">
<a href="#" class="lang__link">
RU
</a>
</li>
<li class="lang__item">
<a href="#" class="lang__link">
EN
</a>
</li>
<li class="lang__item">
<a href="#" class="lang__link">
AR
</a>
</li>
</ul>
</div>
</div>
</div>
<div class="mini-profile__item">
<a href="" class="mini-profile__button">
<img src="assets/img/svg/mini-profile/profile.svg" alt="" class="mini-profile__icon">
</a>
</div>
<div class="mini-profile__item">
<button class="mini-profile__button">
<img src="assets/img/svg/mini-profile/basket.svg" alt="" class="mini-profile__icon">
</button>
</div>
</div> -->
<!-- <ul class="main-menu">
<li class="main-menu__item">
<a href="#" class="main-menu__link">ГЛАВНАЯ</a>
</li>
<li class="main-menu__item">
<a href="#" class="main-menu__link">О COSMOPET</a>
</li>
<li class="main-menu__item">
<a href="#" class="main-menu__link">ПРОИЗВОДСТВО</a>
</li class="main-menu__item">
<li class="main-menu__item">
<a href="#" class="main-menu__link">БЛОГ</a>
</li>
<li class="main-menu__item">
<button class="main-menu__button">
ПРОДУКЦИЯ
</button>
</li>
</ul> -->
<form class="form" method="post" action="/send-telegram.php">
<p class="form__title">
Форма обратной связи
</p>
<div class="form__item">
<input class="form__input" type="text" name="name" placeholder="Ваше имя" required>
</div>
<div class="form__item">
<input class="form__input" type="text" name="name" placeholder="Эл.почта" required>
</div>
<div class="form__item">
<textarea class="form__input form__input--textarea" name="" id="" placeholder="Текст обращения"></textarea>
</div>
<div class="form__item">
<input class="form__button" type="submit" value="Отправить">
</div>
</form>
<script src="/assets/js/gp-main.js"></script>
</body>
</html>