decentraland-ui/dist/components/CommunityBubble/CommunityBubble.css

Decentraland's UI components and styles

.dui-community-bubble {
  display: flex;
  color: white;
  border-radius: 12px;
  padding: 10px 34px 10px 19px;
  background: #161518;
  align-items: center;
  gap: 15px;
}

.dui-community-bubble__icon {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='14' viewBox='0 0 18 14'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cpath d='M-1-3h20v20H-1z'/%3E%3Cpath fill='%23676370' fill-rule='nonzero' d='M6.546.778c-.235 0-2.185.056-4.241 1.584 0 0-2.194 3.946-2.194 8.805 0 0 1.28 2.194 4.646 2.3 0 0 .564-.67 1.021-1.249-1.935-.578-2.666-1.782-2.666-1.782s.153.107.427.26c.015 0 .03.014.06.03.046.03.092.045.138.076.38.213.761.38 1.112.518.624.259 1.37.487 2.24.655 1.142.213 2.482.29 3.945.015a10.925 10.925 0 0 0 2.209-.655 8.717 8.717 0 0 0 1.751-.899s-.761 1.234-2.757 1.798c.457.563 1.006 1.218 1.006 1.218 3.366-.106 4.646-2.3 4.646-2.285 0-4.86-2.194-8.805-2.194-8.805C13.517.732 11.43.778 11.43.778l-.213.244c2.59.777 3.793 1.92 3.793 1.92a12.664 12.664 0 0 0-4.586-1.448 12.89 12.89 0 0 0-3.077.03c-.091 0-.167.016-.259.03-.533.062-1.828.245-3.458.96-.564.244-.899.427-.899.427s1.25-1.203 3.992-1.98L6.57.778h-.024zM6.16 6.399c.868 0 1.569.747 1.554 1.676 0 .93-.686 1.676-1.554 1.676-.853 0-1.554-.747-1.554-1.676 0-.93.686-1.676 1.554-1.676zm5.56 0c.853 0 1.554.747 1.554 1.676 0 .93-.685 1.676-1.554 1.676-.853 0-1.554-.747-1.554-1.676 0-.93.686-1.676 1.554-1.676z'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: contain;
  height: 20px;
  width: 28px;
  filter: brightness(0) invert(1);
}

.dui-community-bubble__text--bold {
  font-weight: 600;
}

.dui-community-bubble__text {
  display: flex;
  flex-direction: column;
  color: white;
  font-size: 12px;
}