Update 2016-05-13T18:58:43.171Z

articles/013-create-new-page/index.html

@@ -49,13 +49,13 @@
           <h1>Create New Page</h1>
           <div class="subHeader"></div><p>Blur admin uses <a href="https://github.com/angular-ui/ui-router">Angular <span class="caps">UI</span> router</a> for navigation. 
 That means to create new page you need to basically configure <code>ui-router</code> state.</p>
-<p>We strongly recommend to follow pages structure in our application. 
+<p>We strongly recommend to follow pages structure in your application. 
 If it doesn’t fit your needs please create a GitHub issue and tell us why. We would be glad to&nbsp;discuss. </p>
 <p>Also we recommend to put pages to separate modules. 
 This will allow you to easily switch off some pages in the future if&nbsp;needed.</p>
 <h2 id="page-creation-example">Page creation&nbsp;example</h2>
 <p>0) Let’s assume we want to create a blank page with title ‘My New&nbsp;Page’</p>
-<p>1) Create new folder to contain <code>myNewPage</code> inside of <code>src/app/pages</code>. Let’s call it <code>myNewPage</code> as&nbsp;well.</p>
+<p>1) Let’s Create a new directory to contain our new page inside of <code>src/app/pages</code>. Let’s call this directory <code>myNewPage</code>.</p>
 <p>2) Then let’s create blank angular module to contain our page called ‘myNewPage.module.js’ inside of <code>src/app/pages/myNewPage</code>:</p>
 <pre><code class="lang-javascript">(<span class="function"><span class="keyword">function</span> (<span class="params"></span>) </span>{
 <span class="meta">  'use strict'</span>;
@@ -64,14 +64,14 @@ This will allow you to easily switch off some pages in the future if&nbsp;needed
       .config(routeConfig);
 
   <span class="comment">/** @ngInject */</span>
-  <span class="function"><span class="keyword">function</span> <span class="title">routeConfig</span>(<span class="params">$stateProvider</span>) </span>{
+  <span class="function"><span class="keyword">function</span> <span class="title">routeConfig</span>(<span class="params"></span>) </span>{
 
   }
 
 })();
 </code></pre>
 <p>3) Then let’s create empty html file called <code>my-new-page.html</code> inside of <code>src/app/pages/myNewPage</code>.</p>
-<p>4) Lastly let’s create ui router state for this page. To do this we need to modify&nbsp;:</p>
+<p>4) Lastly let’s create ui router state for this page. To do this we need to modify module.js file we created on step&nbsp;2:</p>
 <pre><code class="lang-javascript">(<span class="function"><span class="keyword">function</span> (<span class="params"></span>) </span>{
 <span class="meta">  'use strict'</span>;
 

articles/051-sidebar/index.html

@@ -47,15 +47,15 @@
         </div>
         <div class="inner-content">
           <h1>Sidebar</h1>
-          <div class="subHeader"></div><p>Sidebar is used to provide convenient way of navigation in our application. 
+          <div class="subHeader"></div><p>Sidebar is used to provide convenient way of navigation in the application. 
 Application support only one sidebar per angular application. 
 That means sidebar is basically a singletone object.
 Currently sidebar supports level 1 and 2 sub&nbsp;menus.</p>
 <p>Sidebar can be created using <code>baSidebar</code> directive:</p>
 <pre><code class="lang-html"><span class="tag">&lt;<span class="name">ba-sidebar</span>&gt;</span><span class="tag">&lt;/<span class="name">ba-sidebar</span>&gt;</span>
 </code></pre>
-<p>For now it support only javascript configuration. And can be configured manually or via <code>ui-router</code> states.
+<p>For now it support only javascript configuration. Though it can be configured manually or via <code>ui-router</code> states.
-They can be used either combined or one at a&nbsp;time.</p>
+This methods can be used either together or one at a&nbsp;time.</p>
 <h2 id="manual-configuration">Manual&nbsp;configuration</h2>
 <p>For manual configuration you need to use <code>baSidebarServiceProvider</code> provider in angular <a href="https://docs.angularjs.org/guide/module#configuration-blocks">configuration block</a>.
 The provider has <code>addStaticItem</code> method, which receives menuItem object as an argument, which can have following&nbsp;properties:</p>
@@ -78,7 +78,7 @@ The provider has <code>addStaticItem</code> method, which receives menuItem obje
 <tr>
 <td>icon</td>
 <td>String</td>
-<td>Icon (it’s class name) to be displayed near title</td>
+<td>Icon (it’s a class name) to be displayed near title</td>
 </tr>
 
 <tr>
@@ -108,12 +108,18 @@ The provider has <code>addStaticItem</code> method, which receives menuItem obje
 </tbody>
 </table>
 
+<p>Sample manual&nbsp;configuration:</p>
+<pre><code class="lang-javascript">    baSidebarServiceProvider.addStaticItem({
+      title: <span class="string">'Menu Level 1'</span>,
+      icon: <span class="string">'ion-ios-more'</span>
+    });
+</code></pre>
 <h2 id="route-configuration">Route&nbsp;configuration</h2>
-<p>By default sidebar iterates through all <strong>ui-router</strong> states you defined in your application and looks for <code>sidebarMeta</code> property in them.
+<p>By default sidebar iterates through all <strong>ui-router</strong> states you defined in your application and searches for <code>sidebarMeta</code> object in them.
-For each state with this property found sidebar element is&nbsp;created. </p>
+For each state, which has this property, sidebar element is&nbsp;created. </p>
 <p>States are being grouped hierarchically. 
-That means if there’s parent abstract state for some state and they both have <code>sidebarMeta</code> property, it will be displayed as a sub item of that abstract state menu&nbsp;item.  </p>
+That means if there’s a parent abstract state for some state and they both have <code>sidebarMeta</code> property, it will be displayed as a sub item of that abstract state’s menu&nbsp;item.  </p>
-<p>Name of the item is taken from <code>state</code>‘s <code>title</code> property. Sample state configuration, which will be included in&nbsp;sidebar:</p>
+<p>Name of the item is taken from <code>state</code>‘s <code>title</code> property. Sample state configuration, which will add an item to&nbsp;sidebar:</p>
 <pre><code class="lang-javascript">$stateProvider
         .state(<span class="string">'dashboard'</span>, {
           url: <span class="string">'/dashboard'</span>,
@@ -139,7 +145,7 @@ That means if there’s parent abstract state for some state and they both have
 <tr>
 <td>icon</td>
 <td>String</td>
-<td>Icon (it’s class name) to be displayed near title</td>
+<td>Icon (it’s a class name) to be displayed near title</td>
 </tr>
 
 <tr>