next-ucap-messenger/projects/ucap-webmessenger-app/src/app/pages/template/components/template.page.component.html

<div fxLayout="column">
  <button
    mat-raised-button
    color="accent"
    class="submit-button"
    aria-label="Login"
    (click)="onClickLogin()"
  >
    Login
  </button>

  <h3>User-list-item</h3>
  <div>
    <ucap-profile-user-list-item
      [userInfo]="userInfo"
      [profileImageRoot]="profileImageRoot"
      [presence]="presence"
    >
    </ucap-profile-user-list-item>
    <ucap-profile-user-list-item
      [userInfo]="userInfo"
      [profileImageRoot]="profileImageRoot"
    >
    </ucap-profile-user-list-item>
    <ucap-profile-user-list-item
      [userInfo]="userInfo"
      [profileImageRoot]="profileImageRoot"
      [checkable]="true"
    >
    </ucap-profile-user-list-item>
  </div>
  <h3>Chat::MessageBox</h3>
  <div>
    <div>
      <div>
        date splitter
      </div>
      <div>
        <ucap-chat-message-box-date-splitter></ucap-chat-message-box-date-splitter>
      </div>
    </div>
    <div>
      <div>
        file
      </div>
      <div>
        <ucap-chat-message-box-file></ucap-chat-message-box-file>
      </div>
    </div>
    <div>
      <div>
        image
      </div>
      <div>
        <ucap-chat-message-box-image></ucap-chat-message-box-image>
      </div>
    </div>
    <div>
      <div>
        information
      </div>
      <div>
        <ucap-chat-message-box-information></ucap-chat-message-box-information>
      </div>
    </div>
    <div>
      <div>
        mass-translation
      </div>
      <div>
        <ucap-chat-message-box-mass-translation></ucap-chat-message-box-mass-translation>
      </div>
    </div>
    <div>
      <div>
        mass
      </div>
      <div>
        <ucap-chat-message-box-mass></ucap-chat-message-box-mass>
      </div>
    </div>
    <div>
      <div>
        notice
      </div>
      <div>
        <ucap-chat-message-box-notice></ucap-chat-message-box-notice>
      </div>
    </div>
    <div>
      <div>
        recall
      </div>
      <div>
        <ucap-chat-message-box-recall></ucap-chat-message-box-recall>
      </div>
    </div>
    <div>
      <div>schedule</div>
      <div>
        <ucap-chat-message-box-schedule></ucap-chat-message-box-schedule>
      </div>
    </div>
    <div>
      <div>
        sticker
      </div>
      <div>
        <ucap-chat-message-box-sticker></ucap-chat-message-box-sticker>
      </div>
    </div>
    <div>
      <div>
        text
      </div>
      <div>
        <ucap-chat-message-box-text></ucap-chat-message-box-text>
      </div>
    </div>
    <div>
      <div>
        translation
      </div>
      <div>
        <ucap-chat-message-box-translation></ucap-chat-message-box-translation>
      </div>
    </div>
    <div>
      <div>
        video
      </div>
      <div>
        <ucap-chat-message-box-video></ucap-chat-message-box-video>
      </div>
    </div>
    <div>
      <div>
        video-conference
      </div>
      <div>
        <ucap-chat-message-box-video-conference></ucap-chat-message-box-video-conference>
      </div>
    </div>
  </div>
</div>