awesome-vue-ui

Awesome UI components for Vue.js 3
1,171 4
Install
npm install awesome-vue-ui
Latest Version:1.2.29
Vue:3
Last Updated:Jul 24, 2023
Links: GitHub  ·  npm
Maintainer: hassan_pudineh

Awesome UI components using Tailwind for Vue3

awesome-vue-ui

Requirements

Recommended IDE Setup

Contributions

All contributions are welcomed. Help me to enrich this repository.

If you find any bugs in the examples, please file an issue.

Installation

$ npm install awesome-vue-ui
// OR
$ yarn add awesome-vue-ui

// After installation be sure to add these two files to main.js file so you can use components globally:
import { createApp } from 'vue';
import VueUI from "awesome-vue-ui"
import "awesome-vue-ui/dist/style.css";

createApp(App)
.use(VueUI)
.mount('#app');

Usage

      <VAlert 
            variant="Success"
            message="Your try was successful!"
            close_able
            size="md"
            rounded
            center
            :value="showAlert"
            @input="showAlert = false">
      </VAlert>

// In data property add:
 data(){
      return {
            showAlert: false
      }
},

Default values of props

Property Type Default value
Alert Component----- :-------------: ---------------:
title boolean true
message string 'No message'
variant string 'Success'
close_able boolean true
size string 'md'
rounded boolean true
value boolean false
-------------------- :-------------: ---------------:
Button Component---- :-------------: ---------------:
bgColor string 'bg-green-500'
textColor string 'bg-black-500'

TODO

  • Add modal component

Version History

Version Released Vue License
1.2.29 ^3.2.25
1.2.28 ^3.2.25
1.2.27 ^3.2.25
1.2.26 ^3.2.25
1.2.25 ^3.2.25