Merge pull request #125 from mobify/release-v2.5.3

Release v2.5.3

CHANGELOG

@@ -1,3 +1,6 @@
+2.5.3
+    - Fix #123 by using react/jsx-wrap-multilines rule
+    - Migrate CSSComb documentation from Confluence to code style repo
 2.5.2
     - Fix #43 by updating all underlines in Sass code examples
     - Fix #114 by removing invalid options from CSSComb config file

css/Readme.md

@@ -45,5 +45,8 @@
 * [Sass-Lint](sass-lint/readme.md)
     * [Using Sass-Lint with Atom](sass-lint/readme.md#using-sass-lint-with-atom)
     * [Using Sass-Lint with Sublime Text](sass-lint/readme.md#using-sass-lint-with-sublime-text)
+* [CSSComb](csscomb/readme.md)
+    * [Using CSSComb with Atom](csscomb/readme.md#atom)
+    * [Using CSSComb with Sublime Text](csscomb/readme.md#sublime-text)
 
 Continue on to [the Introduction →](introduction#introduction)

css/css-best-practices/readme.md

@@ -177,7 +177,7 @@ Another benefit is that this keeps our code isolated really well. Action Bar can
 
 We want our CSS to be written consistently no matter who the code author is. In order to do so, please follow these below rules.
 
-Note that we use [SCSS-Lint](https://github.com/causes/scss-lint) to make this easier — see our linting rules [here](https://github.com/mobify/mobify-code-style/blob/update-css-style/css/.scss-lint.yml).
+Note that we use [Sass-Lint](https://github.com/sasstools/sass-lint) to make this easier — see our linting rules [here](https://github.com/mobify/mobify-code-style/blob/develop/css/.sass-lint.yml). Find out how to integrate Sass-Lint with your text editor [here](../sass-lint/readme.md).
 
 * One selector per line
 * Use a soft indent of four spaces
@@ -216,7 +216,7 @@ Note that we use [SCSS-Lint](https://github.com/causes/scss-lint) to make this e
 
 Following our practice of writing consistent code, we also want all properties to be consistently ordered according to the bellow standard.
 
-And as before, we use [SCSS-Lint](https://github.com/causes/scss-lint) to help ensure property order is consistent - see our linting rules [here](https://github.com/mobify/mobify-code-style/blob/update-css-style/css/.scss-lint.yml).
+And as before, we use [Sass-Lint](https://github.com/sasstools/sass-lint) to help ensure property order is consistent - see our linting rules [here](https://github.com/mobify/mobify-code-style/blob/develop/css/.sass-lint.yml).
 
 1. Extends
 1. Mixins/Includes (except for property specific mixins)

css/csscomb/readme.md

@@ -0,0 +1,36 @@
+# CSSComb
+
+A [CSS-beautifier utility](http://csscomb.com/) which will ensure that your SCSS is consistent with our [code style](https://github.com/mobify/mobify-code-style/blob/develop/css/.csscomb.json).
+
+![CSSComb in action](../../assets/csscomb.gif "CSSComb in action")
+
+## How to Install CSSComb
+
+### Prerequisites
+* Install Node.js and NPM with NVM as directed in the [Adaptive.js docs](http://adaptivejs.mobify.com/v2.0/docs/install/)
+* Install CSSComb and the Mobify Code Style:
+
+   `npm install -g csscomb mobify-code-style`
+
+### Atom
+1. Install [css-comb package](https://atom.io/packages/css-comb) for Atom (this will allow you to set the global CSSComb config)
+1. Open your Atom package settings for "css-comb" (**not** "csscomb")
+  * Ensure your custom config path is set to your machine's version of `mobify-code-style`: Run `npm config get prefix` and append `/lib/node_modules/mobify-code-style/css/.csscomb.json` to the result
+  * Ensure Disable config searching is unchecked
+1. Restart Atom
+1. Start combing your Sass!
+
+### Sublime Text
+
+Before you start, make sure you have [Package Control](https://packagecontrol.io/installation) installed for Sublime Text.
+
+1. Install [CSSComb for Sublime](https://packagecontrol.io/packages/CSScomb) (Search for "CSScomb" in Sublime's Package Control)
+1. CSSComb for Sublime will look for your config in your HOME directory, so make a symlink to the Mobify Code Style version (this way, updating the code style through NPM will automagically update the config for Sublime):
+
+  ```bash
+  cd ~
+  ln -s /path/to/your/local/node_modules/mobify-code-style/css/.csscomb.json ./.csscomb.json
+  ```
+  (Find your local path by running `npm config get prefix` and append `/lib/node_modules/mobify-code-style/css/.csscomb.json` to the result)
+1. Restart Sublime
+1. Start combing your Sass!

css/introduction/readme.md

@@ -19,7 +19,7 @@ We follow a mixture of various methodologies include, but not limited to: SMACSS
 * [Spline](https://github.com/mobify/spline) is our library of Sass mixins and functions
 * [Stencil](https://github.com/mobify/stencil) (Deprecated – but a new 2.0 version is coming soon!) is our library or reusable UI patterns
 * [Sass-Lint](https://github.com/sasstools/sass-lint) is our preferred linter for `SCSS`. Our custom linting rules are found [here](https://github.com/mobify/mobify-code-style/blob/master/css/.sass-lint.yml)). Find out how to integrate Sass-Lint with your text editor [here](../sass-lint/readme.md).
-* [CSScomb](http://csscomb.com/) is a tool that can be plugged into most popular text editors that automatically formats your code! Our formatting ruleset can be found [here](https://github.com/mobify/mobify-code-style/blob/master/css/.csscomb.json)
+* [CSScomb](http://csscomb.com/) is a tool that can be plugged into most popular text editors that automatically formats your code! Our formatting ruleset can be found [here](https://github.com/mobify/mobify-code-style/blob/master/css/.csscomb.json). Find out how to integrate CSSComb with your text editor [here](../csscomb/readme.md).
 
 
 ## Philosophy & Structure

es6/mobify-es6-react.yml

@@ -37,7 +37,7 @@ rules:
   react/jsx-indent: error
   react/jsx-indent-props: error
   react/jsx-space-before-closing: error
-  react/wrap-multilines: error
+  react/jsx-wrap-multilines: error
 
   # Ignore common unused vars and args in React projects
   no-unused-vars:

package.json

@@ -1,6 +1,6 @@
 {
   "name": "mobify-code-style",
-  "version": "2.5.2",
+  "version": "2.5.3",
   "description": "Code style guide and linting tools for Mobify",
   "repository": {
     "type": "git",