mirror of
https://github.com/uiverse-io/galaxy.git
synced 2025-11-28 13:10:21 +08:00
43 lines
No EOL
1.5 KiB
HTML
43 lines
No EOL
1.5 KiB
HTML
<!-- From Uiverse.io by hoshikawamaki - Tags: simple, purple, button, radio, colorful, border, tailwindcss -->
|
|
<div
|
|
class="flex space-x-2 border-[3px] border-purple-400 rounded-xl select-none"
|
|
>
|
|
<label
|
|
class="radio flex flex-grow items-center justify-center rounded-lg p-1 cursor-pointer"
|
|
>
|
|
<input
|
|
type="radio"
|
|
name="radio"
|
|
value="html"
|
|
class="peer hidden"
|
|
checked=""
|
|
/>
|
|
<span
|
|
class="tracking-widest peer-checked:bg-gradient-to-r peer-checked:from-[blueviolet] peer-checked:to-[violet] peer-checked:text-white text-gray-700 p-2 rounded-lg transition duration-150 ease-in-out"
|
|
>HTML</span
|
|
>
|
|
</label>
|
|
|
|
<label
|
|
class="radio flex flex-grow items-center justify-center rounded-lg p-1 cursor-pointer"
|
|
>
|
|
<input type="radio" name="radio" value="react" class="peer hidden" />
|
|
<span
|
|
class="tracking-widest peer-checked:bg-gradient-to-r peer-checked:from-[blueviolet] peer-checked:to-[violet] peer-checked:text-white text-gray-700 p-2 rounded-lg transition duration-150 ease-in-out"
|
|
>React</span
|
|
>
|
|
</label>
|
|
|
|
<label
|
|
class="radio flex flex-grow items-center justify-center rounded-lg p-1 cursor-pointer"
|
|
>
|
|
<input type="radio" name="radio" value="vue" class="peer hidden" />
|
|
<span
|
|
class="tracking-widest peer-checked:bg-gradient-to-r peer-checked:from-[blueviolet] peer-checked:to-[violet] peer-checked:text-white text-gray-700 p-2 rounded-lg transition duration-150 ease-in-out"
|
|
>Vue</span
|
|
>
|
|
</label>
|
|
</div>
|
|
|
|
|
|
|