{% extends "base.html" %}
{% load static %}
{% block content %}
<main class="main-body">
<section class="inner-banner" style="background: url('{% static 'images/inner-banner.png' %}')">
<div class="container">
<div class="row">
<div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
<div class="inner-banner-box">
<div class="inner-banner-text">
<h1>Sign-Up As a Customer</h1>
<p>Connect with us</p>
</div>
</div>
</div>
</div>
</div>
</section>
<div class="clearfix"></div>
<section class="contact-section sign-up-section">
<div class="container">
<div class="row">
<div class="col-xs-12 col-sm-12 col-md-12 col-lg-10 col-lg-offset-1">
{{ error }}
<form class="forms form-section" id="user_register" action="" method="post">
{% csrf_token %}
<div class="row">
<div class="col-xs-12 col-sm-12 col-md-6 col-lg-6">
<div class="row form-group">
<div class="col-xs-12 col-sm-12 col-md-3 col-lg-3">
<label>Username</label>
</div>
<div class="col-xs-12 col-sm-12 col-md-9 col-lg-9">
<input type="text" class="form-control form-control-user" placeholder="Choose a username..." name="username" value="{{ form.username.value }}">
{{ form.username.errors }}
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-xs-12 col-sm-12 col-md-6 col-lg-6">
<div class="row form-group">
<div class="col-xs-12 col-sm-12 col-md-3 col-lg-3">
<label>First Name</label>
</div>
<div class="col-xs-12 col-sm-12 col-md-9 col-lg-9">
<input type="text" class="form-control form-control-user" placeholder="Enter First Name..." name="first_name" value="{{ form.first_name.value }}">
{{ form.first_name.errors }}
</div>
</div>
</div>
<div class="col-xs-12 col-sm-12 col-md-6 col-lg-6">
<div class="row form-group">
<div class="col-xs-12 col-sm-12 col-md-3 col-lg-3">
<label>Last Name</label>
</div>
<div class="col-xs-12 col-sm-12 col-md-9 col-lg-9">
<input type="text" class="form-control form-control-user" placeholder="Enter Last Name..." name="last_name" value="{{ form.last_name.value }}">
{{ form.last_name.errors }}
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-xs-12 col-sm-12 col-md-6 col-lg-6">
<div class="row form-group">
<div class="col-xs-12 col-sm-12 col-md-3 col-lg-3">
<label>Email</label>
</div>
<div class="col-xs-12 col-sm-12 col-md-9 col-lg-9">
<input type="email" class="form-control form-control-user" placeholder="Enter Email Address..." name="email" value="{{ form.email.value }}">
{{ form.email.errors }}
</div>
</div>
</div>
<div class="col-xs-12 col-sm-12 col-md-6 col-lg-6">
<div class="row form-group">
<div class="col-xs-12 col-sm-12 col-md-3 col-lg-3">
<label>Mobile No.</label>
</div>
<div class="col-xs-12 col-sm-12 col-md-9 col-lg-9">
<input type="text" class="form-control form-control-user" placeholder="Enter Mobile Number..." name="phone_number" value="{{ form.phone_number.value }}">
{{ form.phone_number.errors }}
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-xs-12 col-sm-12 col-md-6 col-lg-6">
<div class="row form-group">
<div class="col-xs-12 col-sm-12 col-md-3 col-lg-3">
<label>Password</label>
</div>
<div class="col-xs-12 col-sm-12 col-md-9 col-lg-9">
<input type="password" class="form-control form-control-user" placeholder="Enter Password..." name="password1" value="{{ form.password.value }}">
{{ form.password1.errors }}
</div>
</div>
</div>
<div class="col-xs-12 col-sm-12 col-md-6 col-lg-6">
<div class="row form-group">
<div class="col-xs-12 col-sm-12 col-md-3 col-lg-3">
<label>Confirm Password</label>
</div>
<div class="col-xs-12 col-sm-12 col-md-9 col-lg-9">
<input type="password" class="form-control form-control-user" placeholder="Re-enter Password..." name="password2" value="{{ form.confirm_password.value }}">
{{ form.password2.errors }}
</div>
</div>
</div>
</div>
<div class="row form-group">
<div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
<center>
<button type="submit" name="sign_up" class="submit-all-btn">Sign-Up <i class="fa fa-long-arrow-right" aria-hidden="true"></i></button>
</center>
</div>
</div>
</form>
</div>
</div>
</div>
</section>
<div class="clearfix"></div>
<a href="#" class="scrollup"><i class="fa fa-long-arrow-up" aria-hidden="true"></i></a>
</main>
{% endblock %}
</body>
</html>