veekite v0.0.1
Installation
npm install @shuashuaa/v-kit
Importation
main.js
import { createApp } from 'vue'
import App from './App.vue'
import { vuetify } from "@shuashuaa/v-kit";
import "@shuashuaa/v-kit/style.css";
import 'vuetify/styles'
createApp(App)
.use(vuetify)
.mount('#app')
Usage
yourComponent.vue
<script setup>
import { LoginKit } from "@shuashuaa/v-kit";
</script>
<template>
<div>
<LoginKit
titleName="Automated Server Fetching System"
subtitleName="Make your fetching smoother like no other"
version="1.0.0"
bgColor="white"
/>
</div>
</template>
!IMPORTANT
Remove theassets
folder fromsrc
as well as theimport path
inmain.js
file
Props
Command | Action | Syntax & Resources |
---|
GENERAL
| bgColor
| Changes the default background color white | String, HEX (#ffffff) |
LCARD
| lCardColor
| Changes the left card background color | HEX (#ffffff) or just words 'blue, red, etc.' |
| icon
| Changes the default icon ( mdi-your-icon-of-choice ) | mdi icon library |
| titleName
| Changes the default title | String |
| subtitleName
| Changes the default subtitle | String |
| version
| Changes the default version | String |
| creditTitle
| Changes the current Powered By | String |
| creditName
| Changes the current @shuashuaa/v-kit teamName | String |
RCARD
| rCardColor
| Changes the right card background color | HEX (#ffffff) or just words 'blue, red, etc.' |
| loginColor
| Changes the login button's color | HEX (#ffffff) or just words 'blue, red, etc.' |
| loginName
| Changes the login button's name | String |
| loginIcon
| Changes the login button's icon | mdi icon library |
| toRoute
| Route path where to redirect if credentials is accepted | link, path (ex. "/home") |
Built-in v-models and Functions
Command | Action | Syntax & Resources |
---|---|---|
username | Handles the username input | v-model |
password | Handles the password input | v-model |
login() | assigned function for login button | function |
On-Going Props & Functions
- Popup notifications on login
- alert methods ( success, warning, error, info )
- alert title
- FontFamily - Changes the entire font-family
- Generate pinia store files
- Generate vue-router files
- Creation of Registration Component
- template-type - classic, minimalist, verbose, etc.
- htmx features for customization
- and more..
License
10 months ago