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

<!--체크박스 보여줄때는 <div class="list-item checkbox" matRipple>  클래스에 checkbox만 추가-->
<div class="list-item checkbox" matRipple>
  <!--presence-pcOn , presence-pcOut  presence-pcOff , presence-pcOther-->
  <span class="presence-pcOn" *ngIf="presence">{{ presence.pcStatus }} </span>
  <div class="item-default">
    <img
      class="thumbnail"
      src="{{ profileImageRoot + userInfo.profileImageFile }}"
    />
    <ul class="info">
      <li class="name">{{ userInfo.name }} {{ userInfo.grade }}</li>
      <li class="dept">
        {{ userInfo.deptName }}
        가나다라마바사아자차카파하가나다라마바사아자차카파하
      </li>
      <li class="record">{{ userInfo.intro }}</li>
    </ul>
  </div>
  <mat-checkbox *ngIf="checkable"></mat-checkbox>
</div>