next-ucap-messenger/projects/ucap-webmessenger-ui-room/src/lib/components/list-item.component.html

<div class="list-item" matRipple>
  <dl class="item-default">
    <dt>
      <img
        class="thumbnail"
        ucapImage
        [base]="sessionVerinfo.profileRoot"
        [path]="imagePath"
        [default]="defaultPath"
      />
      <span *ngIf="roomInfo.isTimeRoom" class="text-warn-color badge-timer">
        <mat-icon>timer</mat-icon>
      </span>
    </dt>
    <dd class="info">
      <div class="detail">
        <div class="room-name">
          <div class="name">{{ getRoomName(roomInfo) }}</div>
          <div
            class="num bg-accent-light"
            *ngIf="roomInfo.roomType === RoomType.Multi"
          >
            {{ roomInfo.joinUserCount }}명
          </div>
          <div *ngIf="!checkable && !roomInfo.receiveAlarm">
            <mat-icon>notifications_off</mat-icon>
          </div>
        </div>
        <div class="room-msg">
          {{ finalEventMessage }}
        </div>
      </div>

      <div class="date">
        {{ roomInfo.finalEventDate | dateToStringChatList }}
      </div>
    </dd>
    <dd *ngIf="checkable">
      <mat-checkbox
        #checkbox
        [checked]="isChecked"
        (change)="onChangeCheck(checkbox.checked, roomInfo)"
        (click)="$event.stopPropagation()"
      >
      </mat-checkbox>
    </dd>
  </dl>

  <span
    class="notiBadge"
    *ngIf="roomInfo.noReadCnt > 0"
    [matBadgeHidden]="roomInfo.noReadCnt === 0"
    [matBadge]="roomInfo.noReadCnt"
    matBadgeOverlap="true"
    matBadgeColor="accent"
    matBadgePosition="below after"
  >
  </span>
</div>