# Introduction

A set of Vuejs (v3) components build with Tailwindcss (v4), Fontawesome, and Iconify.

#### TailwindCss

- https://tailwindcss.com/
- https://tailwindcss.com/docs/installation/using-vite

#### Fontawesome

- https://fontawesome.com/icons
- https://docs.fontawesome.com/web/use-with/vue

#### Iconify

- https://iconify.design/
- https://iconify.design/docs/icon-components/vue/

# Usage

- `npm i @am-ogs/vue-ui`
- `pnpm add @am-ogs/vue-ui`
- `yarn add @am-ogs/vue-ui`

## Config

- in the `tailwind.config.js` file of your VueJs app:

```
/** @type {import('tailwindcss').Config} */
module.exports = {
  content: [
    './index.html',
    './src/**/*.{vue,js,ts,jsx,tsx}',
    'node_modules/@am-ogs/vue-ui/**/*.js', // <<-- this is important
  ],
  ...
```

## In a component

```
<template>
    <div class="mt-10 text-center">
        <BaseButton
            text="Log In"
            @click="handleLogin"
            :disabled="disabled"
        />
    </div>
</template>

<script setup lang="ts">
import { BaseButton } from '@am-ogs/vue-ui'
</script>
```