source: src/Clients/Angular/finki-chattery/src/app/shared-app/components/question/question-preview/question-preview.component.html@ dab7a9b

<div *ngIf="!working">
  <mat-card appHoverElevation class="margin-bottom-xl">
    <mat-card-title>{{ question.title }}</mat-card-title>
    <mat-card-subtitle
      [innerHTML]="
        'question-preview-subtitle'
          | translate
            : {
                createdOn: question.createdOn | momentDate: 'LLLL',
                lastActive: question.lastActiveOn | momentDate: 'LLLL',
                views: question.views
              }
      "
    ></mat-card-subtitle>
    <mat-card-content>
      <mat-chip-list>
        <mat-chip *ngFor="let category of question.categories">
          {{ category.name }}
        </mat-chip>
      </mat-chip-list>

      <div class="margin-top-lg" [innerHTML]="question.text"></div>
      <div class="align-right">
        <app-student-card
          [indexNumber]="question.student.index"
          [imageUrl]="question.student.imageUrl"
          [uid]="question.student.uid"
          [reputation]="question.student.reputation"
          [subtitle]="'question-asked-by-subtitle' | translate: { date: question.createdOn | momentDate: 'LL' }"
        ></app-student-card>
      </div>
    </mat-card-content>
    <mat-card-actions>
      <app-button appShareLink [buttonType]="ButtonType.Basic">{{ 'share-link' | translate }}</app-button>
    </mat-card-actions>
  </mat-card>

  <h1 class="mat-headline">{{ 'question-answers' | translate: { answerCount: question.answers.length } }}</h1>
  <mat-button-toggle-group>
    <mat-button-toggle>{{ 'answer-sort-oldest' | translate }}</mat-button-toggle>
    <mat-button-toggle>{{ 'answer-sort-votes' | translate }}</mat-button-toggle>
  </mat-button-toggle-group>

  <ng-container *ngFor="let answer of question.answers">
    <mat-card appHoverElevation class="margin-x-md">
      <mat-card-content>
        <div fxLayout="row wrap" fxLayoutAlign="space-around none">
          <app-vote [voteCount]="answer.upvotesCount" [correct]="answer.correctAnswer" fxFlex="6%"></app-vote>
          <div fxFlex="92%">
            <div [innerHTML]="answer.text"></div>
            <div class="align-right">
              <app-student-card
                [indexNumber]="answer.student.index"
                [imageUrl]="answer.student.imageUrl"
                [uid]="answer.student.uid"
                [reputation]="answer.student.reputation"
                [subtitle]="'question-answered-by-subtitle' | translate: { date: answer.createdOn | momentDate: 'LL' }"
              ></app-student-card>
            </div>

            <hr />
            <div *ngFor="let answerResponse of answer.answerResponses">
              {{ answerResponse.text }}
              <mat-chip class="cursor" selected>{{ answerResponse.student.index }}</mat-chip> -
              {{ answerResponse.createdOn | momentDate: 'LL' }}
              <hr />
            </div>
          </div>
        </div>
      </mat-card-content>
      <mat-card-actions> </mat-card-actions>
    </mat-card>
  </ng-container>
</div>