Hero Article

<header class="hero"> <figure class="image"> <div class="image__container"> <amp-img itemscope itemtype="https://schema.org/ImageObject" class="grey-placeholder" src="" srcset=" 767w, 768w, 1320w" layout="fill"> <noscript> <img src="" alt="Alt Text" /> </noscript> </amp-img> </div> </figure> <div class="hero__overlay"> <div class="hero__inner"> <time class="hero__read-time" datetime="">4 min read</time> <h1 class="hero__title heading01">On location: Star Wars: The Last Jedi</h1> <div class="hero__body"> <div class="hero__main"> <p class="hero__lead spacer-lg">Mark Hamill and Daisy Ridley returned to Skellig Michael, County Kerry, for Star Wars: The Last Jedi, this time with director Rian Johnson</p> <time datetime="2017-06-14">14 June 2017</time> </div> <div class="hero__side"> <div class="map"> <div class="map__inner"> <amp-img src="/img/maps/map.png" class="stage-footer__logo" alt="County Kerry" height="111" width="95" layout="responsive"></amp-img> </div> <div class="map-county">County Kerry</div> </div> </div> </div> </div> </div> </header>
<header class="hero"> {{> @cp-medium-image-amp backgroundResponsiveImage}} <div class="hero__overlay"> <div class="hero__inner"> <time class="hero__read-time" datetime="{{timeSpan.stamp}}">{{timeSpan.text}}</time> <h1 class="hero__title heading01">{{title}}</h1> <div class="hero__body"> <div class="hero__main"> <p class="hero__lead spacer-lg">{{subtitle}}</p> <time datetime="{{articleDateTime.stamp}}">{{articleDateTime.displayDate}}</time> </div> {{#if imageMap}} <div class="hero__side"> <div class="map"> <div class="map__inner"> <amp-img src="{{imageMap.image}}" class="stage-footer__logo" alt="{{imageMap.county}}" height="111" width="95" layout="responsive"></amp-img> </div> <div class="map-county">{{imageMap.county}}</div> </div> </div> {{/if}} </div> </div> </div> </header>
{ "modifier": "article", "backgroundResponsiveImage": { "altText": "Alt Text", "modifier": "lazy", "lowResolutionUrl": "https://images.unsplash.com/photo-1511219096939-ce77f5f44cc8?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=50&q=10", "sources": [ { "type": "image/jpeg", "largeUrl": "https://images.unsplash.com/photo-1511219096939-ce77f5f44cc8?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1600&q=80", "smallUrl": "https://images.unsplash.com/photo-1535479804851-93f60320e644?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=600&q=80" } ] }, "title": "On location: Star Wars: The Last Jedi", "subtitle": "Mark Hamill and Daisy Ridley returned to Skellig Michael, County Kerry, for Star Wars: The Last Jedi, this time with director Rian Johnson", "timeSpan": { "text": "4 min read" }, "articleDateTime": { "stamp": "2017-06-14", "displayDate": "14 June 2017" }, "imageMap": { "image": "/img/maps/map.png", "county": "County Kerry" } }

There are no notes for this item.