1
0
pines/elements/badge-examples/example-03.html
2023-05-24 08:29:02 -04:00

32 lines
2.0 KiB
HTML

<span class="bg-transparent text-blue-500 border border-neutral-300 flex items-center text-xs font-semibold px-2.5 py-0.5 rounded-full">
<span class="block w-1.5 h-1.5 -ml-0.5 mr-1 bg-blue-500 rounded-full"></span>
<span>Badge</span>
</span>
<span class="bg-transparent text-gray-500 border border-neutral-300 flex items-center text-xs font-semibold px-2.5 py-0.5 rounded-full">
<span class="block w-1.5 h-1.5 -ml-0.5 mr-1 bg-gray-500 rounded-full"></span>
<span>Badge</span>
</span>
<span class="bg-transparent text-red-500 border border-neutral-300 flex items-center text-xs font-semibold px-2.5 py-0.5 rounded-full">
<span class="block w-1.5 h-1.5 -ml-0.5 mr-1 bg-red-500 rounded-full"></span>
<span>Badge</span>
</span>
<span class="bg-transparent text-green-500 border border-neutral-300 flex items-center text-xs font-semibold px-2.5 py-0.5 rounded-full">
<span class="block w-1.5 h-1.5 -ml-0.5 mr-1 bg-green-500 rounded-full"></span>
<span>Badge</span>
</span>
<span class="bg-transparent text-yellow-500 border border-neutral-300 flex items-center text-xs font-semibold px-2.5 py-0.5 rounded-full">
<span class="block w-1.5 h-1.5 -ml-0.5 mr-1 bg-yellow-500 rounded-full"></span>
<span>Badge</span>
</span>
<span class="bg-transparent text-indigo-500 border border-neutral-300 flex items-center text-xs font-semibold px-2.5 py-0.5 rounded-full">
<span class="block w-1.5 h-1.5 -ml-0.5 mr-1 bg-indigo-500 rounded-full"></span>
<span>Badge</span>
</span>
<span class="bg-transparent text-purple-500 border border-neutral-300 flex items-center text-xs font-semibold px-2.5 py-0.5 rounded-full">
<span class="block w-1.5 h-1.5 -ml-0.5 mr-1 bg-purple-500 rounded-full"></span>
<span>Badge</span>
</span>
<span class="bg-transparent text-pink-500 border border-neutral-300 flex items-center text-xs font-semibold px-2.5 py-0.5 rounded-full">
<span class="block w-1.5 h-1.5 -ml-0.5 mr-1 bg-pink-500 rounded-full"></span>
<span>Badge</span>
</span>