{namespace format=MediateSystems\MsEvent\ViewHelpers}


<div class="pagelisting black-white {f:if(condition: '{settings.theme} == calender_box_no_img_with_line', then:'has-line')}">
    <div class="pagelisting-inner">
        <f:if condition="{settings.theme} == 'calender_box'">
            <div class="pagelisting-image">
                <f:if condition="{page.tx_umj_sitepackage_pagelisting_image.0}">
                    <f:then>
                        <f:link.page class="btn btn-primary"  title="Details" pageUid="{page.uid}" >
                            <f:image cropVariant="{page.tx_umj_sitepackage_pagelisting_image_crop}" width="420" image="{page.tx_umj_sitepackage_pagelisting_image.0}" title="{page.title}"  alt="{page.tx_umj_sitepackage_pagelisting_image.0.properties.alternative}"></f:image>
                        </f:link.page>
                    </f:then>
                    <f:else>
                        <img src="https://www.placehold.co/420x237.png?text={v:format.replace(content:'{page.title}', substring:' ', replacement:'')}" width="420" height="237" alt="{page.title}" title="{page.title}">
                    </f:else>
                </f:if>

            </div>
        </f:if>
        <div class="pagelisting-content">
            <f:if condition="{page.tx_umj_sitepackage_pagelisting_title}">
                <div class="pagelisting-headline">
                    <h3>{page.tx_umj_sitepackage_pagelisting_title}</h3>
                </div>
            </f:if>

            <f:if condition="{page.tx_umj_sitepackage_pagelisting_subtitle}">
                <div class="pagelisting-subheadline">
                    <h4>{page.tx_umj_sitepackage_pagelisting_subtitle}</h4>
                </div>
            </f:if>

            <f:if condition="{page.tx_umj_sitepackage_pagelisting_text}">
                <div class="format-wrapper">
                    <f:format.raw>{page.tx_umj_sitepackage_pagelisting_text}</f:format.raw>
                </div>
            </f:if>

            <f:link.page class="readmore"  title="{f:translate(key: 'tx_msevent_domain_model_house.showmore', extensionName: 'ms_event')}" pageUid="{page.uid}"  style="display:inline-block;">
                {f:translate(key: 'tx_msevent_domain_model_house.showmore', extensionName: 'ms_event')}

            </f:link.page>
        </div>
        <f:if condition="{settings.theme} == 'calender_box_no_img_with_line'">
            <div class="line"></div>
        </f:if>
    </div>
</div>