⚠️ Estamos removendo o Bootstrap como dependência de projeto! Evite construir em cima de componentes do BootstrapVue e, se possível, evite utilizar classes do Bootstrap!

A design system built by Sysvale, using storybook and Vue components

https://sysvale.github.io/cuida/

Instalando

• O Cuida pode ser instalado com o npm:

$ npm i @sysvale/cuida;

Usando

• Instale o bootstrap-vue como dependência:

$ npm i @sysvale/cuida;

• Para usar o bootstrap-vue, importe a biblioteca no seu entry point, provavelmente vai ser seu main.js ou app.js:

import BootstrapVue from 'bootstrap-vue';
import 'bootstrap/dist/css/bootstrap.css';
import 'bootstrap-vue/dist/bootstrap-vue.css';

• Instale o bootstrap-vue com:

$ npm install bootstrap-vue bootstrap;

• Para usar o cuida, importe a biblioteca no seu entry point, provavelmente vai ser seu main.js ou app.js:

import Cuida from '@sysvale/cuida';

• E instale o Cuida:

Vue.use(Cuida);

• Agora para utilizar os componentes, basta usá-los no seu template. Como exemplo, para usar a Badge:

<cds-badge variant="gray"> Conteúdo </cds-badge>

• Para utilizar os tokens, importe-os na sua tag script.

<style lang="scss" scoped>
	@import 'node_modules/@sysvale/cuida/dist/@sysvale/tokens.scss';
	...
</style>

Desenvolvendo

Configurando o projeto

• Clone o repositório:

$ git clone https://github.com/Sysvale/cuida.git

• Instale as dependências e suba o container docker:

$ docker-compose up -d

A aplicação estará disponível na porta 6006, em http://localhost:6006/.

• Caso não queira usar docker, instale as dependências com:

$ npm i

Executando o Cuida

• Após a execução do comando docker-composer up -d a aplicação já estará rodando no http://localhost:6006/ .
• Ou alternativamente, sem o docker, rode apenas:

$ npm run storybook

Testando-o

• Utilizando o docker:

$ docker-compose exec cuida npm run test

ou

$ ./on-server.sh npm run test

• Sem o docker:

$ npm run test

Contribuindo

Para informações sobre como contribuir com o projeto, acesse o CONTRIBUTING.MD