SU-SWS/decanter

{# This twig file is for demonstration in the styleguide #}

{# Example usage #1 with embed video #}
<figure class="su-aspect-ratio {{ modifier_class }}"><iframe width='560' height='315' src='https://www.youtube.com/embed/tZ2GZhND7s0' frameborder='0' allowfullscreen></iframe></figure>

{# Example usage #2 with a fixed aspect ratio div with custom content #}
<div class="su-aspect-ratio {{ modifier_class }}">
  <div class="content">
    <h1>Hi I'm an Aspect Ratio container</h1>
    <p>Nam commodo suscipit quam. Etiam iaculis nunc ac metus. Curabitur at lacus ac velit ornare lobortis.
      Phasellus volutpat, metus eget egestas mollis, lacus lacus blandit dui, id egestas quam mauris ut lacus.
      Sed cursus turpis vitae tortor. Aenean imperdiet.</p>
  </div>
</div>

{# Example usage #3 with image #}
<figure class="su-aspect-ratio {{ modifier_class }}"><img src='/kss-assets/hero-banner.jpg'></figure>