@doc88/flux-style-guide

Flux Style Guide

Design by Doc88 for Vue.js

Documentation

This documentation, at this moment, is found in the repository itself using the StoryBook for Vue.

yarn storybook

Instalation

# Instalation
$ yarn add @doc88/flux-style-guide

You can use with Vue.js 2.x and Nuxt.js 2.x.

Nuxt.js

We create the file plugins/flux-style-guide.js:

import Vue from 'vue'
import FluxStyleGuide from "@doc88/flux-style-guide"

Vue.use(FluxStyleGuide)

Then we add the file path inside the plugins key of our nuxt.config.js:

export default {
  plugins: ['~/plugins/flux-style-guide']
}

Vue.js

import Vue from 'vue'
import FluxStyleGuide from "@doc88/flux-style-guide"

Vue.use(FluxStyleGuide)

CSS Sass Configuration

To use a simple configuration

@import '~@doc88/flux-style-guide/src/assets/f-style-guide.scss';

To customize styles

@import '~@doc88/flux-style-guide/src/assets/f-variables';

/*
Custom variables
*/

@import '~@doc88/flux-style-guide/src/assets/f-reset';
@import '~@doc88/flux-style-guide/src/assets/f-root';
@import '~@doc88/flux-style-guide/src/assets/f-colors';
@import '~@doc88/flux-style-guide/src/assets/f-sizes';
@import '~@doc88/flux-style-guide/src/assets/f-transitions';
@import '~@doc88/flux-style-guide/src/assets/settings/settings';

@import '~@doc88/flux-style-guide/src/assets/f-base';

Update

# Update dependence
$ yarn upgrade-interactive --latest

Contribuition

• 🇺🇸 Please read our Contribution Guide before submitting a pull request.
• 🇧🇷 Por favor, leia o Guia de Contribuição antes de enviar um pull request.