Authentication pages

This commit is contained in:
Piotr Kopycki 2021-12-10 15:39:22 +01:00
parent 2be89b6901
commit fa65947965
5 changed files with 90 additions and 23 deletions

View File

@ -28,21 +28,66 @@
padding: 0px 10px; padding: 0px 10px;
} }
.authBox { .authContent {
height: 100px; top: 50%;
width: 100px; left: 50%;
position: absolute;
width: 400px;
height: 550px;
padding: 80px 40px;
background-color: #FEEFE5; background-color: #FEEFE5;
color: #111; -webkit-transform: translate(-50%,-50%);
padding: 250px 300px 0px 300px; -moz-transform: translate(-50%,-50%);
position: relative; -ms-transform: translate(-50%,-50%);
-o-transform: translate(-50%,-50%);
transform: translate(-50%,-50%);
color: #2B3D41;
} }
.authContent { .authContent h2 {
background-color:#FA003F margin: 0;
padding: 250px 300px 0px 300px; padding: 0 0 20px;
height: 100%; text-align: center;
text-transform: uppercase;
}
.authContent p {
margin: 0;
padding: 0;
font-weight: bold;
line-height: 1.5;
}
.authContent input {
width: 100%; width: 100%;
position: absolute; margin-bottom: 20px;
}
.authContent input[type=text],
.authContent input[type=email],
.authContent input[type=password]{
border: none;
border-bottom: 1px solid #2B3D41;;
background: transparent;
outline: none;
height: 35px;
color: #2B3D41;;
}
.authContent input[type=submit]{
height: 30px;
color: #FFF;
font-size: 15px;
background: #00916E;
cursor: pointer;
border-radius: 25px;
border: none;
outline: none;
margin-top: 15px;
}
input[type=checkbox]{
width: 20%;
} }
.titleBar { .titleBar {
@ -59,4 +104,6 @@
font-size: 30px; font-size: 30px;
color: #FEEFE5; color: #FEEFE5;
display: block; display: block;
} }
background-color:#FA003F

View File

@ -8,15 +8,13 @@
<meta name="description" content="{% block description %}{% endblock %}"> <meta name="description" content="{% block description %}{% endblock %}">
</head> </head>
<body> <body style="background-color: #FA003F">
<div class="titleBar"> <div class="titleBar">
SOITA SOITA
</div> </div>
<div name="content", class="authContent"> <div class="authContent">
<div name="box", class="authBox"> {% block content %}
{% block content %} {% endblock %}
{% endblock %}
</div>
</div> </div>
</body> </body>

View File

@ -1,8 +1,16 @@
{% extends "authBase.html" %} {% extends "authBase.html" %}
{% block title %}Login{% endblock %} {% block title %}Log In{% endblock %}
{% block content %} {% block content %}
Login <h2>Log In</h2>
<form action="">
<p>Email</p>
<input type="email" placeholder="Enter Email">
<p>Password</p>
<input type="password" placeholder="Enter Password">
<input type="submit" value="Log in">
<p><input type="checkbox">Remember Me</p>
</form>
{% endblock %} {% endblock %}

View File

@ -1,8 +1,8 @@
{% extends "authBase.html" %} {% extends "authBase.html" %}
{% block title %}Logout{% endblock %} {% block title %}Log Out{% endblock %}
{% block content %} {% block content %}
Logout <p>You have been logged out successfully</p>
{% endblock %} {% endblock %}

View File

@ -3,6 +3,20 @@
{% block title %}Create account{% endblock %} {% block title %}Create account{% endblock %}
{% block content %} {% block content %}
Create account <h2>Register</h2>
<form action="">
<p>First Name</p>
<input type="text" placeholder="Enter First Name">
<p>Last Name</p>
<input type="text" placeholder="Enter Last Name">
<p>Email</p>
<input type="email" placeholder="Enter Email">
<p>Password</p>
<input type="password" placeholder="Enter Password">
<p>Repeat password</p>
<input type="password" placeholder="Enter Password">
<input type="submit" value="Crete account">
<p><input type="checkbox">Remember Me</p>
</form>
{% endblock %} {% endblock %}