# binary-style

> Style system and guide for Binary.com

Latest version **0.2.4** (published 2018-04-18) · Apache License 2.0 license · 0 weekly downloads

## Install

```sh
npm install binary-style
pnpm add binary-style
yarn add binary-style
bun add binary-style
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.2.4 |
| Published | 2018-04-18 |
| First published | 2017-10-03 |
| Weekly downloads | 0 |
| License | Apache License 2.0 |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 1 |
| Unpacked size | 2.2 MB |
| Known vulnerabilities | 0 (+1 in 1 direct dependencies) |
| Install scripts | no |
| Author | Binary.com |
| Maintainers | aminroosta, ashkanx, mohammadx |

## Links

- npm: https://www.npmjs.com/package/binary-style
- Repository: https://github.com/binary-com/binary-style
- Homepage: https://style.binary.com
- Issues: https://github.com/binary-com/binary-style/issues
- npm.io page: https://npm.io/package/binary-style

## Dependencies (1)

- [select2](https://npm.io/package/select2.md) 4.0.5

## Recent versions

- 0.2.4 (latest) — 2018-04-18
- 0.2.3 — 2018-03-07
- 0.2.2 — 2018-02-15
- 0.2.1 — 2017-12-18
- 0.2.0 — 2017-11-20
- 0.1.3 — 2017-11-13
- 0.1.2 — 2017-11-13
- 0.1.1 — 2017-11-13
- 0.1.0 — 2017-10-13
- 0.0.2 — 2017-10-03
- 0.0.1 — 2017-10-03

## README

# Binary-Style
Style system and guide for Binary.com

You can see the [Live Style Guide](https://style.binary.com/)

The goal of the project is to serve as base style for all Binary projects, and to ensure consistency and maintainability of the brand presentation.

### Usage
- Add [jQuery](https://jquery.com/) to your project

- Add these files to your project:

```
https://style.binary.com/binary.js
https://style.binary.com/binary.css
```

- If you need Date and Time Pickers, Tabs or Accordion include "binary.more.js" and "binary.more.css" in your project, this will include a copy of jquery-ui with customized styles.

```
https://style.binary.com/binary.more.js
https://style.binary.com/binary.more.css
```

### NPM Usage (Recommended)
- The library is available on `npm`

```
npm install --save binary-style
```

- If you need Date and Time Pickers, Tabs or Accordion import "binary-styles/binary.more" in addition to "binary-style"

```
import 'binary-style';
import 'binary-style/binary.css';
import 'binary-style/binary.more'; // This includes a custom jquery-ui@1.12.1 build
import 'binary-style/binary.more.css'; // This includes custom styles for jquery-ui
``` 

- For new projects it's recommended to `import 'binary-style/binary.isolated.css` instead,  

```
import 'binary-style/binary.isolated.css';
```

The only difference is that all css styles are wrapped inside a wrapper with `.binary-style` selector.


## How to work with this project

### Installation

You need to have:

- The latest version of `node`
- Version 4.x.x of `npm` (`npm install npm@4 -g`)

```bash
npm install
sudo npm install -g grunt-cli
```

### Deploy to your gh-pages
```
grunt deploy
```

### Using sub-folders
There are times that you are working on various branches at the same time, and you want to deploy/test each branch separately on your gh-pages, you can simply use `--branch=branchname` for grunt commands:
- `grunt deploy --branch=branchname`
This will deploy your changes to a sub-folder named: `br_branchname` and it can be browsed at: https://YOUR_GITHUB_USERNAME.github.io/binary-style/br_branchname/

In order to remove the created folders from your gh-pages, you can use either:
- `grunt deploy --cleanup`: removes all `br_*` folders and deploys to the root folder.

  or
- `grunt shell:remove_folder --folder=br_branchname1,br_branchname2,...`: only removes the specified folder(s) from your gh-pages.

### Preview on your local machine
```
sudo grunt serve
```
It will watch for js/css changes and rebuild on every change you make.


## Release to Production

```
grunt release --production=1 [--cleanup]
```
(The value is needed when more than one option is used)

### Parameters:
- `--production` (mandatory)
  - In order to prevent accidentally releasing to the wrong target, it is mandatory to provide it.
  - Your remote origin will be checked to be the correct target of the given parameter.
  - Your current branch will be checked to be the correct branch of the given parameter.
- `--cleanup` [optional]
  - Creates CNAME file
  - Deploys to gh-pages with the option `add: false`

---
_Source: https://npm.io/package/binary-style · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._