@collab-ui/core/scss/components/activity-button/examples/default.html

Cisco Collab UI CSS Framework

<div class="cui-button__container--small">
  <button
    class="cui-button cui-button--circle cui-button--68 cui-activity cui-activity__chat"
    alt="Chat" type="button" aria-label="Chat">
    <span class="cui-button__children">
      <i class="icon icon-chat_28"></i>
    </span>
  </button>
  <div class="cui-button__label">Chat</div>
</div>
<div class="cui-button__container--small">
  <button
    class="cui-button cui-button--circle cui-button--68 cui-activity cui-activity__camera"
    alt="camera" type="button" aria-label="camera">
    <span class="cui-button__children">
      <i class="icon icon-camera_28"></i>
    </span>
  </button>
  <div class="cui-button__label">Camera</div>
</div>
<div class="cui-button__container--small">
  <button
    class="cui-button cui-button--circle cui-button--68 cui-activity cui-activity__meetings"
    alt="meetings" type="button" aria-label="meetings">
    <span class="cui-button__children">
      <i class="icon icon-meetings_28"></i>
    </span>
  </button>
  <div class="cui-button__label">Meetings</div>
</div>
<div class="cui-button__container--small">
  <button
    class="cui-button cui-button--circle cui-button--68 cui-activity cui-activity__whiteboard"
    alt="whiteboard" type="button" aria-label="whiteboard">
    <span class="cui-button__children">
      <i class="icon icon-whiteboard_28"></i>
    </span>
  </button>
  <div class="cui-button__label">Whiteboard</div>
</div>
<div class="cui-button__container--small">
  <button
    class="cui-button cui-button--circle cui-button--68 cui-activity cui-activity__files"
    alt="files" type="button" aria-label="files">
    <span class="cui-button__children">
      <i class="icon icon-files_28"></i>
    </span>
  </button>
  <div class="cui-button__label">Files</div>
</div>
<div class="cui-button__container--small">
  <button
    class="cui-button cui-button--circle cui-button--68 cui-activity cui-activity__share-screen"
    alt="share-screen" type="button" aria-label="share-screen">
    <span class="cui-button__children">
      <i class="icon icon-share-screen_28"></i>
    </span>
  </button>
  <div class="cui-button__label">Share</div>
</div>
<div class="cui-button__container--small">
  <button
    class="cui-button cui-button--circle cui-button--68 cui-activity cui-activity__tasks"
    alt="tasks" type="button" aria-label="tasks">
    <span class="cui-button__children">
      <i class="icon icon-tasks_28"></i>
    </span>
  </button>
  <div class="cui-button__label">Tasks</div>
</div>