{% extends 'layout.html' %}

{% block body %}

    <div class="row">
        <div class="col">
            
            <div id="header">
                <h5 id="add-label-label">Add new label</h5>
            </div>

            <div id="body">
                <form>
                    <div class="form-group">
                        <label for="label-name" class="col-form-label">Name:</label>
                        <input type="text" class="form-control" id="label-name">
                      </div>
                      <div class="form-group">
                        <label for="label-color" class="col-form-label">Color:</label>
                        <input type="text" class="form-control" id="label-color">
                      </div>
                      <div class="form-group">
                        <label for="label-description" class="col-form-label">Description:</label>
                        <textarea class="form-control" id="label-description"></textarea>
                      </div>
                </form>
            </div>

            <div id="footer">
                <a class="btn btn-secondary" href="{{ url_for('index') }}">Close</a>
                <button type="button" class="btn btn-primary" onclick="var link = '{{ url_for('add_label') }}'; addLabel(link);">Ok</button>
            </div>

        </div>
    </div>

{% endblock %}