README.md in ustyle-1.16.2 vs README.md in ustyle-1.19.2
- old
+ new
@@ -109,10 +109,22 @@
<svg role="img" class="us-icon--medium us-icon--custom us-icon--{$NAME}">
<use xlink:href="/images/icons.svg#icon-{$NAME}"></use>
</svg>
```
+#### Adding a new Icon
+
+To add a new Icon, add the SVG file to `/vendor/assets/images/icons`,
+then add your new icon name as `@state icon` to [this
+file](https://github.com/uswitch/ustyle/blob/new-shield-icon/vendor/assets/stylesheets/ustyle/icons/_base.scss#L19-L112).
+
+Finally, build the optimised icons using
+
+```sh
+grunt icons
+```
+
## Usage
### Rails / Sprockets apps
If using Rails and Sass, just import the base uSwitch styles at the start of your file
@@ -159,10 +171,16 @@
For Sass documentation on mixins/variables available to you, please see: https://ustyle.guide/sass/
## Development
-To preview changes that you make to uStyle's components and documentation, run:
+To preview changes that you make to uStyle's components and documentation, install dependencies with
+
+ $ npm install
+
+ $ bundle install
+
+then run:
$ npm start
This will run the [Grunt](http://gruntjs.com/) default task that builds uStyle, then starts a [Browsersync](https://www.browsersync.io/) server at http://localhost:3000. Changes that you make are live-reloaded in your browser.