@momentum-ui/react-collaboration/scss/components/activity-button/examples/large.html

Cisco Momentum UI Framework for React Collaboration Applications

<div class="md-button__container">
  <button
    class="md-button md-button--circle md-button--84 md-activity md-activity__chat"
    alt="Chat" type="button" aria-label="Chat">
    <span class="md-button__children">
      <i class="icon icon-chat_36"></i>
    </span>
  </button>
  <div class="md-button__label">Chat</div>
</div>
<div class="md-button__container">
  <button
    class="md-button md-button--circle md-button--84 md-activity md-activity__camera"
    alt="Camera" type="button" aria-label="Camera">
    <span class="md-button__children">
      <i class="icon icon-camera_36"></i>
    </span>
  </button>
  <div class="md-button__label">Camera</div>
</div>
<div class="md-button__container">
  <button
    class="md-button md-button--circle md-button--84 md-activity md-activity__meetings"
    alt="Meetings" type="button" aria-label="Meetings">
    <span class="md-button__children">
      <i class="icon icon-meetings_36"></i>
    </span>
  </button>
  <div class="md-button__label">Meetings</div>
</div>
<div class="md-button__container">
  <button
    class="md-button md-button--circle md-button--84 md-activity md-activity__whiteboard"
    alt="Whiteboard" type="button" aria-label="Whiteboard">
    <span class="md-button__children">
      <i class="icon icon-whiteboard_36"></i>
    </span>
  </button>
  <div class="md-button__label">Whiteboard</div>
</div>
<div class="md-button__container">
  <button
    class="md-button md-button--circle md-button--84 md-activity md-activity__files"
    alt="Files" type="button" aria-label="Files">
    <span class="md-button__children">
      <i class="icon icon-files_36"></i>
    </span>
  </button>
  <div class="md-button__label">Files</div>
</div>
<div class="md-button__container">
  <button
    class="md-button md-button--circle md-button--84 md-activity md-activity__share-screen"
    alt="Share" type="button" aria-label="Share">
    <span class="md-button__children">
      <i class="icon icon-share-screen_36"></i>
    </span>
  </button>
  <div class="md-button__label">Share</div>
</div>
<div class="md-button__container">
  <button
    class="md-button md-button--circle md-button--84 md-activity md-activity__tasks"
    alt="Tasks" type="button" aria-label="Tasks" title="tasks">
    <span class="md-button__children">
      <i class="icon icon-tasks_36"></i>
    </span>
  </button>
  <div class="md-button__label">Tasks</div>
</div>