G-Loot DS — avatar group with counter

by Augustin Hiebel

HTML

<!-- avatar-tiny -->
<div className="avatar-group -space-x-2">
  <div className="avatar avatar-circle avatar-tiny">
    <div>
      <img src="https://res.cloudinary.com/gloot/image/upload/v1655292255/Marketing/2022_prototype/DummyContent/avatars/avatar_user_1.jpg" />
    </div>
  </div>
  <div className="avatar avatar-circle avatar-tiny">
    <div>
      <img src="https://res.cloudinary.com/gloot/image/upload/v1655292255/Marketing/2022_prototype/DummyContent/avatars/avatar_user_2.jpg" />
    </div>
  </div>
  <div className="avatar avatar-circle avatar-tiny">
    <div>
      <img src="https://res.cloudinary.com/gloot/image/upload/v1655292255/Marketing/2022_prototype/DummyContent/avatars/avatar_user_3.jpg" />
    </div>
  </div>
  <div className="avatar avatar-circle avatar-tiny">
    <div>
      <span>+12</span>
    </div>
  </div>
</div>

<!-- avatar-xs -->
<div className="avatar-group -space-x-3">
  <div className="avatar avatar-circle avatar-xs">
    <div>
      <img src="https://res.cloudinary.com/gloot/image/upload/v1655292255/Marketing/2022_prototype/DummyContent/avatars/avatar_user_1.jpg" />
    </div>
  </div>
  <div className="avatar avatar-circle avatar-xs">
    <div>
      <img src="https://res.cloudinary.com/gloot/image/upload/v1655292255/Marketing/2022_prototype/DummyContent/avatars/avatar_user_2.jpg" />
    </div>
  </div>
  <div className="avatar avatar-circle avatar-xs">
    <div>
      <img src="https://res.cloudinary.com/gloot/image/upload/v1655292255/Marketing/2022_prototype/DummyContent/avatars/avatar_user_3.jpg" />
    </div>
  </div>
  <div className="avatar avatar-circle avatar-xs">
    <div>
      <span>+12</span>
    </div>
  </div>
</div>

<!-- avatar-sm -->
<div className="avatar-group -space-x-4">
  <div className="avatar avatar-circle avatar-sm">
    <div>
      <img src="https://res.cloudinary.com/gloot/image/upload/v1655292255/Marketing/2022_prototype/DummyContent/avatars/avatar_user_1.jpg" />
    </div>
  </div>
  <div...