forgot.html

{% extends 'base.html' %}

<!-- TITLE -->
{% block title %} Forgot Password {% endblock %}

<!-- JS -->
{% block basejs %} {% endblock %}

<!-- CSS -->
{% block basecss %}
<link href="{{ url_for('static', filename='css/login/forgot.css') }}" rel="stylesheet" />
{% endblock %}

<!-- BODY -->
{% block basebody %}
<div class="container">
    <div class="container_box">
        <div class="title">
            <p class="title_text shadow">Trackmaster</p>
        </div>
        <div class="forgot">
            <p class="forgot_text">Forgot Password</p>
        </div>
        <div class="form">
            <form action="{{url_for('login.forgot_password')}}" method="POST">
                <div class="form_inside">
                    <div class="username">
                        <p class="username_text">ID:</p>
                        <br>
                        <input type="text" name="username">
                        {% if status == 'no_id' %}
                        <p class="error_text">Wrong ID</p>
                        {% elif status == 'empty_id' %}
                        <p class="error_text">Empty ID</p>
                        {% endif %}
                    </div>
                    <div class="dob">
                        <p class="dob_text">Birthday:</p>
                        <br>
                        <div>
                            <select name="day" id="day">
                                <option value="0" selected>Day</option>
                                {% for day in time[0] %}
                                <option value="{{day}}">{{day}}</option>
                                {% endfor %}
                            </select>
                            <select name="month" id="month">
                                <option value="0" selected>Month</option>
                                {% for month in time[1] %}
                                <option value="{{month.1}}">{{month.0}}</option>
                                {% endfor %}
                            </select>
                            <select name="year" id="year">
                                <option value="0" selected>Year</option>
                                {% for year in time[2] %}
                                <option value="{{year}}">{{year}}</option>
                                {% endfor %}
                            </select>
                        </div>
                        {% if status == 'wrong_date' %}
                        <p class="error_text">Wrong Date</p>
                        {% elif status == 'empty_bday' %}
                        <p class="error_text">Empty Date</p>
                        {% endif %}
                    </div>
                    <div class="password">
                        <p class="password_text">New Password:</p>
                        <br>
                        <input type="password" name="password">
                        {% if status == 'empty_pass' %}
                        <p class="error_text">Empty Password</p>
                        {% elif status == 'no_low' %}
                        <p class="error_text">Password should contain atleast 1 lowercase letter</p>
                        {% elif status == 'no_up' %}
                        <p class="error_text">Password should contain atleast 1 uppercase letter</p>
                        {% elif status == 'no_num' %}
                        <p class="error_text">Password should contain atleast 1 number</p>
                        {% elif status == 'no_sym' %}
                        <p class="error_text">Password should contain atleast 1 symbol</p>
                        {% elif status == 'weak' %}
                        <p class="error_text">Our experts recommend using a stronger password</p>
                        {% elif status == 'too_short' %}
                        <p class="error_text">Password is too short</p>
                        {% elif status == 'too_long' %}
                        <p class="error_text">Password is too long</p>
                        {% endif %}
                    </div>
                    <div class="r_password">
                        <input type="password" name="r_password">
                        {% if status == 'empty_rpass' %}
                        <p class="error_text">Empty Repeat Password</p>
                        {% elif status == 'pass_no_match' %}
                        <p class="error_text">Passwords don't match</p>
                        {% endif %}
                    </div>
                    <div class="forgot_button_area">
                        <button class="btn-3d blue" type="submit">Reset Password</button>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>
{% endblock %}