DAHLIA Pattern Library

Results Header 

<header class="lead-header">
    <div class="row">
        <div class="medium-12 columns">

            <h1 class="lead-header_title serif margin-bottom-none">Showing matches for</h1>

            <div class="results-header">
                <p class="results-header_values"><strong>4</strong> people (including <strong>2</strong> children under 6) at <strong>$1,400</strong>/month</p>

                <div class="results-header_actions">
                    <a href="#" class="button ghost-white tiny has-icon has-icon--right">Edit Eligibility <span class="ui-icon ui-static ui-small i-color ">
  <svg>
    <use xlink:href="#i-arrow-down"></use>
  </svg>
</span>
</a>
                    <a href="#" class="button ghost-white tiny has-icon has-icon--right">Clear <span class="ui-icon ui-static ui-small i-color ">
  <svg>
    <use xlink:href="#i-close"></use>
  </svg>
</span>
</a>
                </div>
            </div>

        </div>
    </div>
</header>
 
<header class="lead-header">
  <div class="row">
    <div class="medium-12 columns">
      
      <h1 class="lead-header_title serif margin-bottom-none">Showing matches for</h1>

      <div class="results-header">
        <p class="results-header_values"><strong>4</strong> people (including <strong>2</strong> children under 6) at <strong>$1,400</strong>/month</p>

        <div class="results-header_actions">
          <a href="#" class="button ghost-white tiny has-icon has-icon--right">Edit Eligibility {{> @icons-base icon="arrow-down" size="small"}}</a>
          <a href="#" class="button ghost-white tiny has-icon has-icon--right">Clear {{> @icons-base icon="close" size="small"}}</a>
        </div>
      </div>

    </div>
  </div>
</header>
 
/* No context defined for this component. */

There are no notes for this item.