<div class="t3js-media-new-content-element-wizard media-new-content-element-wizard col-12 col-md-6">
    <f:if condition="{target}">
        <f:then>
            <button type="button" class="btn btn-link media p-0 text-start" data-target="{target}">
                <f:render section="itemContent" arguments="{_all}" />
            </button>
        </f:then>
        <f:else>
            <button type="button" class="btn btn-link media p-0 text-start" data-position-map-arguments="{positionMapArguments -> f:format.raw()}">
                <f:render section="itemContent" arguments="{_all}" />
            </button>
        </f:else>
    </f:if>
</div>

<f:section name="itemContent">
    <f:if condition="{content}">
        {content -> f:format.raw()}
    </f:if>
    <div class="media-left">
        {icon -> f:format.raw()}
    </div>
    <div class="media-body">
        <strong>{wizardInformation.title -> f:format.htmlspecialchars()}</strong>
        <br/>
        {wizardInformation.description -> f:format.htmlspecialchars() -> f:format.nl2br()}
    </div>
</f:section>
