next-ucap-messenger/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box/attach-file.component.html

<div class="bubble-main">
  <!--파일명에 따라 doc exe hwp ppt xls zip 으로 추가되고 나머지 파일 명은 file로 기간이 만료된 파일은 그뒤에 disable도 추가-->
  <div class="file-img" [ngClass]="fileInfo.FileExt"></div>
  <ul class="file-info">
    <li class="file-name">
      {{ fileInfo.FileName }}
    </li>
    <li class="file-size">
      {{ fileInfo.AttSize | ucapBytes }}
    </li>
    <li class="file-ext">
      {{ fileInfo.FileExt }}
    </li>
  </ul>
</div>
<div class="btn-box">
  <ul *ngIf="expired">
    <li>기간이 만료된 파일입니다.</li>
  </ul>
  <ul *ngIf="!expired && fileInfo && fileInfo.AttSEQ">
    <li>
      <button mat-button (click)="onClickSave()">Save</button>
    </li>
    <li>
      <button mat-button (click)="onClickSaveAs()">Save As</button>
    </li>
  </ul>
</div>