<script src="https://cdn.tailwindcss.com"></script>
<div class="space-y-10 divide-y divide-gray-900/10">
    <div class="grid grid-cols-1 gap-x-8 gap-y-8 md:grid-cols-3">
        <div class="px-4 sm:px-0">
            <h2 class="text-base font-semibold leading-7 text-gray-900">Update Tag</h2>
            <p class="mt-1 text-sm leading-6 text-gray-600">Update model fields.</p>
        </div>
        <form action="{% url 'tag_me:tagged-field-edit' taggedfieldmodel.id %}"
              method="post"
              class="mt-2 bg-white shadow-sm ring-1 ring-gray-900/5 sm:rounded-xl md:col-span-2">
            {% csrf_token %}
            <div class="px-4 py-6 sm:p-8">
                <div class="grid max-w-2xl grid-cols-1 gap-x-6 gap-y-8 sm:grid-cols-6">
                    <div class="col-span-full">
                        <label for="id_content"
                               class="block text-sm font-medium leading-6 text-gray-900">Content</label>
                        <div class="mt-1">
                            <span id="id_content"
                                  name="content"
                                  rows="3"
                                  class="block w-full rounded-md border-0 p-1.5 bg-gray-200 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6">{{ taggedfieldmodel.content }}</span>
                        </div>
                    </div>
                    <div class="col-span-full">
                        <label for="id_model_name"
                               class="block text-sm font-medium leading-6 text-gray-900">Model Name</label>
                        <div class="mt-1">
                            <span id="id_model_name"
                                  name="model_name"
                                  rows="3"
                                  class="block w-full rounded-md border-0 p-1.5 bg-gray-200 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6">{{ taggedfieldmodel.model_name }}</span>
                        </div>
                    </div>
                    <div class="col-span-full">
                        <label for="id_model_verbose_name"
                               class="block text-sm font-medium leading-6 text-gray-900">Model Verbose Name</label>
                        <div class="mt-1">
                            <span id="id_model_verbose_name"
                                  name="model_verbose_name"
                                  rows="3"
                                  class="block w-full rounded-md border-0 p-1.5 bg-gray-200 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6">{{ taggedfieldmodel.model_verbose_name }}</span>
                        </div>
                    </div>
                    <div class="col-span-full">
                        <label for="id_field_name"
                               class="block text-sm font-medium leading-6 text-gray-900">Field Name</label>
                        <div class="mt-1">
                            <span id="id_field_name"
                                  name="field_name"
                                  rows="3"
                                  class="block w-full rounded-md border-0 p-1.5 bg-gray-200 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6">{{ taggedfieldmodel.field_name }}</span>
                        </div>
                    </div>
                    <div class="col-span-full">
                        <label for="id_field_verbose_name"
                               class="block text-sm font-medium leading-6 text-gray-900">Field Verbose Name</label>
                        <div class="mt-1">
                            <span id="id_field_verbose_name"
                                  name="model_verbose_name"
                                  rows="3"
                                  class="block w-full rounded-md border-0 p-1.5 bg-gray-200 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6">{{ taggedfieldmodel.field_verbose_name }}</span>
                        </div>
                    </div>
                    <div class="col-span-full">
                        <label for="id_tag_type"
                               class="block text-sm font-medium leading-6 text-gray-900">Tag Type</label>
                        <div class="mt-1">
                            <span id="id_tag_type"
                                  name="model_verbose_name"
                                  rows="3"
                                  class="block w-full rounded-md border-0 p-1.5 bg-gray-200 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6">{{ taggedfieldmodel.tag_type }}</span>
                        </div>
                    </div>
                    <div class="col-span-full">
                        <label for="id_default_tags"
                               class="block text-sm font-medium leading-6 text-gray-900">Default Tags</label>
                        <div class="mt-1">
                            <input id="id_default_tags"
                                   name="default_tags"
                                   value="{{ taggedfieldmodel.default_tags }}"
                                   rows="3"
                                   class="block w-full rounded-md border-0 p-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6">
                        </input>
                    </div>
                    <p class="mt-3 text-sm leading-6 text-gray-600">
                        Tags must be enclosed inside the "
                        " and comma separated.
                    </p>
                </div>
            </div>
        </div>
        <div class="flex items-center justify-start gap-x-6 border-t border-gray-900/10 px-4 py-4 sm:px-8">
            <button type="button" class="text-sm font-semibold leading-6 text-gray-900">Cancel</button>
            <button type="submit"
                    class="rounded-md bg-indigo-600 px-3 py-2 text-sm font-semibold text-white shadow-sm hover:bg-indigo-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600">
                Save
            </button>
        </div>
        {% if form.errors %}
            <div class="mt-4 bg-red-100 border border-red-400 text-red-700 px-4 py-3 rounded relative"
                 role="alert">
                <strong class="font-bold">Please correct the following errors:</strong>
                <ul class="list-disc list-inside mt-2">
                    {% for field in form %}
                        {% if field.errors %}
                            {% for error in field.errors %}
                                <li>
                                    {{ field.label_tag }}
                                    {{ error }}
                                </li>
                            {% endfor %}
                        {% endif %}
                    {% endfor %}
                </ul>
            </div>
        {% endif %}
    </form>
</div>
</div>
