Authentication pages
This commit is contained in:
parent
2be89b6901
commit
fa65947965
@ -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
|
||||||
|
@ -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>
|
||||||
|
|
||||||
|
@ -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 %}
|
||||||
|
|
||||||
|
@ -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 %}
|
||||||
|
|
||||||
|
@ -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 %}
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user