0.0.1 upd

This commit is contained in:
2023-06-22 16:27:36 +03:00
parent 2e4d72156c
commit 27dd698d88
8 changed files with 275 additions and 9 deletions

View File

@@ -0,0 +1,164 @@
/* Reset and base styles */
* {
padding: 0px;
margin: 0px;
border: none;
}
*,
*::before,
*::after {
box-sizing: border-box;
}
/* Links */
a, a:link, a:visited {
text-decoration: none;
color: black;
}
a:hover {
text-decoration: none;
}
/* Common */
aside, nav, footer, header, section, main {
display: block;
}
h1, h2, h3, h4, h5, h6, p {
font-size: inherit;
font-weight: inherit;
}
ul, ul li {
list-style: none;
}
img {
vertical-align: top;
}
img, svg {
max-width: 100%;
height: auto;
}
address {
font-style: normal;
}
/* Form */
input, textarea, button, select {
font-family: inherit;
font-size: inherit;
color: inherit;
background-color: transparent;
}
input::-ms-clear {
display: none;
}
button, input[type="submit"] {
display: inline-block;
box-shadow: none;
background-color: transparent;
background: none;
cursor: pointer;
}
input:focus, input:active,
button:focus, button:active {
outline: none;
}
button::-moz-focus-inner {
padding: 0;
border: 0;
}
label {
cursor: pointer;
}
legend {
display: block;
}
html, body{
height: 100%;
}
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;700&display=swap');
.header {
display: flex;
justify-content: space-between;
padding: 10px;
background: #F8F8F8;
font-family: Inter;
font-weight: 500;
font-size: 16px;
line-height: 22px;
color: black;
}
.header__section{
display: flex;
align-items: center;
}
.header__item{
padding: 10px 15px;
margin-left: 5px;
color: black;
}
.footer{
display: flex;
justify-content: space-between;
}
.content{
flex: 1 1 auto;
}
.wrapper{
min-height: 100vh;
display: flex;
flex-direction: column;
}
.reg_inputs{
column-count: 2;
justify-content: center;
width: 630px;
height: 100px;
left: 405px;
top: 330px;
}
.reg_inputs label{
display: block;
border: 1px solid #FF613A;
border-radius: 10px;
width: 305px;
height: 30px;
}
.reg_button{
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
padding: 20px 76px;
gap: 10px;
background: #FF613A;
border-radius: 10px;
box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.12);
}

21
static/js/header.js Normal file
View File

@@ -0,0 +1,21 @@
function SendRegistrationForm(el){
event.preventDefault()
let form = el.form;
let formData = new FormData(form);
$.ajax({
headers: { "X-CSRFToken": '{{csrf_token}}' },
url: '/ru/user_account/registration/',
type: "POST",
// async: true,
cache: false,
processData: false,
contentType: false,
// enctype: 'json',
data: formData,
success: function(data){
location.href = '/'
}
});
}

View File

@@ -0,0 +1 @@
<div class="content">Content</div>

View File

@@ -0,0 +1,35 @@
{% load i18n %}
<div class="footer">
<div class="footer__section">
<div class="footer__item footerLogo"> TWB </div>
<div class="footer__item footerButton"><a href="#">{% trans 'Подпишись и будь в курсе всех событий, а также получай подарки и бонусы от' %}Trip With Bonus</a></div>
<div class="footer__item footerInput"><input type="text" placeholder="Введите ваш e-mail"> </div>
<div class="footer__item footerInput"><input type="text" placeholder="Введите ваш e-mail"> </div>
</div>
<div class="footer__section">
<div class="footer__item footerButton"><a href="#"></a></div>
<div class="footer__item footerButton"><a href="#">{% trans 'Служба поддержки' %}</a></div>
<div class="footer__item footerButton"><a href="#">{% trans 'Регистрация' %}</a></div>
<div class="footer__item footerButton"><a href="#">{% trans 'Войти' %}</a></div>
</div>
<div class="footer__section">
<div class="footer__item footerButton"><a href="#"></a></div>
<div class="footer__item footerButton"><a href="#">{% trans 'Служба поддержки' %}</a></div>
<div class="footer__item footerButton"><a href="#">{% trans 'Регистрация' %}</a></div>
<div class="footer__item footerButton"><a href="#">{% trans 'Войти' %}</a></div>
</div>
<div class="footer__section">
<div class="footer__item footerButton"><a href="#"></a></div>
<div class="footer__item footerButton"><a href="#">{% trans 'Служба поддержки' %}</a></div>
<div class="footer__item footerButton"><a href="#">{% trans 'Регистрация' %}</a></div>
<div class="footer__item footerButton"><a href="#">{% trans 'Войти' %}</a></div>
</div>
<div class="footer__section">
<div class="footer__item footerButton"><a href="#"></a></div>
<div class="footer__item footerButton"><a href="#">{% trans 'Служба поддержки' %}</a></div>
<div class="footer__item footerButton"><a href="#">{% trans 'Регистрация' %}</a></div>
<div class="footer__item footerButton"><a href="#">{% trans 'Войти' %}</a></div>
</div>
</div>

View File

@@ -0,0 +1,15 @@
{% load i18n %}
<div class="header">
<div class="header__section">
<div class="header__item headerLogo"> TWB </div>
<div class="header__item headerButton"><a href="#">{% trans 'Перевезти посылку' %}</a></div>
<div class="header__item headerButton"><a href="#">{% trans 'Отправить посылку' %}</a></div>
</div>
<div class="header__section">
<div class="header__item headerButton"><a href="#"></a></div>
<div class="header__item headerButton"><a href="#">{% trans 'Служба поддержки' %}</a></div>
<div class="header__item headerButton"><a href="#">{% trans 'Регистрация' %}</a></div>
<div class="header__item headerButton"><a href="#">{% trans 'Войти' %}</a></div>
</div>
</div>

View File

@@ -0,0 +1,3 @@
{% load static %}
<script src='{% static "js/header.js" %}'></script>
<link rel="stylesheet" href="{% static 'css/styles.css' %}">

View File

@@ -3,8 +3,14 @@
<head>
<meta charset="UTF-8">
<title>Title</title>
{% include 'inter/meta.html' %}
</head>
<body>
<div class="wrapper">
{% include 'blocks/b_header.html' %}
{% include 'blocks/b_content.html' %}
{% include 'blocks/b_footer.html' %}
</div>
</body>
</html>

View File

@@ -1,10 +1,31 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
</body>
</html>
{% include 'inter/meta.html' %}
<div class="registration">
<h2>Регистрация</h2>
<div class="chosen_buttons">
<button>Перевозчик</button>
<button>Отправитель</button>
</div>
<form action="">
{% csrf_token %}
<div class="reg_inputs">
<label><input name="username" type="text" placeholder="Имя"></label>
<label><input name="email" type="text" placeholder="E-mail"></label>
<label><input name="password" type="text" placeholder="Пароль"></label>
<label><input name="surname" type="text" placeholder="Фамилия"></label>
<label><input name="tel" type="text" placeholder="Телефон"></label>
<label><input name="confirm password" type="text" placeholder="Подтвердить пароль"></label>
</div>
<input type="checkbox"> <p>Регистрируясь, я соглашаюсь с Лицензионным соглашениеми и Политикой конфиденциальности</p>
<div class="reg_button">
<button id="registration" onclick="SendRegistrationForm(this)"> Зарегистрироваться </button>
</div>
</form>
</div>