Cp Card Long Form Horizontal 

<div data-module="card" class="card-horizontal card-horizontal--long-form 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="">
                <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">
            <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>
 
<div data-module="card" class="card-horizontal card-horizontal--long-form js-card-generic {{#if tags}}has-tags{{/if}}" {{#if cardId}}data-card-id={{cardId}}{{/if}} {{#if location}}data-longitude="{{location.longitude}}" data-latitude="{{location.latitude}}"{{/if}} {{#if isEditorialCard}}data-editorial-card="true"{{/if}}>
    <a class="card-horizontal__link js-link" href="{{#if link.url}}{{link.url}}{{else}}#{{/if}}" {{#if link.target}} target="{{link.target}}"{{#ifEquals link.target "_blank"}} rel="noopener"{{/ifEquals}}{{/if}} >
        <div class="card-horizontal__image js-image">
            {{#if responsiveLandscapeImage}}
                {{> @cp-medium-image additionalCssClasses="js-landscape-image" lowResolutionUrl=responsiveLandscapeImage.lowResolutionUrl fallbackImageUrl=responsiveLandscapeImage.fallbackImageUrl sources=responsiveLandscapeImage.sources caption=responsiveLandscapeImage.caption dynamicImage=dynamicImage isSmallImage=responsiveLandscapeImage.isSmallImage}}
            {{else}}
            {{> @cp-medium-image lowResolutionUrl=responsiveImage.lowResolutionUrl fallbackImageUrl=responsiveImage.fallbackImageUrl sources=responsiveImage.sources caption=responsiveImage.caption originalSize=true}}
            {{/if}}
        </div>
        <div class="card-horizontal__copy">
            {{#if webAppMode}}
                {{#if location}}{{> @cp-location-marker longitude=location.longitude latitude=location.latitude}}{{/if}}
                {{> @cp-like-button likeText}}
            {{/if}}
            <p class="card-horizontal__page-type js-page-type">{{pageType}}</p>
            {{#if timeSpan.text}}
                <time class="card-horizontal__read-time js-read-time" datetime="{{timeSpan.stamp}}">{{timeSpan.text}}</time>
            {{/if}}
            <h2 class="card-horizontal__title js-title">{{{title}}}</h2>
            <p class="card-horizontal__subtitle js-subtitle">{{subtitle}}</p>
            {{#if starRating}}
                <div class="card-horizontal__rating">
                    <div class="star-rating star-rating--{{starRating.total}}-max star-rating--{{starRating.rating}}-rating"></div>
                    <p class="card-horizontal__rating-text">{{starRating.rating}}/{{starRating.total}}</p>
                </div>
            {{/if}}
            <p class="card-horizontal__location js-location-name">{{locationName}}</p>
            {{#if tags}}
                {{> @cp-hashtags tags }}
            {{/if}}
        </div>
    </a>
</div>
 
/* No context defined for this component. */

There are no notes for this item.