BetterUi Components

Previews

No matching results.

x
1
2
3
4
5
6
7
8
9
<a href="#" class="flex items-center px-4 py-2 rounded-md transition-colors bg-primary-50 text-primary-700">
  <span class="w-5 h-5 mr-3 shrink-0">
    <svg class='w-5 h-5' fill='none' stroke='currentColor' viewBox='0 0 24 24'><path stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M15 17h5l-1.405-1.405A2.032 2.032 0 0118 14.158V11a6.002 6.002 0 00-4-5.659V5a2 2 0 10-4 0v.341C7.67 6.165 6 8.388 6 11v3.159c0 .538-.214 1.055-.595 1.436L4 17h5m6 0v1a3 3 0 11-6 0v-1m6 0H9'></path></svg>
  </span>
  <span>Notifications</span>
  <span class="ml-auto text-xs font-medium px-2 py-0.5 rounded-full bg-primary-100 text-primary-700">
    99+
  </span>
</a>
1
2
3
4
5
6
7
8
9
10
render BetterUi::Drawer::NavItemComponent.new(
  label: "Notifications",
  href: "#",
  active: true
) do |item|
  item.with_icon do
    "<svg class='w-5 h-5' fill='none' stroke='currentColor' viewBox='0 0 24 24'><path stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M15 17h5l-1.405-1.405A2.032 2.032 0 0118 14.158V11a6.002 6.002 0 00-4-5.659V5a2 2 0 10-4 0v.341C7.67 6.165 6 8.388 6 11v3.159c0 .538-.214 1.055-.595 1.436L4 17h5m6 0v1a3 3 0 11-6 0v-1m6 0H9'></path></svg>".html_safe
  end
  item.with_badge { "99+" }
end

No notes provided.

No params configured.