https://github.com/doc88git/flux-style-guide
Design by Doc88 for Vue.js
https://github.com/doc88git/flux-style-guide
frontend-framework js vue vuejs
Last synced: about 1 year ago
JSON representation
Design by Doc88 for Vue.js
- Host: GitHub
- URL: https://github.com/doc88git/flux-style-guide
- Owner: doc88git
- Created: 2019-05-22T14:45:01.000Z (about 7 years ago)
- Default Branch: master
- Last Pushed: 2022-12-12T06:01:13.000Z (over 3 years ago)
- Last Synced: 2025-05-05T20:11:23.231Z (about 1 year ago)
- Topics: frontend-framework, js, vue, vuejs
- Language: JavaScript
- Homepage: https://doc88.com.br
- Size: 17 MB
- Stars: 7
- Watchers: 9
- Forks: 3
- Open Issues: 27
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
## 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](https://storybook.js.org/docs/guides/guide-vue/).
#### Check the storybook for flux [here!](https://doc88git.github.io/flux-style-guide)
```
yarn storybook
```
### Instalation
``` bash
# 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`:
``` 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`:
``` js
export default {
plugins: ['~/plugins/flux-style-guide']
}
```
#### Vue.js
``` js
import Vue from 'vue'
import FluxStyleGuide from "@doc88/flux-style-guide"
Vue.use(FluxStyleGuide)
```
### CSS Sass Configuration
To use a simple configuration
``` css
@import '~@doc88/flux-style-guide/src/assets/f-style-guide.scss';
```
To customize styles
``` css
@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
``` bash
# Update dependence
$ yarn upgrade-interactive --latest
```
## Contribuition
- 🇺🇸 Please read our [Contribution Guide](.github/en/CONTRIBUTING.md) before submitting a pull request.
- 🇧🇷 Por favor, leia o [Guia de Contribuição](.github/pt-br/CONTRIBUTING.md) antes de enviar um pull request.