Button
Buttons in various variants and sizes
Basic Usage
HTML
<button class="bl-btn bl-btn-primary">Primary Button</button>
Variants
HTML
<button class="bl-btn bl-btn-primary">Primary</button>
<button class="bl-btn bl-btn-secondary">Secondary</button>
<button class="bl-btn bl-btn-outline">Outline</button>
<button class="bl-btn bl-btn-ghost">Ghost</button>
<button class="bl-btn bl-btn-link">Link</button>
Semantic Variants
HTML
<button class="bl-btn bl-btn-success">Success</button>
<button class="bl-btn bl-btn-warning">Warning</button>
<button class="bl-btn bl-btn-error">Error</button>
<button class="bl-btn bl-btn-info">Info</button>
Sizes
HTML
<button class="bl-btn bl-btn-primary bl-btn-sm">Small</button>
<button class="bl-btn bl-btn-primary">Default</button>
<button class="bl-btn bl-btn-primary bl-btn-lg">Large</button>
Block Button
HTML
<button class="bl-btn bl-btn-primary bl-btn-block">Block Button</button>
Disabled State
HTML
<button class="bl-btn bl-btn-primary" disabled>Disabled</button>
<button class="bl-btn bl-btn-secondary bl-disabled">Disabled Class</button>