@oneb/ui-vue v0.0.60

Oneb UI for Vue3

Usage

<template>
  <div>
    <OneButton label="Primary" variant="primary"/>
    <OneLink to="home" label="Primary" variant="primary"/>
    
    <OneCard>
      <OneCardHeader title="Some title" description="Some Desc"/>
      <OneCardBody>
        Here is content of the card.
      </OneCardBody>
    </OneCard>
    
  </div>
</template>

<script setup>
import { OneButton, OneLink, OneCard, OneCardHeader, OneCardBody } from '@oneb/ui-vue'
</script>

Setup

1. src/assets/mains.css

add line: @import '@oneb/ui-vue/style.css'; add line: @import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600;700;800;900&display=swap');

2. tailwind.config.cjs

1. Import config const onebui = require('onebui-vue/tailwind.config')
2. Add './node_modules/@oneb/ui-vue/dist/**/*.{vue,js,ts,jsx,tsx}' to content
3. Extend config

const onebui = require('onebui-vue/tailwind.config')

module.exports = {
   content: [
        ..., 
        "./node_modules/@oneb/ui-vue/dist/**/*.{vue,js,ts,jsx,tsx}"
   ],
   theme: onebui.theme,
   plugins: [require('@tailwindcss/forms')]
}