patternlibrary/static-layouts/design-source/pages/insights.hbs

---
title: "Insights"
---


{{#extend "default"}}
  {{#content "precontent"}}
    <section class="hero is-dark">
      <div class="hero-body">
        <div class="container">
          <div class="titlebar">
            <div class="titlebar_title">
              <h1 class="title is-2">Insights</h1>
            </div>
            <div class="titlebar_links">
              <div class="titlebar_links">
                <div class="field is-horizontal">
                  <div class="field-label is-normal">
                    <label class="label">Filter&nbsp;by:</label>
                  </div>
                  <div class="field-body">
                    <div class="field">
                      <p class="control">
                        <div class="select">
                          <select>
                            <option>Author</option>
                            <option>freescholar</option>
                            <option>mlncn</option>
                            <option>dinarcon</option>
                          </select>
                        </div>
                      </p>
                    </div>
                    <div class="field">
                      <p class="control">
                        <div class="select">
                          <select>
                            <option>Type</option>
                            <option>...</option>
                          </select>
                        </div>
                      </p>
                    </div>
                    <div class="field">
                      <p class="control">
                        <div class="select">
                          <select>
                            <option>Topic</option>
                            <option>...</option>
                          </select>
                        </div>
                      </p>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </section>
  {{/content}}
  {{#content "content"}}
    <div class="flow content">
      <div class="media-list">
        <a href="#" class="teaser media">
          <div class="media-left">
            <img src="../assets/img/fpo-landscape.png" alt="" style="width: 300px;">
          </div>
          <div class="media-content content">
            <p class="title is-5">Lorem ipsum dolor sit amet, ibhdiam nonummy nibh</p>
            <p class="subtitle is-6">Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.</p>
          </div>
        </a>
        <a href="#" class="teaser media">
          <div class="media-left">
          </div>
          <div class="media-content content">
            <p class="title is-5">Lorem ipsum dolor sit amet, ibhdiam nonummy nibh</p>
            <p class="subtitle is-6">Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.</p>
          </div>
        </a>
        <a href="#" class="teaser media">
          <div class="media-left">
            <img src="../assets/img/fpo-landscape.png" alt="" style="width: 300px;">
          </div>
          <div class="media-content content">
            <p class="title is-5">Lorem ipsum dolor sit amet, ibhdiam nonummy nibh</p>
            <p class="subtitle is-6">Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.</p>
          </div>
        </a>
        <a href="#" class="teaser media">
          <div class="media-left">
            <img src="../assets/img/fpo-landscape.png" alt="" style="width: 300px;">
          </div>
          <div class="media-content content">
            <p class="title is-5">Lorem ipsum dolor sit amet, ibhdiam nonummy nibh</p>
            <p class="subtitle is-6">Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.</p>
          </div>
        </a>
        <a href="#" class="teaser media">
          <div class="media-left">
          </div>
          <div class="media-content content">
            <p class="title is-5">Lorem ipsum dolor sit amet, ibhdiam nonummy nibh</p>
            <p class="subtitle is-6">Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.</p>
          </div>
        </a>
        <a href="#" class="teaser media">
          <div class="media-left">
          </div>
          <div class="media-content content">
            <p class="title is-5">Lorem ipsum dolor sit amet, ibhdiam nonummy nibh</p>
            <p class="subtitle is-6">Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.</p>
          </div>
        </a>
        <a href="#" class="teaser media">
          <div class="media-left">
            <img src="../assets/img/fpo-landscape.png" alt="" style="width: 300px;">
          </div>
          <div class="media-content content">
            <p class="title is-5">Lorem ipsum dolor sit amet, ibhdiam nonummy nibh</p>
            <p class="subtitle is-6">Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.</p>
          </div>
        </a>
      </div>
    </div>
  {{/content}}
{{/extend}}