@mesg-components/button
v1.2.0
Published
## Install
Downloads
7
Keywords
Readme
@MESG-COMPONENTS/BUTTON
Install
npm install @mesg-components/button
or yarn add @mesg-components/button
Properties
- href:
String
.Optional -> external link path - to:
[ Object, String ]
.Optional -> internal link path - submit:
Boolean
.Optional -> determine it's a submit button - primary:
Boolean
.Optional -> determine it's a primary button - small:
Boolean
.Optional -> Button size - secondary:
Boolean
.Optional -> determine it's a secondary button - white:
Boolean
.Optional -> determine it's a white button - outline:
Boolean
.Optional -> determine it's a outline button - icon:
String
.Optional -> icon class name
Slot
default
Example
Default Button:
<template>
<button>Default Button</button>
</template>
Primary and submit Button:
<template>
<button primary submit>Primary Button</button>
</template>
Secondary Button with small:
<template>
<button secondary small>Secondary Button</button>
</template>
White Button:
<template>
<button white>White Button</button>
</template>
Outline Button:
<template>
<button outline>Outline Button</button>
</template>
External link Button:
<template>
<button :href="www.google.com" target="_blank">External Button</button>
</template>
Internal link Button:
<template>
<button :href="/">Internal Button</button>
<!-- using nuxt-link -->
<button :to="/">Internal Button</button>
</template>
Button with icon:
<template>
<button primary :icon="fal fa-table">With icon Button</button>
</template>