Fix various typos in documentation (#1035)

* Fixing various grammatical errors in /index.html

* fixed "add your own colors" thing

* Fixed grammatical errors on various documentation pages

* Update documentation.html

* Update tiles.html

* Update tiles.html

* fixing footer

* Update hero

* Update index.html

* Update index.html

* Removed change in classes

docs/_layouts/documentation.html

@@ -67,8 +67,7 @@ route: documentation
   <div class="container">
     <p class="has-text-grey-light">
       This page is <strong class="has-text-grey">open source</strong>.
-      Noticed a typo?
-      Or something unclear?
+      Noticed a typo? Or something unclear?
       <a class="has-text-grey" href="https://github.com/jgthms/bulma/blob/master/docs/{{ page.path }}" style="border-bottom: 1px solid currentColor;">
         Improve this page on GitHub
       </a>

docs/documentation/grid/tiles.html

@@ -15,7 +15,7 @@ doc-subtab: tiles
     <hr>
 
     <div class="content">
-      <p>To build intricate 2-dimensional, you only need a <strong>single element</strong>: the <code>tile</code>:</p>
+      <p>To build intricate 2-dimensional layouts, you only need a <strong>single element</strong>: the <code>tile</code>:</p>
     </div>
 
 {% highlight html %}
@@ -341,7 +341,7 @@ tile is-ancestor
       </div>
       <div class="message-body">
         <div class="content">
-          <p>You can however nest tiles more deeply than that, and mix it up!</p>
+          <p>You can, however, nest tiles deeper than that, and mix it up!</p>
 {% highlight markdown %}
 tile is-ancestor
 |

docs/documentation/layout/footer.html

@@ -11,7 +11,7 @@ doc-subtab: footer
   <div class="container">
     <h1 class="title">Footer</h1>
     <h2 class="subtitle">
-      A simple responsive <strong>footer</strong> which can include anything: lists, headings, columns, icons, buttons...
+      A simple responsive <strong>footer</strong> which can include anything: lists, headings, columns, icons, buttons, etc.
     </h2>
 
 <div class="example">

docs/documentation/layout/hero.html

@@ -52,7 +52,7 @@ doc-subtab: hero
   <div class="container">
     <h3 class="title">Colors</h3>
     <h4 class="subtitle">
-      As with buttons, you can choose one of the <strong>7 different colors</strong>
+        As with buttons, you can choose one of the <strong>7 different colors</strong>:
     </h4>
   </div>
 </section>

docs/documentation/overview/colors.html

@@ -121,7 +121,7 @@ shades:
 <section class="section">
   <div class="container">
     <h1 class="title">Colors</h1>
-    <h2 class="subtitle">The <strong>colors</strong> that <strong>style</strong> all Bulma elements and components</h2>
+    <h2 class="subtitle">The <strong>colors</strong> that <strong>style</strong> most Bulma elements and components</h2>
 
     <hr>
 

docs/documentation/overview/customize.html

@@ -66,7 +66,7 @@ $family-primary: $family-serif
           <strong>Set</strong> your variables
         </p>
         <p class="subtitle is-6">
-          Add your own colors, set new fonts, override Bulma styles...
+          Add your own colors, set new fonts, override Bulma's default styles...
         </p>
         <div class="highlight-full">
           {% highlight sass %}{{ sass }}{% endhighlight %}

docs/index.html

@@ -57,7 +57,7 @@ route: index
             <i class="fa fa-desktop"></i>
           </span>
           <p class="title is-4"><strong>Responsive</strong></p>
-          <p class="subtitle">Designed for <strong>mobile</strong>-first</p>
+          <p class="subtitle">Designed for <strong>mobile</strong> first</p>
         </a>
         <a class="column has-text-centered" href="{{ site.url }}/documentation/overview/modular/">
           <span class="icon is-large">
@@ -201,7 +201,7 @@ route: index
         Magic <strong>tiles</strong>
       </a>
     </h3>
-    <h4 class="subtitle is-4">A single element for a Metro UI CSS grid</h4>
+    <h4 class="subtitle is-4">A single element for a Metro UI-style CSS grid</h4>
     <div class="tile is-ancestor">
       <div class="tile is-vertical is-8">
         <div class="tile">
@@ -518,7 +518,7 @@ route: index
         <span class="icon">
           <i class="fa fa-book"></i>
         </span>
-        <span>Check the <strong>Docs</strong></span>
+        <span>Check the <strong>docs</strong></span>
       </a>
       <a class="button is-black is-large" href="{{ site.github }}">
         <span class="icon">