Welcome to @ibecsystems/nuxtjs-ui-kit

This is a Nuxt component library that will contain all ibec ui components you need to start a new nuxt (C & D) project. Components are written with nuxt 2, HTML, SCSS, bootstrap 5 and fully configurable using props, slots, and css variables.

This library is currently under construction. We'll be publishing new components as son as they are ready for use

Installation

Using npm or yarn

npm install @ibecsystems/nuxtjs-ui-kit
yarn add @ibecsystems/nuxtjs-ui-kit

Usage

• Declare as component

<template lang="html">
    <UiButton variant="primary">
        Button Label
    </UiButton>
</template>

<script lang="js">
import { UiButton } from '@ibecsystems/nuxtjs-ui-kit';

export default {
  name: 'MyComponent',
  components: {
    UiButton,
  },
};
</script>

• Styling components

Use bootstrap 5 global variable and override bootstrap 5 scss variable

:root {
  --bs-primary: #e00366;
}

main.scss
    // Default variable overrides
    $body-bg: #fff;
    $body-color: #333;
    $primary: #e00366;
    @import "bootstrap/scss/bootstrap";
    

Repository

Check out the code on github, IBEC-BOX/nuxtjs-ui-kit

Documentation

StoryBook documentation

Changelog

Changes for each version of our project are documented in the CHANGELOG.md file.

Copyright (c) Ibec Systems