DAHLIA Pattern Library

Content Group 

<div class="content-group has-divider">
    <h2 class="h-caps-lined">How to Apply</h2>
    <h3 class="content-group_title">Pickup and turn in application</h3>
    <p class="content-group_address no-margin">Caritas Management Corporation<br> 1358 Valencia St,<br> San Francisco, CA 94102</p>
    <a href="#" class="a-deep t-small d-block margin-bottom">
    <span class="ui-icon ui-static ui-medium i-primary ">
      <svg>
        <use xlink:href="#i-map"></use>
      </svg>
    </span>
    View Map
  </a>

    <div class="content-group_hours">
        <h3 class="content-group_title">Office Hours</h3>

        <p class="content-group_days">
            <span class="content-group_day">Monday&ndash;Friday</span>
            <span class="content-group_time">8:30am&ndash;12:00pm</span>
            <span class="content-group_time">1:30pm&ndash;5:00pm</span>
        </p>
        <p class="content-group_days">
            <span class="content-group_day">Saturday</span>
            <span class="content-group_time">8:30am&ndash;5:00pm</span>
        </p>
    </div>

    <div class="option-divider"><span class="or">or</span></div>
</div>
 
<div class="content-group has-divider">
  <h2 class="h-caps-lined">How to Apply</h2>
  <h3 class="content-group_title">Pickup and turn in application</h3>
  <p class="content-group_address no-margin">Caritas Management Corporation<br>
  1358 Valencia St,<br> San Francisco, CA 94102</p>
  <a href="#" class="a-deep t-small d-block margin-bottom">
    {{> @icons-base icon="map" fill="primary"}}
    View Map
  </a>

  <div class="content-group_hours">
    <h3 class="content-group_title">Office Hours</h3>
    
    <p class="content-group_days">
      <span class="content-group_day">Monday&ndash;Friday</span>
      <span class="content-group_time">8:30am&ndash;12:00pm</span>
      <span class="content-group_time">1:30pm&ndash;5:00pm</span>
    </p>
    <p class="content-group_days">
      <span class="content-group_day">Saturday</span>
      <span class="content-group_time">8:30am&ndash;5:00pm</span>
    </p>
  </div>

  <div class="option-divider"><span class="or">or</span></div>
</div>
 
/* No context defined for this component. */

There are no notes for this item.