<div class="o-star-rating">
  <span class="u-visually-hidden">{{rating}} out of {{maxRating}} stars</span>
  {{#each ratingValue}}
    <div class="c-review-star">
      {{#ifCond this "==" 2}}
        <svg class="c-review__icon" role="img" pointer-events="none" focusable="false" aria-hidden="true">
          <use xlink:href="{{ basePath }}/assets/patterns/images/review-sprite.svg#star-solid"></use>
        </svg>
      {{/ifCond}}

      {{#ifCond this "==" 1}}
        <svg class="c-review__icon" role="img" pointer-events="none" focusable="false" aria-hidden="true">>
          <use xlink:href="{{ basePath }}/assets/patterns/images/review-sprite.svg#star-half"></use>
        </svg>
      {{/ifCond}}

      {{#ifCond this "==" 0}}
        <svg class="c-review__icon" role="img" pointer-events="none" focusable="false" aria-hidden="true">
          <use xlink:href="{{ basePath }}/assets/patterns/images/review-sprite.svg#star-empty"></use
        </svg>
      {{/ifCond}}
    </div>
  {{/each}}
</div>

