{% set info_records_counter = 0 %}

{% for info_record in info_records %}

    {% set info_records_counter = info_records_counter + 1 %}

    <section id="product_info_section_{{ info_records_counter }}">

        <div class="row">
            <button class="js_move_down btn-secondary"><i class="fa fa-chevron-down"></i></button>
            <button class="js_move_up btn-secondary"><i class="fa fa-chevron-up"></i></button>
            <label for="product_info_title_{{ info_records_counter }}">Title</label>
            <input
                name="info_record[{{ info_record.id }}][title]"
                id="product_info_title_{{ info_records_counter }}"
                value="{{ info_record.title }}"
            />
        </div>

        <div class="row">
            <label for="product_info_itemised_{{ info_records_counter }}">Is content itemised?</label>
            <input
                name="info_record[{{ info_record.id }}][is_content_itemised]"
                id="product_info_itemised_{{ info_records_counter }}"
                {{ info_record.is_content_itemised ? 'checked' : '' }}
                value="yes"
                type="checkbox"
            />
        </div>

        <div class="row">
            <label for="product_info_content_{{ info_records_counter }}">Content</label>
            <textarea name="info_record[{{ info_record.id }}][content]" id="product_info_content_{{ info_records_counter }}" class="tinymce">
                {{ info_record.content }}
            </textarea>

        </div>

        <div class="row">
            <label></label>
            <button class="js_delete_me btn btn-smaller">Delete section</button>
        </div>

        <div class="row">
            <input name="info_record[{{ info_record.id }}][type]" value="existing" type="hidden" />&nbsp;
        </div>

    </section>

{% endfor %}

<div class="row clone_buttons">
    <section style="display: none">
        <div class="row">
            <button class="js_move_down btn-secondary"><i class="fa fa-chevron-down"></i></button>
            <button class="js_move_up btn-secondary"><i class="fa fa-chevron-up"></i></button>
            <label for="">Title</label>
            <input name="info_record[{temp_id}][title]" disabled />
        </div>

        <div class="row">
            <label for="">Is content itemised</label>
            <input name="info_record[{temp_id}][is_content_itemised]" type="checkbox" value="yes" disabled />
        </div>

        <div class="row">
            <label>Content</label>
            <textarea name="info_record[{temp_id}][content]" id="product_info_content_{temp_id}" disabled></textarea>
        </div>

        <div class="row">
            <label></label>
            <button class="js_delete_me btn btn-smaller">Delete section</button>
        </div>

        <div class="row">
            <input name="info_record[{temp_id}][type]" value="new" type="hidden" disabled />&nbsp;
        </div>
    </section>

    <button class="js_clone_above btn btn-secondary">Add new section</button>
</div>
