{% extends 'base.html' %}

{% block content %}
<nav class="navbar navbar-expand-lg navbar-light bg-light">
    <div class="container-fluid">
        <a class="navbar-brand" href="#">WBD - Register</a>
        <ul class="navbar-nav me-auto mb-2 mb-lg-0">
            <li class="nav-item">
                <!-- <a class="nav-link active" aria-current="page" href="{{url_for('index')}}">Home</a> -->
              </li>
        </ul>
    </div>
</nav>
    <form method="post" class="mt-3 ms-3 w-25">
        <div>

            <div class="form-group mb-2">
                <label for="username">Username</label>
                <br>
                <input type="text" id="username" name="username"
                    placeholder="Username"
                    value="{{ request.form['user_name'] }}" class="form-control h-25 shadow-none"></input>
            </div>

            <div class="form-group mb-2">
                <label for="firstName">First Name</label>
                <br>
                <input type="text" id="firstName" name="first_name"
                    placeholder="First Name"
                    value="{{ request.form['first_name'] }}" class="form-control h-25 shadow-none"></input>
            </div>

            <div class="form-group mb-2">
                <label for="lastName">Last Name</label>
                <br>
                <input type="text" id="lastName" name="last_name"
                    placeholder="Last Name"
                    value="{{ request.form['last_name'] }}" class="form-control h-25 shadow-none"></input>
            </div>

            <div class="form-group mb-2">
                <label for="pass">Password</label>
                <br>
                <input type="password" id="pass" name="passwrd"
                    placeholder="Password"
                    value="{{ request.form['pass'] }}" class="form-control h-25 shadow-none"></input>
            </div>
            
            <div class="form-group mb-2">
                <label for="add_favourite_category_option_select">Favourite Category: </label>
                <select name="dropdown_preference" id="add_favourite_category_option_select" class="form-select w-30 h-25 shadow-none">
                    <option value="1">Art Museums</option>
                    <option value="2">Arboretums, Botanical Gardens, & Nature Centers</option>
                    <option value="3">Children's Museums</option>
                    <option value="4">Uncategorized or General Museums</option>
                    <option value="5">Historical Societies, Historic Preservation</option>
                    <option value="6">History Museums</option>
                    <option value="7">Natural History & Natural Science Museums</option>
                    <option value="8">Science & Technology Museums & Planetariums</option>
                    <option value="9">Zoos, Aquariums, & Wildlife Conservation</option>        
                </select>
            </div>
            <button type="submit" class="btn btn-outline-primary">Sign Up</button>
            <br>
            <small class="form-text text-muted mb-3">
                <a href="{{url_for('login')}}" class="form-text text-muted mb-3"> 
                    Already signed up?
                </a>
            </small> 
        </div>
    </form>
{% endblock %}