Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
@binary-com/binary-style
Advanced tools
@binary-com/binary-style - npm Package Compare versions
Comparing version 0.2.25 to 0.2.26
| { | ||
| "name": "@binary-com/binary-style", | ||
| "version": "0.2.25", | ||
| "version": "0.2.26", | ||
| "description": "Style system and guide for Binary.com", | ||
@@ -5,0 +5,0 @@ "main": "binary.js", |
178
README.md
@@ -1,109 +0,113 @@ | ||
| # Binary-Style | ||
| Style system and guide for Binary.com | ||
| <h1 align="center"> | ||
| Binary-Style | ||
| </h1> | ||
| You can see the [Live Style Guide](https://style.binary.com/) | ||
| [Live Style Guide](https://style.binary.com/) - The style system and guide for 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 | ||
|   | ||
| ## In this document: | ||
| - Add these files to your project: | ||
| - [Pre-installation](#pre-installation) | ||
| - [Quick start](#quick-start) | ||
| - [How to contribute](#how-to-contribute) | ||
| - [Manage releases](#manage-releases) | ||
| - [Test link deployment](#test-link-deployment) | ||
| ``` | ||
| https://style.binary.com/binary.js | ||
| https://style.binary.com/binary.css | ||
| ``` | ||
| ## Pre-installation | ||
| - 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. | ||
| Before running or contribute to this project, you need to have the setup of the following packages in your environment | ||
| ``` | ||
| https://style.binary.com/binary.more.js | ||
| https://style.binary.com/binary.more.css | ||
| ``` | ||
| - node | ||
| - npm >=4.x.x | ||
| - grunt | ||
| - git | ||
| ## Quick start | ||
| ### NPM Usage (Recommended) | ||
| - The library is available on `npm` | ||
| 1. **Fork the project** | ||
| ``` | ||
| npm install --save binary-style | ||
| ``` | ||
| In order to work on your own version, please fork the project to your own repo. | ||
| - If you need Date and Time Pickers, Tabs or Accordion import "binary-styles/binary.more" in addition to "binary-style" | ||
| 2. **Clone using SSH** | ||
| ``` | ||
| 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 | ||
| ``` | ||
| ```sh | ||
| git clone git@github.com:your-github-username/binary-style.git | ||
| ``` | ||
| - For new projects it's recommended to `import 'binary-style/binary.isolated.css` instead, | ||
| 3. **Enter project directory** | ||
| ``` | ||
| import 'binary-style/binary.isolated.css'; | ||
| ``` | ||
| ```sh | ||
| cd binary-style | ||
| ``` | ||
| The only difference is that all css styles are wrapped inside a wrapper with `.binary-style` selector. | ||
| 4. **Install your dependencies:** | ||
| ```sh | ||
| npm install | ||
| sudo npm install -g grunt-cli | ||
| sudo gem install compass -n /usr/local/bin | ||
| ``` | ||
| 5. **To build everything and run the test suite** | ||
| ## How to work with this project | ||
| ```sh | ||
| grunt default | ||
| ``` | ||
| ### Installation | ||
| optionally, you can run these to only build what you need, note that `copy` is a must: | ||
| You need to have: | ||
| ```sh | ||
| grunt copy | ||
| grunt css | ||
| grunt js | ||
| ``` | ||
| - The latest version of `node` | ||
| - Version 4.x.x of `npm` (`npm install npm@4 -g`) | ||
| 6. **To start developing:** | ||
| Run the following command to watch for js/css changes and rebuild on every change you make: | ||
| ```bash | ||
| npm install | ||
| sudo npm install -g grunt-cli | ||
| ``` | ||
| ```sh | ||
| sudo grunt serve | ||
| ``` | ||
| ### Build | ||
| 7. **Open the source code and start editing!** | ||
| To build everything and run the test suite | ||
| Your site is now running at `https://127.0.0.1/` | ||
| ## How to contribute | ||
| ``` | ||
| grunt default | ||
| ``` | ||
| 1. Create branch from the latest master branch | ||
| optionally, you can run these to only build what you need, note that `copy` is a must | ||
| ```sh | ||
| git checkout master | ||
| git pull upstream master | ||
| git checkout -b [_your_branch_name] | ||
| ``` | ||
| ``` | ||
| grunt copy | ||
| grunt css | ||
| grunt js | ||
| ``` | ||
| 2. Make your changes | ||
| ### Deploy | ||
| Merging the PRs to master branch deploys changes to production | ||
| 3. Make pull request | ||
| ### 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/ | ||
| - Push your changes to your origin | ||
| 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. | ||
| ```sh | ||
| git push -u origin [_your_branch_name] | ||
| ``` | ||
| or | ||
| - `grunt shell:remove_folder --folder=br_branchname1,br_branchname2,...`: only removes the specified folder(s) from your gh-pages. | ||
| - Click on the autogenerated link from the terminal to open the PR | ||
| ### Preview on your local machine | ||
| ``` | ||
| sudo grunt serve | ||
| ``` | ||
| It will watch for js/css changes and rebuild on every change you make. | ||
| - Make sure to change the PR base to `master` branch | ||
| ## Release to Production | ||
| ## Manage releases | ||
| ### Release to Production | ||
| ``` | ||
| Merging the PRs to master branch deploys changes to production | ||
| ```sh | ||
| grunt release --production=1 [--cleanup] | ||
| ``` | ||
| (The value is needed when more than one option is used) | ||
| ### Parameters: | ||
| **Note**: The value is needed when more than one option is used | ||
| #### Parameters: | ||
| - `--production` (mandatory) | ||
@@ -117,7 +121,33 @@ - In order to prevent accidentally releasing to the wrong target, it is mandatory to provide it. | ||
| ### Publishing new version | ||
| ### Publishing new version | ||
| To publish new package version to npm, run | ||
| ``` | ||
| ```sh | ||
| grunt npm_publish | ||
| ``` | ||
| ## Test link deployment | ||
| 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: | ||
| - 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/ | ||
| ```sh | ||
| grunt deploy --branch=branchname | ||
| ``` | ||
| **Note:** In order to remove the created folders from your gh-pages, you can either: | ||
| 1. Remove all `br_*` folders and deploy to the root folder: | ||
| ```sh | ||
| grunt deploy --cleanup | ||
| ``` | ||
| OR | ||
| 2. Remove the specified folder(s) from your gh-pages: | ||
| ```sh | ||
| grunt shell:remove_folder --folder=br_branchname1,br_branchname2,... | ||
| ``` |
Sorry, the diff of this file is not supported yet
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
- increased by0.05%
2346117
- Number of package files
- increased by1.25%
81
- Number of lines in readme file
- increased by24.39%
153
No dependency changes