Vitrail
x
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<!-- Default -->
<span class="inline-flex items-center rounded-full px-2 py-1 text-xs font-medium ring-1 ring-inset bg-blue-50 text-blue-700 ring-blue-700/10" > Default </span>
<!-- Info -->
<span class="inline-flex items-center rounded-full px-2 py-1 text-xs font-medium ring-1 ring-inset bg-blue-50 text-blue-700 ring-blue-700/10" > Info </span>
<!-- Positive -->
<span class="inline-flex items-center rounded-full px-2 py-1 text-xs font-medium ring-1 ring-inset bg-green-50 text-green-700 ring-green-700/10" > Positive </span>
<!-- Negative -->
<span class="inline-flex items-center rounded-full px-2 py-1 text-xs font-medium ring-1 ring-inset bg-yellow-50 text-yellow-700 ring-yellow-700/10" > Negative </span>
<!-- Warning -->
<span class="inline-flex items-center rounded-full px-2 py-1 text-xs font-medium ring-1 ring-inset bg-red-50 text-red-700 ring-red-700/10" > Warning </span>
<!-- Urgent -->
<span class="inline-flex items-center rounded-full px-2 py-1 text-xs font-medium ring-1 ring-inset bg-red-700 text-white ring-red-700/10" > Urgent </span>

No notes provided.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
# Default
render Vitrail::Badge.new.with_content("Default")
# Info
render Vitrail::Badge.new(level: :info).with_content("Info")
# Positive
render Vitrail::Badge.new(level: :positive).with_content("Positive")
# Negative
render Vitrail::Badge.new(level: :negative).with_content("Negative")
# Warning
render Vitrail::Badge.new(level: :warning).with_content("Warning")
# Urgent
render Vitrail::Badge.new(level: :urgent).with_content("Urgent")