{% extends 'base.html' %}

{% block content %}
    <nav class="navbar navbar-expand-lg navbar-light bg-light">
        <div class="container-fluid">
            <a class="navbar-brand" href="#">Add Person</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 class="form-group">
            <div class="form-group mb-2">
                <label for="first_name_input">First Name: </label>
                <br>
                <input type="text" id="first_name_input" 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="last_name_input">Last Name: </label>
                <br>
                <input type="text" id="last_name_input" 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="favourite_category_option_select">Favourite Category: </label>
                <select name="dropdown_preference" id="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">Submit</button>
        </div>
    </form>
{% endblock %}