Skip to content

Latest commit

 

History

History
84 lines (66 loc) · 2.19 KB

README.md

File metadata and controls

84 lines (66 loc) · 2.19 KB

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