<button class="btn btn-xs sm:btn-sm md:btn-md lg:btn-lg">
responsive
</button>
@!jrmc.button({ text: 'responsive', class: 'btn-xs sm:btn-sm md:btn-md lg:btn-lg' })
Doc : daisyui button
Buttons allows user to take actions or make choices.
| Class name | Type | |
|---|---|---|
| btn | Component | Button |
| btn-primary | Modifier | Button with primary color |
| btn-secondary | Modifier | Button with secondary color |
| btn-accent | Modifier | Button with accent color |
| btn-info | Modifier | Button with info color |
| btn-success | Modifier | Button with success color |
| btn-warning | Modifier | Button with warning color |
| btn-error | Modifier | Button with error color |
| btn-ghost | Modifier | Button with ghost style |
| btn-link | Modifier | Button styled as a link |
| btn-outline | Modifier | Transparent Button with colored border |
| btn-active | Modifier | Force button to show active state |
| btn-disabled | Modifier | Force button to show disabled state |
| glass | Modifier | Button with a glass effect |
| loading | Modifier | Shows loading spinner |
| no-animation | Modifier | Disables click animation |
| btn-lg | Responsive | Large button |
| btn-md | Responsive | Medium button (default) |
| btn-sm | Responsive | Small button |
| btn-xs | Responsive | Extra small button |
| btn-wide | Responsive | Wide button (more horizontal padding) |
| btn-block | Responsive | Full width button |
| btn-circle | Responsive | Circle button with a 1:1 ratio |
| btn-square | Responsive | Square button with a 1:1 ratio |
/!\ Deprecated
Button group daisyUI >= 3, use join