66 lines
2.2 KiB
Svelte
66 lines
2.2 KiB
Svelte
<h3 class="text-lg">badges</h3>
|
||
<span
|
||
class="text-sm font-medium bg-green-100 py-1 px-2 rounded text-green-500 align-middle"
|
||
>Paid</span
|
||
>
|
||
<span
|
||
class="text-sm font-medium bg-red-100 py-1 px-2 rounded text-red-500 align-middle"
|
||
>Overdue</span
|
||
>
|
||
<span class="rounded-sm py-1 px-2 text-xs font-medium text-white bg-blue-600"
|
||
>Primary</span
|
||
>
|
||
<span class="rounded-sm py-1 px-2 text-xs font-medium text-white bg-gray-600"
|
||
>Secondary</span
|
||
>
|
||
<span class="rounded-sm py-1 px-2 text-xs font-medium text-white bg-green-600"
|
||
>Success</span
|
||
>
|
||
<span class="rounded-sm py-1 px-2 text-xs font-medium text-white bg-red-600"
|
||
>Danger</span
|
||
>
|
||
<span class="rounded-sm py-1 px-2 text-xs font-medium text-black bg-yellow-400"
|
||
>Warning</span
|
||
>
|
||
<span class="rounded-sm py-1 px-2 text-xs font-medium text-white bg-indigo-300"
|
||
>Info</span
|
||
>
|
||
<span class="rounded-sm py-1 px-2 text-xs font-medium text-black bg-gray-200"
|
||
>Light</span
|
||
>
|
||
<span class="rounded-sm py-1 px-2 text-xs font-medium text-white bg-gray-900"
|
||
>Dark</span
|
||
>
|
||
<h3 class="text-lg">closable badges</h3>
|
||
<span class="rounded-sm py-1 px-2 text-xs font-medium text-white bg-blue-600">
|
||
Primary
|
||
<span class="ml-2 text-base cursor-pointer">×</span>
|
||
</span>
|
||
<span class="rounded-sm py-1 px-2 text-xs font-medium text-white bg-gray-600">
|
||
Secondary
|
||
<span class="ml-2 text-base cursor-pointer">×</span>
|
||
</span>
|
||
<span class="rounded-sm py-1 px-2 text-xs font-medium text-white bg-green-600">
|
||
Success
|
||
<span class="ml-2 text-base cursor-pointer">×</span>
|
||
</span>
|
||
<span class="rounded-sm py-1 px-2 text-xs font-medium text-white bg-red-600">
|
||
Danger
|
||
<span class="ml-2 text-base cursor-pointer">×</span>
|
||
</span>
|
||
<span class="rounded-sm py-1 px-2 text-xs font-medium text-black bg-yellow-400">
|
||
Warning
|
||
<span class="ml-2 text-base cursor-pointer">×</span>
|
||
</span>
|
||
<span class="rounded-sm py-1 px-2 text-xs font-medium text-white bg-indigo-300">
|
||
Info
|
||
<span class="ml-2 text-base cursor-pointer">×</span>
|
||
</span>
|
||
<span class="rounded-sm py-1 px-2 text-xs font-medium text-black bg-gray-200">
|
||
Light<span class="ml-2 text-base cursor-pointer">×</span>
|
||
</span>
|
||
<span class="rounded-sm py-1 px-2 text-xs font-medium text-white bg-gray-900">
|
||
Dark
|
||
<span class="ml-2 text-base cursor-pointer">×</span>
|
||
</span>
|