<div class="editorial-map-and-card-grid {{#ifEquals type "sharedBoard"}}shared-board card-view{{/ifEquals}} {{#ifEquals type "map"}}map-view{{/ifEquals}} {{#ifEquals type "mapAndCards"}}map-view{{/ifEquals}} {{#ifEquals type "cards"}}card-view{{/ifEquals}}" {{#if mapSettings}} data-maxzoom="{{mapSettings.maxZoom}}" data-minzoom="{{mapSettings.minZoom}}" data-scrollzoom="{{mapSettings.scrollZoom}}" data-interactive="{{mapSettings.interactive}}" data-zoom="{{mapSettings.zoom}}" data-pitch="{{mapSettings.pitch}}" data-bearing="{{mapSettings.bearing}}" data-centerlat="{{mapSettings.center.lat}}" data-centerlong="{{mapSettings.center.long}}" {{/if}} data-module="editorialMapAndCardGrid" data-map-key="{{mapKey}}">
    <div class="editorial-map-and-card-grid__inner grid-layout__full-width">
        <div class="grid-x grid-margin-x">
            {{#if title}}<h2 class="editorial-map-and-card-grid__title cell">{{{title}}}</h2>{{/if}}
            {{#if subtitle}}<p class="editorial-map-and-card-grid__subtitle cell">{{{subtitle}}}</p>{{/if}}
            {{#ifEquals type "mapAndCards" }}
                <div class="editorial-map-and-card-grid-toggle">
                    <a href="#" class="editorial-map-and-card-grid-toggle__map-toggle js-show-map">Map View</a>
                    <a href="#" class="editorial-map-and-card-grid-toggle__card-toggle js-show-cards">Card View</a>
                </div>
            {{/ifEquals}}
        </div>
        {{#if filters}}
            <div class="grid-x gird-margin-x editorial-map-and-card-grid__filters-container">
                {{#each filters}}
                    {{> @cp-filters this}}
                {{/each}}
            </div>
        {{/if}}
        {{#ifEquals type "sharedBoard"}}
            <div class="grid-x editorial-map-and-card-grid__button-container">
                <div class="editorial-map-and-card-grid__share">
                    <button class="editorial-map-and-card-grid-toggle__button js-share-board-button">{{{shareIcon}}}</button>
                </div>
                <div class="editorial-map-and-card-grid-toggle">
                    <a href="#" class="editorial-map-and-card-grid-toggle__card-toggle js-show-cards"></a>
                    <a href="#" class="editorial-map-and-card-grid-toggle__map-toggle js-show-map"></a>
                </div>
            </div>
            <div class="overlay-card-modal-container js-shared-board-card-modal" data-back-button-text="{{ modalCardButtonText.backButtonText }}" data-visit-website-text="{{ modalCardButtonText.visitWebsiteText }}" data-tell-me-more-text="{{ modalCardButtonText.tellMeMoreText }}" data-view-on-map="{{ modalCardButtonText.viewOnMapText }}">
                <div class="overlay-card-modal-container__inner">
                    <button class="overlay-card-modal-container__back js-card-modal-close">{{modalCardButtonText.backButtonText}}</button>
                    <button class="overlay-card-modal-container__close js-card-modal-close"></button>
                    <div class="js-card-modal-inner"></div>
                </div>
            </div>
            {{> @cp-share-board-modal shareMyBoard }}
        {{/ifEquals}}
        {{> @cp-card-view }}
        {{> @cp-map-view }}
    </div>
</div>