{% extends 'base.html' %}


{% block content %}

<div class="container mt-4">
    
    <div class="p-3 m-3">

        
        <div class="col-lg-5 rounded mx-auto border pt-4">
            <div class="text-center col">
            
                <img
                src="https://skillindiacsc.in/wp-content/uploads/2022/12/Skill-India-Online-Shopping.png" alt=""
                class="" style="height: 150px;">
            <!-- <hr> -->
            <hr>
            </div>
            <h3 class="alert alert-success rounded-pill" style="text-align:center">Create an Account</h3>
            <form action="/signup" method="POST">
                
                {% csrf_token %}

                {% if error%}
                <div class="alert alert-danger" role="alert">
                    {{error}}
                </div>
                {% endif %}
                <!-- firstname -->
                <div class="form-group">
                    <label for="">First Name</label>
                    <input type="text" name="firstname"
                     id="" value="{{values.first_name}}" class="form-control form-control-sm" 
                     placeholder="">
                </div>

                <!-- last name -->
                <div class="form-group">
                    <label for="">Last Name</label>
                    <input type="text" name="lastname" 
                    id="" value="{{values.last_name}}" class="form-control form-control-sm"
                    >
                </div>

                <!-- phone -->
                <div class="form-group">
                    <label for="">Phone</label>
                    <input type="text" name="phone" 
                    id="" class="form-control form-control-sm"
                    value="{{values.phone}}"
                    placeholder="9876543210"
                    >
                </div>
                <!-- email -->
                <div class="form-group">
                    <label for="">Email</label>
                    <input required type="email" name="email" id=""
                    value="{{values.email}}" 
                    class=" form-control-sm form-control" placeholder="abc@gmail.com">
                </div>


                <!-- password -->
                <div class="form-group">
                    <label for="">Password</label>
                    <input type="password" 
                    name="password" 
                    id=""
                     class="form-control form-control-sm">
                </div>

                <!--Checkme button-->
                <div class="mb-3 form-check">
                    <input type="checkbox" class="form-check-input" id="exampleCheck1">
                    <label class="form-check-label d-grid gap-2" for="exampleCheck1">Check me out</label>
                </div>
                <hr>
                <button type="submit" class="btn btn-sm btn-success col-lg-12">Create an account</button>

            </form>
        </div>
    </div>
</div>

{% endblock %}