Fixing various spelling errors. (#248)

* Fixing various spelling errors.

Guess who finally installed the spell checking plugin for VS Code?  This guy.

* fix linting error

Author: mrbinky3000

Diff for: README.md

@@ -320,7 +320,7 @@ A compound component that creates a bunch of Dot's automatically for you.
 | dotNumbers | boolean | false | No | Setting to true automatically adds text numbers the dot buttons starting at 1. |
 | disableActiveDots | boolean | true | No | Setting to true make all dots, including active dots, enabled. |
 | showAsSelectedForCurrentSlideOnly | boolean | false | No | Setting to true show only the current slide dot as selected. |
-| renderDots | function| null | No | It accpets `props` and overrides renderDots() in <DotGroup/>. |
+| renderDots | function| null | No | It accepts `props` and overrides renderDots() in <DotGroup/>. |
 
 #### The DotGroup component creates the following pseudo HTML by default:
 
@@ -355,7 +355,7 @@ A button for moving the slider backwards. Backwards on a horizontal carousel mea
 
 | property | type | default | required | purpose |
 | -------- | ---- | ------- | -------- | ------- |
-| **children** | [string&#124;node] | | **Yes** | Children is a special React property.  Basically, the ButtonnBack component needs to wrap other components and/or JSX |
+| **children** | [string&#124;node] | | **Yes** | Children is a special React property.  Basically, the ButtonBack component needs to wrap other components and/or JSX |
 | className | [string&#124;null] | null | No | Optional className string that will be appended to the component's className string. |
 | disabled | [boolean&#124;null] | null | No | Null means ButtonBack will automatically determine if this button is disabled. Setting this to true will force the button to be disabled.  Setting this to false will prevent the button from ever being disabled. |
 | onClick | [function&#124;null] | null | No | Optional callback function that is called after the internal onClick function is called. It is passed the React synthetic event |

Diff for: src/App/App.jsx

@@ -83,7 +83,7 @@ class DevelopmentApp extends React.Component {
           <h2 className={s.headline}>What is &quot;unopinionated?&quot;</h2>
           <p>
             The Pure React Carousel suite of React components is not a turn-key solution. Rather,
-            think of these as a set of new suite of HTML tags similar in realtionship to table tags
+            think of these as a set of new suite of HTML tags similar in relationship to table tags
             like table, tr, th, td, tbody, thead, tfoot.
           </p>
           <p>
@@ -102,7 +102,7 @@ class DevelopmentApp extends React.Component {
           <div className={s.examplesInnerCenter}>
             <h2 className={s.headline}>Real World Example</h2>
             <p>
-              Here are two examples of what can be acheived with Pure React Carousel. This is how we
+              Here are two examples of what can be achieved with Pure React Carousel. This is how we
               use the suite of components on the Express.com website.
             </p>
             <p>
@@ -128,8 +128,8 @@ class DevelopmentApp extends React.Component {
             <p>
               These examples are completely un-styled. Pure React Carousel does not come with styles
               that must be defeated in order to match your organization&apos;s branding. So, to
-              distract you from the seeming lack of finess, most of our examples involve pictures of
-              cats!
+              distract you from the seeming lack of finesse, most of our examples involve pictures
+              of cats!
             </p>
             <p>
               <label>

Diff for: src/App/examples/Example11/Example11.jsx

@@ -27,15 +27,15 @@ export default () => (
   >
     <h2 className={s.headline}>Carousel with custom event handlers.</h2>
     <p>
-      Simple carousel with custom event handlers attachet to the
+      Simple carousel with custom event handlers attached to the
       {' '}
       <code>&lt;Slider /&gt;</code>
       {' '}
       component&apos;s
       {' '}
       <code>trayProps</code>
       {' '}
-property. Open your browser devloper tools and look at
+      property. Open your browser developer tools and look at
       the console log, then manipulate the carousel.
     </p>
     <Slider

Diff for: src/App/examples/Example5/Example5.jsx

@@ -22,7 +22,7 @@ export default () => (
   >
     <h2 className={s.headline}>Horizontal Carousel (With Master Loading Spinner)</h2>
     <p>
-      Horizontal Carouisel with regular, non-zooming images and dotNumbers on the Dot
+      Horizontal Carousel with regular, non-zooming images and dotNumbers on the Dot
       Group.
     </p>
     <Slider className={s.slider}>

Diff for: src/App/examples/Example6/Example6.jsx

@@ -20,9 +20,9 @@ export default () => (
     naturalSlideHeight={500}
     hasMasterSpinner
   >
-    <h2 className={s.headline}>Simple Carousel with vertically alligned nav buttons</h2>
+    <h2 className={s.headline}>Simple Carousel with vertically aligned nav buttons</h2>
     <p>
-      Wrap the &lt;Slider /&gt;, &lt;ButtonBack /&gt;, &lt;ButonNext /&gt; components in a div with
+      Wrap the &lt;Slider /&gt;, &lt;ButtonBack /&gt;, &lt;ButtonNext /&gt; components in a div with
       relative positioning.  Add absolute positioning to the buttons.
     </p>
     <div className={s.container}>

Diff for: src/App/examples/Example7/Example7.jsx

@@ -21,7 +21,7 @@ export default () => (
     <h2 className={s.headline}>Simple Carousel With React Redux</h2>
     <p>
       The slides in this example use components that utilize React-Redux to track a counter value.
-      This example demonstraits that the context used by Pure React Carousel won&apos;t interfere
+      This example demonstrates that the context used by Pure React Carousel won&apos;t interfere
       with components connected to React-Redux.
     </p>
     <div className={s.container}>

Diff for: src/App/examples/Example8/Example8.jsx

@@ -18,10 +18,10 @@ export default () => (
   >
     <h2 className={s.headline}>Carousel (lockOnWindowScroll set to TRUE)</h2>
     <p>
-      - When scrolling the browser, up and down, horizontal scrollers will not scroll horizontally.
+      - When scrolling the browser, up and down, horizontal scrollbars will not scroll horizontally.
     </p>
     <p>
-      - When scrolling the browser, left and right, vertical scrollers will not scroll vertically.
+      - When scrolling the browser, left and right, vertical scrollbars will not scroll vertically.
     </p>
     <p>
       - This spinner will go away after all the images have loaded.