<div class="content-card loading loading-panel">
    <h4 class="content-card_title">Certificate of Preference</h4>

    <p class="c-steel">Certificate of Preference holders are primarily households displaced by Agency action in Redevelopment Project Areas during the 1960s and 1970s, but may also include other persons displaced by Agency action.

    </p>
    <div class="spinner sk-fading-circle">
        <div class="sk-circle1 sk-circle"></div>
        <div class="sk-circle2 sk-circle"></div>
        <div class="sk-circle3 sk-circle"></div>
        <div class="sk-circle4 sk-circle"></div>
        <div class="sk-circle5 sk-circle"></div>
        <div class="sk-circle6 sk-circle"></div>
        <div class="sk-circle7 sk-circle"></div>
        <div class="sk-circle8 sk-circle"></div>
        <div class="sk-circle9 sk-circle"></div>
        <div class="sk-circle10 sk-circle"></div>
        <div class="sk-circle11 sk-circle"></div>
        <div class="sk-circle12 sk-circle"></div>
    </div>
</div>
<div class="content-card loading loading-panel">
  <h4 class="content-card_title{{#if subtitle}} no-margin{{/if}}">{{default name 'Certificate of Preference'}}</h4>
  {{#if has-subtitle}}<p class="c-steel">{{default subtitle ' 11 units'}}</p>{{/if}}
  <p class="c-steel">{{default description 'Certificate of Preference holders are primarily households displaced by Agency action in Redevelopment Project Areas during the 1960s and 1970s, but may also include other persons displaced by Agency action.'}}
  {{#if more}}<br><a href="#">Read More</a>{{/if}}
  </p>
  {{> @spinner }}
</div>
/* No context defined for this component. */

Use loading-panel in conjunction with loading as state classes applied directly to the component to indicate that component is loading.