Internet_Programming_PIbd-2.../registration.html
2023-11-13 19:15:21 +04:00

132 lines
7.2 KiB
HTML
Raw Permalink 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="ru">
<head>
<meta charset="utf-8">
<title>Регистрация</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<script type="module" src="./node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
<link href="./node_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet"/>
<link href="./node_modules/@fortawesome/fontawesome-free/css/all.min.css" rel="stylesheet"/>
<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:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,800;0,900;1,700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="./style.css">
</head>
<body class="d-flex flex-column min-vh-100 bg-white">
<header class="w-100 position-sticky top-0">
<nav class="navbar navbar-expand-lg navbar-light">
<div class="container-md">
<a class="navbar-brand me-lg-5 d-flex align-items-center" href="/" id="logo">
<img src="icons/logo.png" alt="logo" class="me-2">
Читай-комната
</a>
<button class="navbar-toggler ms-auto" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav"
aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="navbar-collapse collapse" id="navbarNav">
<ul class="navbar-nav align-items-lg-center justify-content-lg-start w-100">
<li class="header-link nav-item ms-lg-2 me-lg-3">
<a class="nav-link" href="./index.html">Главная</a>
</li>
<li class="header-link nav-item me-lg-3">
<a class="nav-link" href="./catalog.html">Каталог</a>
</li>
<li class="header-link nav-item me-lg-5" id="header-contacts">
<a class="nav-link" href="./contacts.html">Контакты</a>
</li>
<div class="flex-grow-1 me-lg-4" id="header-search">
<input class="form-control h-25" type="search" placeholder="Я ищу..." aria-label="Search" id="search-bar">
</div>
<li class="nav-item">
<a class="nav-link" href="./login.html">
Вход
</a>
</li>
<p class="d-none d-lg-block">
/
</p>
<li class="nav-item me-lg-3">
<a class="nav-link active" aria-current="page" href="./registration.html">
Регистрация
</a>
</li>
<li class="nav-item">
<a class="nav-link pe-lg-0" href="./cart.html">
<img src="icons/card.png" alt="card" width="30" height="35" id="cart-icon">
</a>
</li>
</ul>
</div>
</div>
</nav>
</header>
<main class="container-md d-flex flex-column flex-grow-1 my-0">
<div class="row gy-3 justify-content-center">
<div class="col-12 mt-4">
<div class="block d-flex justify-content-center mb-3 mb-sm-4" id="reg-title">
Регистрация
</div>
</div>
<form class="col-lg-8 col-xl-7 col-xxl-6 m-0 mt-2 mt-sm-3 d-flex flex-column gap-2" action="./registration.html" method="get">
<div class="d-flex justify-content-center mb-3 mb-sm-4">
<input type="text" class="form-control w-75 border-black" id="reg-input-name" placeholder="Имя пользователя" required>
</div>
<div class="d-flex justify-content-center mb-3 mb-sm-4">
<input type="email" class="form-control w-75 border-black" id="reg-input-email" placeholder="Адрес электронной почты" required>
</div>
<div class="d-flex justify-content-center mb-3 mb-sm-4">
<input type="password" class="reg-input-password form-control w-75 border-black" placeholder="Пароль" required>
</div>
<div class="d-flex justify-content-center mb-3 mb-sm-4">
<input type="password" class="reg-input-password form-control w-75 border-black" placeholder="Подтвердите пароль" required>
</div>
<div class="text-center">
<button class="btn btn-primary w-50 rounded-5" type="submit" id="reg-btn">Создать аккаунт</button>
</div>
</form>
</div>
</main>
<footer class="footer flex-shrink-0">
<div class="container-md" id="footer-container">
<div class="row d-flex align-items-center gy-3 gy-lg-0 gx-0" id="footer-row">
<div class="col-md-6 col-lg-4">
<div class="block d-flex justify-content-center justify-content-md-start" id="footer-copyright">
© И. А. Родионов, 2023.
</div>
</div>
<div class="col-md-6 col-lg-3">
<div class="block d-flex align-items-center justify-content-center justify-content-md-end">
<img src="icons/telephone-call.png" class="me-2" alt="telephone-call" width="32" height="32">
<p id="footer-phone-number-text">
+7 927 818-61-60
</p>
</div>
</div>
<div class="col-md-12 col-lg-5 mb-3 mb-lg-0">
<div class="block d-flex align-items-center justify-content-center justify-content-lg-end">
<p class="me-3" id="footer-social-media-text">
Мы в соцсетях:
</p>
<a class="me-3" href="/">
<img src="icons/vk.png" alt="vk" width="32" height="32">
</a>
<a class="me-3" href="/">
<img src="icons/youtube.png" alt="youtube" width="32" height="32">
</a>
<a class="me-3" href="/">
<img src="icons/telegram.png" alt="telegram" width="32" height="32">
</a>
<a href="/">
<img src="icons/odnoklassniki.png" alt="odnoklassniki" width="32" height="32">
</a>
</div>
</div>
</div>
</div>
</footer>
</body>
</html>