{% import "_includes/forms" as forms %}
{% do view.registerAssetBundle("Page8\\ManyToMany\\assetbundles\\manytomanyfield\\ManyToManyFieldAsset") %}

<div class="mTm-modal-hide">
    {{ forms.hidden({
        name: name ~ 'nonSelectable',
        id: name ~ 'nonSelectable',
        value: nonSelectable,
    }) }}

    <div class="input ltr">
        <div class="elementselect">
            <div class="elements">
                <div class="mTm{{ name }}">
                    {% for cur in current %}
                        <div class="element removable unselectable" id="{{ name }}-manyToMany-{{ cur.id }}">
                            <input type="hidden" name="{{ name }}[add][]" value="{{ cur.id }}">
                            <a class="delete icon manyToManyDelete" data-nameSpace="{{ nameSpace }}" data-name="{{ name }}"  data-remove="{{ cur.id }}" title="Remove"></a>
                            <div class="label">
                                <span class="title">{{ cur.title }}</span>
                            </div>
                        </div>
                    {% endfor %}
                </div>
                <div class="btn add icon dashed addManytoMany" data-name="{{ name }}" data-nameSpace="{{ nameSpace }}" data-section="{{ section }}" data-target="mTm{{ name }}" tabindex="0">{{ "Add an entry"|t }}</div>
            </div>
        </div>
    </div>
    <div id="{{ name }}-toDelete"></div>
</div>

{% import "_includes/forms" as forms %}
{% do view.registerAssetBundle("Page8\\ManyToMany\\assetbundles\\manytomanyfield\\ManyToManyFieldAsset") %}

<div class="mTm-modal-hide">
    {{ forms.hidden({
        name: name ~ 'nonSelectable',
        id: name ~ 'nonSelectable',
        value: nonSelectable,
    }) }}

    <div class="input ltr">
        <div class="elementselect">
            <div class="elements">
                <div class="mTm{{ name }}">
                    {% for cur in current %}
                        <div class="element small removable unselectable" id="{{ name }}-manyToMany-{{ cur.id }}">
                            <input type="hidden" name="{{ name }}[add][]" value="{{ cur.id }}">
                            <a class="delete icon manyToManyDelete" data-nameSpace="{{ nameSpace }}" data-name="{{ name }}"  data-remove="{{ cur.id }}" title="Remove"></a>
                            <span class="status {{ cur.status }}"></span>
                            <a href="{{ cur.cpEditUrl }}" class="label">
                                <span class="title">{{ cur.title }}</span>
                            </a>
                        </div>
                    {% endfor %}
                </div>
                <div class="btn add icon dashed addManytoMany" data-name="{{ name }}" data-nameSpace="{{ nameSpace }}" data-section="{{ section }}" data-target="mTm{{ name }}" tabindex="0">{{ "Add an entry"|t }}</div>
            </div>
        </div>
    </div>
    <div id="{{ name }}-toDelete"></div>
</div>

Update input template to better display elements
Update input template to better display elements

Elements are listed vertically through addition of the `small` class on the element, the `status` of the element is now shown, and the title of the element itself now links directly to the `cpEditUrl` for a more streamlined editing process.