Missouri State University Pattern Library

Related content

There are no notes for this item.

<div class="related-content">
    <h2 class="headline">Lorem ipsum dolor</h2>
    <div class="container">
        <div class="item">
            <article class="ContentBlock RichText sample-class Page10">
                <h2>Lorem ipsum dolor</h2>
                <p>Lorem ipsum dolor sit amet <strong>consectetur adipisicing</strong> elit. Cupiditate nostrum itaque debitis <a href="#">odit minima ducimus dicta facere</a>, ex sequi perspiciatis.</p>
            </article>
        </div>
        <div class="item">
            <article class="ContentBlock RichText sample-class Page10">
                <h2>Lorem ipsum dolor</h2>
                <p>Lorem ipsum dolor sit amet <strong>consectetur adipisicing</strong> elit. Cupiditate nostrum itaque debitis <a href="#">odit minima ducimus dicta facere</a>, ex sequi perspiciatis.</p>
            </article>
        </div>
        <div class="item">
            <article class="ContentBlock RichText sample-class Page10">
                <h2>Lorem ipsum dolor</h2>
                <p>Lorem ipsum dolor sit amet <strong>consectetur adipisicing</strong> elit. Cupiditate nostrum itaque debitis <a href="#">odit minima ducimus dicta facere</a>, ex sequi perspiciatis.</p>
            </article>
        </div>
    </div>
</div>
 
<div class="related-content">
  <h2 class="headline">{{headline}}</h2>
  <div class="container">
    {{#each items}}
      <div class="item">
        {{#> content content}}{{render '@rich-text' richText merge=true}}{{/content}}
      </div>
    {{/each}}
  </div>
</div>
 
{
  "headline": "Lorem ipsum dolor",
  "items": [
    {
      "content": {
        "richText": {
          "pageId": 10,
          "freeformContent": "<h2>Lorem ipsum dolor</h2> <p>Lorem ipsum dolor sit amet <strong>consectetur adipisicing</strong> elit. Cupiditate nostrum itaque debitis <a href=\"#\">odit minima ducimus dicta facere</a>, ex sequi perspiciatis.</p>",
          "pageClass": "sample-class"
        }
      }
    },
    {
      "content": {
        "richText": {
          "pageId": 10,
          "freeformContent": "<h2>Lorem ipsum dolor</h2> <p>Lorem ipsum dolor sit amet <strong>consectetur adipisicing</strong> elit. Cupiditate nostrum itaque debitis <a href=\"#\">odit minima ducimus dicta facere</a>, ex sequi perspiciatis.</p>",
          "pageClass": "sample-class"
        }
      }
    },
    {
      "content": {
        "richText": {
          "pageId": 10,
          "freeformContent": "<h2>Lorem ipsum dolor</h2> <p>Lorem ipsum dolor sit amet <strong>consectetur adipisicing</strong> elit. Cupiditate nostrum itaque debitis <a href=\"#\">odit minima ducimus dicta facere</a>, ex sequi perspiciatis.</p>",
          "pageClass": "sample-class"
        }
      }
    }
  ]
}