Hero

Open this example in a new tab: hero

<div class="asp-hero">
  <div class="container">
    <div class="asp-grid">
      <div class="asp-grid__item asp-grid__item--large-three-quarters asp-grid__item--extra-large-two-thirds">
        <div class="asp-hero__content">
          <h1>Hero title</h1>
          <p>Hero content (html).</p>
                <p>With additional line.</p>
        </div>
      </div>
    </div>
  </div>
</div>

{% from "hero/macro.njk" import aspHero %}

{{ aspHero({
  title: "Hero title",
  content: {
    html: '<p>Hero content (html).</p>
      <p>With additional line.</p>'  
  }
}) }}

{% from "hero/macro.njk" import aspHero %}

{{ aspHero({
  title: "Hero title",
  content: {
    html: '<p>Hero content (html).</p>
      <p>With additional line.</p>'  
  }
}) }}