0.1.0 • Published 3 years ago

vue-awesome-button

Licence

—

Version

0.1.0

Deps

Size

31 kB

Vulns

Weekly

Summary Dependency Versions

Vue Awesome Button

Vue Awesome Button is a Vue 3 compatible component that renders an animated 3D button, for you tu use in your own projects.

Acknowledgments

This project is based on Rafael Caferati's work and his very own React Awesome Button. He's an increible award winning software engineer, so go and check some of the amazing stuff he has made.

Instalation

Using npm:

npm install --save vue-awesome-button

Using yarn:

yarn add vue-awesome-button

`AwesomeButton` example

// main.ts
import { createApp } from 'vue'
import App from './App.vue'

import "vue-awesome-button/style"; // import the button's syles

createApp(App).mount('#app')

<!-- App.vue -->
<template>
  <AwesomeButton>Hello World</AwesomeButton>
</template>
<script lang="ts">
import { AwesomeButton } from 'vue-awesome-button';
</script>

`AwesomeButton` props

Attribute	Type	Default	Description
disabled	`boolean`	`false`	Renders the disabled button and disables the button's actions
disable-move-events	`boolean`	`false`	If set to `true`, when hovering the button, it will only be pressed from the middle
hidden	`boolean`	`false`	Changes the opacity of the button
size	`null \| "small" \| "medium" \| "large"`	`null`	Changes the size of the button
type	`"primary" \| "secondary" \| "link" \| "danger"`	`"primary"`	Sets the button's variant