<index-title [titles]="section.name" [more]="more"></index-title>
<div class="list count-{{ 3 * 3 }}">
  <ng-container *ngFor="let soft of softs$ | async; index as index$">
    <section class="item" *ngIf="section.rows * section.cols > index$" [routerLink]="['app', soft.id]" [class.hover]="controlRef?.show">
      <ng-container>
        <main>
          <img dstoreCover="cover" [src]="soft?.info?.cover" />
        </main>
        <footer>
          <div class="info">
            <div dstoreTips class="name">{{ soft?.info?.name }}</div>
            <div class="subtitle">
              <div class="category" [routerLink]="['/list', 'category', soft.info.category]">
                <m-category-name [category]="soft.info.category"></m-category-name>
              </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>
  </ng-container>
  <section class="item empty" *ngFor="let empty of 7 | range"></section>
</div>