Macro Modules | Media Feature

HTML

<section class="media-feature" role='complementary' aria-label="featured media">
            
                <h2 class="h2">Section Title</h2>
            
                    <figure class="figure js-figure">
                        <div class="figure__image">
                            <img src="/images/temp/subpage-main-video-placeholder.jpg" alt="#">
                        </div>
                    </figure>
            
            
            <a href="#" class="media-feature__item-link"><span class="media-feature__item-title media-feature__item-title--link">Video or Feature Image Title</span></a>
            
                <p class="media-feature__item-text">Praesent at sapien vitae ex pharetra finibus. Aliquam tristique vehicula velit, non accumsan leo temport sed.</p>
            
            </section> <!-- .media-feature -->

Notes

Media Feature

Templates this appears on:

HTML

<section class="media-feature" role='complementary' aria-label="featured media">
            
                <h2 class="h2">Section Title</h2>
            
            
                    <figure class="figure figure--video js-figure">
                        <div class="figure__video js-figure-video">
                            <iframe width="853" height="480" src="https://www.youtube.com/embed/NpEaa2P7qZI" frameborder="0" allowfullscreen></iframe>
                        </div>
                    </figure>
            
            <a href="#" class="media-feature__item-link"><span class="media-feature__item-title media-feature__item-title--link">Video or Feature Image Title</span></a>
            
                <p class="media-feature__item-text">Praesent at sapien vitae ex pharetra finibus. Aliquam tristique vehicula velit, non accumsan leo temport sed.</p>
            
            </section> <!-- .media-feature -->

Notes

Media Feature

Templates this appears on:

Media Feature w/ Image

Section Title

HTML

Notes

Media Feature w/ Video

Section Title

HTML

Notes