<div class="feed-messages-container">
  <div class="feed-message" *ngFor="let message of feed" (click)="expandMessage(message)">
    <div class="message-icon" *ngIf="message.type == 'text-message'">
      <img class="photo-icon" src="{{ ( message.author | baProfilePicture ) }}">
    </div>
    <div class="message-icon" *ngIf="message.type != 'text-message'">
      <img class="photo-icon" src="{{ ( message.author | baProfilePicture ) }}">
      <span class="sub-photo-icon" [ngClass]="message.type"></span>
    </div>
    <div class="text-block text-message">
      <div class="message-header">
        <span class="author">{{ message.author }} {{ message.surname}}</span>
      </div>
      <div class="message-content line-clamp" [ngClass]="{'line-clamp-2' : !message.expanded}">
        <span *ngIf="message.preview">{{ message.header }} </span>{{ message.text }}
      </div>
      <div class="preview" [ngClass]="{'hidden': !message.expanded}" *ngIf="message.preview">
        <a href="{{ message.link }}" target="_blank">
          <img src="{{ ( message.preview | baAppPicture )}}">
        </a>
      </div>
      <div [ngClass]="{'hidden': !message.expanded}" class="message-time">
        <div class="post-time">
          {{ message.time }}
        </div>
        <div class="ago-time">
          {{ message.ago }}
        </div>
      </div>
    </div>
  </div>
</div>
