Buttons
Use Black Dashboard's custom button styles for actions in forms, dialogs, and more with support for multiple sizes, states, and more.
import {BaseButton} from '@/components'
Global usage
Vue.component(BaseButton.name, BaseButton)
For local usage
export default {
components: {
BaseButton
}
}
Examples
Black Dashboard has changed the predefined button styles from Bootstrap, each serving its own semantic purpose, with a few extras thrown in for more control.
Animation on hover
Style buttons
Sizes
Fancy larger or smaller buttons? Add size="lg"
or "size="sm" for additional sizes.
Disabled state
Make buttons look inactive by adding the disabled
boolean attribute to the component
Disabled buttons using the <a>
element behave a bit different:
<a>
s don’t support the disabled attribute, so you must add the .disabled class to make it visually appear disabled.- Some future-friendly styles are included to disable all pointer-events on anchor buttons. In browsers which support that property, you won’t see the disabled cursor at all.
Props
← Breadcrumb Cards →