{% import "macros.html" as macros %}
<p style="margin:-18px 0 0 42px; color: brown; font-size: 13px; font-style: italic"
    class="tag-editor-error-alert"
>
    <span for="id_tags" generated="true" class="form-error" style="float: left;"></span>
</p>
<div class="tag-editor" style="margin-top: 18px">{# there's a hack with the margin in js as well #}
    {{ macros.tag_list_widget(
                        tag_names,
                        deletable = True,
                        make_links = False
                    )
    }}
    <input
        class="new-tags-input"
        type="text"
        name="new_tags_input"
    />
    <div class="clearfix"></div>
    <input 
        id="id_tags"
        name="tags"
        type="hidden"
        value="{% if tag_names %}{{ tag_names|join(' ')|escape }}{% endif %}"
    />
    {# 
        tag input is hidden because we want to edit the list visually 
        we also want to eventually allow multiword tags, which are
        not easy to enter into a simple input box
    #}
</div>
