Property Visual Stack

<div class="property-visual-stack" data-module="propertyVisualModal">
    <div class="property-visual-stack__col">
        <button class="property-visual-stack__trigger js-modal-open">
            <svg xmlns="http://www.w3.org/2000/svg" width="44" height="44" viewBox="0 0 44 44" fill="none">
                <rect width="44" height="44" rx="8" fill="none" />
                <path d="M20 24L12.5 31.5" stroke="#0054A6" stroke-width="2" />
                <path d="M18 32L12 32L12 26" stroke="#0054A6" stroke-width="2" />
                <path d="M24 20L31.5 12.5" stroke="#0054A6" stroke-width="2" />
                <path d="M26 12H32V18" stroke="#0054A6" stroke-width="2" />
            </svg>
        </button>
        {{#endsWith stackUrl ".pdf"}}
        <iframe class="property-visual-stack__iframe" src="{{stackUrl}}" height="100%" width="100%"
            loading="lazy"></iframe>
        {{else}}
        <img class="property-visual-stack__image" src="{{stackUrl}}" alt="Floor Plan" loading="lazy" />
        {{/endsWith}}
    </div>
    <div class="modal modal--stack js-modal">
        <span class="modal__info modal__info--title">
            Stacking
            <i class="modal__info-icon modal__info-icon--title">
                <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
                    <path d="M3 15H21V20H3V15Z" stroke="white" stroke-width="2" />
                    <path d="M5 10H19V15H5V10Z" stroke="white" stroke-width="2" />
                    <path d="M7 5H17V10H7V5Z" stroke="white" stroke-width="2" />
                </svg> </i>
        </span>
        <button class="modal__info modal__info--close js-modal-close">
            Close
            <i class="modal__info-icon modal__info-icon--close">
                <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
                    <path d="M18.364 4.22168L19.7782 5.63589L5.63609 19.778L4.22188 18.3638L18.364 4.22168Z"
                        fill="white" />
                    <path d="M19.7783 18.3643L18.3641 19.7785L4.22197 5.63633L5.63619 4.22212L19.7783 18.3643Z"
                        fill="white" />
                </svg>
            </i>
        </button>
        <div class="js-modal-iframe">
        {{#endsWith stackUrl ".pdf"}}
        <iframe class="property-visual-stack__iframe" src="{{stackUrl}}" height="100%" width="100%"
            loading="lazy"></iframe>
        {{else}}
        <img class="property-visual-stack__image" src="{{stackUrl}}" alt="Floor Plan" loading="lazy" />
        {{/endsWith}}
        </div>
    </div>
</div>