parent
d188ae658a
commit
2fa102b543
53
src/components/Badges.svelte
Normal file
53
src/components/Badges.svelte
Normal file
@ -0,0 +1,53 @@
|
|||||||
|
<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>
|
Loading…
x
Reference in New Issue
Block a user