<ul class="m-0">
  <li class="d-flex align-items-center">
    <a href="#" class="w-100" onclick="NativeBridgeDelegate.joinRoom({{roomId}},'{{roomName}}');">
      <div class="chat_item d-flex flex-row align-items-center">
        <div class="chat_item_l">
          <div class="thumbnail{{thumbnailCount}} thumbnail">
            {{#attendUsers}}
            <div class="img_wrap"><img src="{{profileUrl}}" onError="this.src='./img/noImage.png'"/></div>
            {{/attendUsers}}
            {{^attendUsers}}
            <div class="img_wrap"><img src='./img/noImage.png'/></div>
            {{/attendUsers}}
          </div>
        </div>
        <div class="chat_item_m px-0">
          <div class="d-flex flex-column">
            <div class="d-flex flex-row">
              <div class="chat_item_t ">
                <span class="chat_item_ttl">{{roomName}}</span>
              </div>
              <span class="chat_item_num">({{userCnt}})</span>
            </div>
            <div class="chat_item_desc">
              {{lastMessage}}
            </div>
          </div>
        </div>
        <div class="chat_item_r">
          <div class="d-flex flex-column">
            <span class="chat_item_time">{{time}}</span>
            {{#unreadMsgCnt}}
            <span class="chat_item_unread room-{{roomId}}-unread">{{unreadMsgCnt}}</span>
            {{/unreadMsgCnt}}
          </div>
        </div>
      </div>
    </a>
  </li>
</ul>