<section class="item" *ngFor="let soft of list" [class.hover]="controlRef.show">
  <ng-container>
    <main [routerLink]="[soft.id]">
      <img dstoreCover="cover" [src]="soft?.info?.cover" />
    </main>
    <footer>
      <div class="info" [routerLink]="[soft.id]">
        <div class="name" [style.color]="nameColor">
          {{ soft?.info?.name }}
        </div>
        <div class="subtitle" [style.color]="subtitleColor">
          <div class="category">
            <!-- {{ slogan ? soft?.info?.slogan : (soft?.info?.category | categoryText | async) }} &nbsp; -->
            <div *ngIf="slogan;else elsecategory">{{soft?.info?.slogan}}</div>
            <ng-template #elsecategory>
              <m-category-name [category]="soft?.info?.category"></m-category-name>
              <!-- {{soft?.info?.category}} -->
            </ng-template>
          </div>
          <dstore-star *ngIf="soft.stat.score_count >= 20" [rate]="soft.stat.score / 2 || 0"></dstore-star>
          <span *ngIf="soft.stat.score_count < 20" i18n></span>
        </div>
      </div>
      <div class="control">
        <dstore-control #controlRef [soft]="soft"></dstore-control>
      </div>
    </footer>
  </ng-container>
</section>
<section #loadingRef class="item wait">
  <app-wait *ngIf="wait"></app-wait>
</section>
<section class="item" *ngFor="let empty of 7 | range" [style.height]="0" [style.padding]="0"></section>