Cp Overlay Board 

<div class="overlay-board js-board">
    <div class="overlay-board__header">
        <h2 class="overlay-board__heading js-board-header"></h2>
        <div class="overlay-board__controls-wrapper">
            <div class="overlay-board__controls overlay-board__controls--actions">
                <button class="overlay-board__button js-share-modal-board-button"></button>
                <button class="overlay-board__button js-board-settings-button"></button>
            </div>
            <div class="overlay-board__controls overlay-board__controls--toggles js-board-view-toggles">
                <button class="overlay-board__toggle overlay-board__toggle--liked-items is-active js-like-card-map-toggles"></button>
                <button class="overlay-board__toggle overlay-board__toggle--map js-like-card-map-toggles"></button>
            </div>
        </div>
    </div>
    <div class="overlay-board__liked-items js-api-board-results-container active">
        <div class="js-api-results grid-x">
        </div>
    </div>
    <div class="my-board-map js-my-board-map" data-map-key="">
        <div class="my-board-map__inner">
            <div class="my-board-map__map-view">
                <template class="js-card-template">
                    <div data-module="card" class="card-horizontal js-card-generic ">
                        <a class="card-horizontal__link js-link" href="#">
                            <div class="card-horizontal__image js-image">
                                <figure class="image js-image image--original-size " data-module="imagelazy" data-is-small-image="">
                                    <template>
                                        <figure class="image js-image image--original-size  loaded" data-module="imagelazy">
                                            <img class="image__lowres js-image-lazyload" />
                                            <picture class="image__container"></picture>
                                        </figure>
                                    </template>
                                    <img class="image__lowres js-image-lazyload" data-src="" alt="">
                                    <picture class="image__container">
                                        <img class="js-image-lazyload js-fallback-image" data-src="" alt="">
                                    </picture>
                                </figure>
                            </div>
                            <div class="card-horizontal__copy">
                                <div class="location-marker js-location-marker" data-module="locationMarker" data-longitude="" data-latitude="">
                                    <div class="location-marker__text">
                                        <span class="location-marker__text-description js-marker-description"></span>
                                        <span class="location-marker__distance js-marker-distance"></span>
                                    </div>
                                </div> <button class="like-button js-like-button" role="button">
                                    <span class="like-button__text"></span>
                                    <span class="like-button__wave"></span>
                                </button>
                                <p class="card-horizontal__page-type js-page-type"></p>
                                <h2 class="card-horizontal__title js-title"></h2>
                                <p class="card-horizontal__subtitle js-subtitle"></p>
                                <p class="card-horizontal__location js-location-name"></p>
                            </div>
                        </a>
                    </div>
                </template>
                <div class="my-board-map__map-card-container">
                    <div class="my-board-map__map-card-container-wrapper js-map-card-container">
                    </div>
                    <div class="overlay-card-modal-container js-overlay-map-card-modal">
                        <div class="overlay-card-modal-container__inner">
                            <button class="overlay-card-modal-container__back js-card-modal-close"></button>
                            <div class="overlay-card-modal-container__card-wrapper js-card-modal-inner">
                            </div>
                            <div class="overlay-card-modal-container__button-wrapper">
                                <a class="button-p1 button-p1--with-icon js-button-link"></a>
                                <button class="button-p2 button-p2--with-icon button-p2--with-icon-map js-button-map"></button>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="my-board-map__map-container">
                    <link href="https://api.mapbox.com/mapbox-gl-js/v1.8.1/mapbox-gl.css" rel="stylesheet" />
                    <div class="my-board-map__map js-board-map"></div>
                    <p class="my-board-map__map-sub-text"></p>
                </div>
            </div>
        </div>
    </div>
    <div class="overlay-board__footer">
        <div class="overlay-board__footer-content-container">
            <div class="overlay-board__footer-icon"></div>
            <button class="button-p1 overlay-board__footer-share-button js-share-modal-board-button"></button>
        </div>
    </div>
</div>
<div class="overlay-board__notification js-board-notification">
    <span class="overlay-board__notification-text js-board-notification-text" data-board-card-remove-text=""></span>
</div>
<div class="overlay-board__empty-container js-empty-board-container">
    <div class="overlay-board__empty-content">
        <h2 class="overlay-board__empty-header"></h2>
        <p class="overlay-board__empty-text"></p>
        <div class="overlay-board__empty-image">
            <figure class="image js-image image--original-size " data-module="imagelazy" data-is-small-image="">
                <img class="image__lowres js-image-lazyload" data-src="" alt="">
                <picture class="image__container">
                    <img class="js-image-lazyload js-fallback-image" data-src="" alt="">
                </picture>
            </figure>
        </div>
    </div>
</div>
 
<div class="overlay-board js-board">
    <div class="overlay-board__header">
        <h2 class="overlay-board__heading js-board-header">{{boardTitle}}</h2>
        <div class="overlay-board__controls-wrapper">
            <div class="overlay-board__controls overlay-board__controls--actions">
                <button class="overlay-board__button js-share-modal-board-button">{{{shareIcon}}}</button>
                <button class="overlay-board__button js-board-settings-button">{{{settingsIcon}}}</button>
            </div>
            <div class="overlay-board__controls overlay-board__controls--toggles js-board-view-toggles">
                <button class="overlay-board__toggle overlay-board__toggle--liked-items is-active js-like-card-map-toggles">{{{gridViewIcon}}}</button>
                <button class="overlay-board__toggle overlay-board__toggle--map js-like-card-map-toggles">{{{mapViewIcon}}}</button>
            </div>
        </div>
    </div>
    <div class="overlay-board__liked-items js-api-board-results-container active">
        <div class="js-api-results grid-x">
        </div>
    </div>
    {{> @cp-overlay-board-map-card boardMap }}
    <div class="overlay-board__footer">
        <div class="overlay-board__footer-content-container">
            <div class="overlay-board__footer-icon">{{{footerIcon}}}</div>
            <button class="button-p1 overlay-board__footer-share-button js-share-modal-board-button">{{footerShareButtonText}}</button>
        </div>
    </div>
</div>
<div class="overlay-board__notification js-board-notification">
    <span class="overlay-board__notification-text js-board-notification-text" data-board-card-remove-text="{{notificationText}}"></span>
</div>
<div class="overlay-board__empty-container js-empty-board-container">
    <div class="overlay-board__empty-content">
        <h2 class="overlay-board__empty-header">{{empty.header}}</h2>
        <p class="overlay-board__empty-text">{{empty.text}}</p>
        <div class="overlay-board__empty-image">
            {{> @cp-responsive-image empty.responsiveImage}}
        </div>
    </div>
</div>
 
/* No context defined for this component. */

There are no notes for this item.