cashu-design-system
Version:
CashU Design System
79 lines (57 loc) • 1.73 kB
Markdown
# design-system
<h1 align="center">
<br>
<a href="https://www.cashu.com.br/">
<img src="https://images.squarespace-cdn.com/content/v1/627a6835140e5815a6b92324/da3334f6-bb27-4473-ad97-7fbf459b9a50/LOGOCASHUWHITE.png?format=1500w" alt="Cashu" width="200">
</a>
<br>
design-system
<br>
<br>
</h1>
> design-system-cashu for faster and easier web development. With compiled CSS and JavaScript for include in projects.
<br>
## Start
- Clone the repo: `git clone https://github.com/CashU-BR/design-system`
- Install with [npm](https://www.npmjs.com/package/cashu-design-system): `npm i cashu-design-system`
- Install with [yarn](https://yarnpkg.com/package/cashu-design-system): `yarn add cashu-design-system`
<br>
## CLI
- Run server local: `npm start`
- Generate build: `npm run build`
- Generate version npm `npm version x.x.x`
- Publish version npm `npm publish`
<br>
## File structure
```text
cashu-design-system/
├── dist/
│ ├── bundle.css
│ ├── bundle.js
│ ├── assets
```
<br>
## Usage in HTML file
```html
<head>
...
<link rel="stylesheet" href="./node_modules/cashu-design-system/dist/bundle.css">
...
</head>
```
```html
<body>
...
<script src="./node_modules/cashu-design-system/dist/bundle_html.js"></script>
...
</body>
```
<br/>
## Code pattern
* [ESLint](https://github.com/eslint/eslint) This is a lint for JS
* [stylelint](https://stylelint.io/) This is pattern for css
* [stylelint-order](https://github.com/hudochenkov/stylelint-order) Eslint plugin that lets you create sorting rules
<br/>
<br/>
## Usage Components
[cashu-storybook](https://cashu-storybook.netlify.app/storybook-static/?path=/story/cashu-design-system--page)