<div class='bits-card--standard bits-card--promo'>
  <button {{action 'close'}} class='bits-promo__close'>
    {{partial 'svg/close-small'}}
  </button>
  <div class='bits-promo__content'>
    <div class='bits-promo__image'>
      {{#if (eq pageIndex 0)}}
        <img class='bits-promo__static' src='{{chatImageUrl}}'>
      {{else}}
        {{bits/emote-image amount=100 size=4 classNames='bits-promo__emote'}}
        {{bits/emote-image amount=10000 size=4 classNames='bits-promo__emote'}}
        {{bits/emote-image amount=5000 size=4 classNames='bits-promo__emote'}}
      {{/if}}
    </div>

    <div class='bits-promo__header'>
      {{bits-string 'eligible_for_bits_notification_header'}}
    </div>

    <div class='bits-card__text pd-x-2'>
      {{#if (eq pageIndex 0)}}
        {{bits-string 'eligible_for_bits_notification_body_1' '' (hash blogLink=readMoreLink)}}
      {{else}}
        {{bits-string 'eligible_for_bits_notification_body_2' '' (hash dashboardLink=yourDashboardLink)}}
      {{/if}}
    </div>

    <div class='bits-promo__action'>
      <div class='bits-promo__nav'>
        <ul class='bits-promo__dots'>
          {{#each pageDots as |dot|}}
            <li class='bits-promo__dot {{if dot.isSelected 'bits-promo__dot--selected'}}' {{action 'goToPage' dot.pageNum}}></li>
          {{/each}}
        </ul>
      </div>

      {{#if (eq pageIndex 0)}}
        <button class='button' {{action 'nextPage'}}>
          {{bits-string 'promo_card_btn_next'}}
        </button>
      {{else}}
        <button class='button' {{action 'completePromo'}}>
          {{bits-string 'promo_card_btn_complete'}}
        </button>
      {{/if}}
    </div>
  </div>
</div>
