1.1.2 • Public • Published

Annoying Submit Button in a Form using Vue.js

Issues GitHub pull requests GitHub pull requests

You won't be able to submit the form until you satisfy your own conditions. Enjoy playing with it. :)

✍️ Authors

👤 Ricardo Castanho


🫂 Show your support

Give a ⭐️ if you like this project and want to support it!

🛠️ Usage example

  1. Install the project
pnpm install vue-annoying-button
  1. Register the annoying plugin
// main.ts
import { createApp } from 'vue'
import AnnoyingPlugin from 'vue-annoying-button'

import App from './App.vue'

  1. Use it on your components
// App.vue
    <v-annoying-button :annoy="true" range="20vw" class="submit-button">
      Annoy me

<style scoped>
header {
  margin: auto;
  width: 50%;

.submit-button {
  margin-top: 1.75rem;
  background-color: hsla(160, 100%, 37%, 1);
  color: #fff;
  letter-spacing: 0.5px;
  padding: 0.85em 2.2em;
  border: none;
  font-size: 1.5rem;
  font-weight: 500;
  border-radius: 4px;
  cursor: pointer;

See demo for more examples

🤝 Contributing

Contributions are what make the open source community such an amazing place to learn, inspire, and create. Any contributions you make are greatly appreciated.

If you have a suggestion that would make this better, please fork the repo and create a pull request. You can also simply open an issue with the tag "enhancement". Don't forget to give the project a star! Thanks again!

  1. Fork the Project
  2. Create your Feature Branch (git checkout -b 'feature/AmazingFeature')
  3. Commit your Changes (git commit -m 'Add some AmazingFeature')
  4. Push to the Branch (git push origin feature/AmazingFeature)
  5. Open a Pull Request

Feel free to check the issues page.

📝 License

This project is under the MIT license.

Package Sidebar


npm i vue-annoying-button

Weekly Downloads






Unpacked Size

9.3 kB

Total Files


Last publish


  • ricardocastanho