{% extends 'website/templates/base.html' %}
{% load widget_tweaks %}
{% load static %}
{% block title %}User Profile{% endblock %}
{% block cssblock %}<link rel="stylesheet" href="{% static 'website/css/chosen.min.css' %}" type="text/css" media="screen" charset="utf-8" />{% endblock %}
{% block heading %}
        <i class="fa fa-list-ul"></i> User Profile
{% endblock %}

{% block content %}
    <div class="row well ">
        <div class="col-sm-8">
            <form class="form-signin form-horizontal" role="form" id="login_form" method="post" enctype="multipart/form-data">{% csrf_token %}
                {{ form.errors }}
                <div class="form-group">
                    <label class="col-sm-3 control-label" for="id_first_name">First Name</label>
                    <div class="col-sm-9">
                        {% render_field form.first_name class+="form-control first_name" tabindex="1" data-placeholder="Choose first_name" %}
                        {{ form.first_name.errors }}
                        <small>Please enter your first name.</small>
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-sm-3 control-label" for="id_last_name">Last Name</label>
                    <div class="col-sm-9">
                        {% render_field form.last_name class+="form-control last_name" tabindex="1" data-placeholder="Choose last_name" %}
                        {{ form.last_name.errors }}
                        <small>Please enter your last name.</small>
                    </div>
                </div>
              
               
                <!--
                <div class="form-group">
                    <label class="col-sm-3 control-label" for="id_location">Location</label>
                    <div class="col-sm-9">
                        {% render_field form.location class+="form-control location" tabindex="1" data-placeholder="Enter location" %}
                        {{ form.location.errors }}
                    </div>
                </div>
                
                <div class="form-group">
                    <label class="col-sm-3 control-label" for="id_street">Street</label>
                    <div class="col-sm-9">
                        {% render_field form.street class+="form-control street" tabindex="1" data-placeholder="Choose street" %}
                        {{ form.street.errors }}
                    </div>
                </div>
                -->
                <div class="form-group">
                    <label class="col-sm-3 control-label" for= "id_street">Address</label>
                    <div class="col-sm-9">
                        {% render_field form.address class+="form-control street" tabindex="1" data-placeholder="Enter street" %}
                        {{ form.address.errors }}
                        <small>Please enter your valid address.</small>
                    </div>
                </div>
               
             
                <div class="form-group">
                    <label class="col-sm-3 control-label" for="id_phone">Phone</label>
                    <div class="col-sm-9">
                        {% render_field form.phone class+="form-control phone" tabindex="1" data-placeholder="Choose phone" %}
                        {{ form.phone.errors }}
                        <small>Please enter your valid phone number.</small>
                    </div>
                </div>
                {# <div class="form-group"> #}
                {#     <label class="col-sm-3 control-label" for="id_phone">Picture</label> #}
                {#     <div class="col-sm-9"> #}
                {#         {% render_field form.picture class+="form-control picture" tabindex="1" %} #}
                {#         {{ form.picture.errors }} #}
                {#     </div> #}
                {# </div> #}
                <div class="form-group">
                    <div class="col-sm-offset-3 col-sm-9">
                        <input class="btn btn-primary" type="submit" value="Submit" />
                    </div>
                </div>
            </form>
        </div>
    </div>
    
{% endblock %}