Fluxbit ViewComponents
x
1
2
3
4
5
<div class="flex -space-x-4 rtl:space-x-reverse">
  <div class="inline-flex overflow-hidden relative justify-center items-center bg-gray-200 dark:bg-gray-600 rounded-full w-10 h-10 p-1 ring-2 ring-pink-500 dark:ring-pink-500"><span class="font-medium text-gray-600 dark:text-gray-300">AM</span></div>
  <div class="inline-flex overflow-hidden relative justify-center items-center bg-gray-200 dark:bg-gray-600 rounded-full w-10 h-10 p-1 ring-2 ring-purple-500 dark:ring-purple-600"><span class="font-medium text-gray-600 dark:text-gray-300">FX</span></div>
  <div class="inline-flex overflow-hidden relative justify-center items-center bg-gray-200 dark:bg-gray-600 rounded-full w-10 h-10 p-1 ring-2 ring-green-500 dark:ring-green-500"><span class="font-medium text-gray-600 dark:text-gray-300">BG</span></div>
</div>
1
2
3
4
5
<%= fx_avatar_group do |group| %>
  <%= group.with_avatar(color: :pink, placeholder_initials: "AM") %>
  <%= group.with_avatar(color: :purple, placeholder_initials: "FX") %>
  <%= group.with_avatar(color: :success, placeholder_initials: "BG") %>
<% end %>

No notes provided.

No params configured.