From c68b1af196c31f846dae939fa336acd9c91d114e Mon Sep 17 00:00:00 2001
From: Kalpesh Mehta <k@lpe.sh>
Date: Sat, 5 May 2018 15:29:38 -0700
Subject: [PATCH 1/3] Fixed typo in _buttons.less

---
 lib/web/css/docs/source/_buttons.less | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/lib/web/css/docs/source/_buttons.less b/lib/web/css/docs/source/_buttons.less
index a81599c517ff8..a071eed85ef9e 100644
--- a/lib/web/css/docs/source/_buttons.less
+++ b/lib/web/css/docs/source/_buttons.less
@@ -397,7 +397,7 @@ button {
 
 //  # Button with an icon on the left or right side of the text
 //
-//  <code>@_button-icon-font-position</code> variable is used to set up the icon postiton
+//  <code>@_button-icon-font-position</code> variable is used to set up the icon position
 //
 //  Use <code>before</code> to set up button icon position on the left:
 //  ```css
@@ -818,7 +818,7 @@ button {
 
 //  # Link as a button
 //
-//  The <code>.lib-link-as-button()</code> mixin is used to reset link styles (text-decoration and display inline). Then to make it look like a button, you need to add the <code>.lib-button()</code> mixin with appropriate paremeters.
+//  The <code>.lib-link-as-button()</code> mixin is used to reset link styles (text-decoration and display inline). Then to make it look like a button, you need to add the <code>.lib-button()</code> mixin with appropriate parameters.
 //
 //  ```html
 //  <a href="#" class="example-button-9"><span>Button</span></a>

From f48135bf1b857ca69ddaba69fb8e5af0755cfab0 Mon Sep 17 00:00:00 2001
From: Kalpesh Mehta <k@lpe.sh>
Date: Sat, 5 May 2018 15:30:48 -0700
Subject: [PATCH 2/3] Fixed typo in _typography.less

---
 lib/web/css/docs/source/_typography.less | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/lib/web/css/docs/source/_typography.less b/lib/web/css/docs/source/_typography.less
index 294f6446fdf13..b360c672a6d7c 100644
--- a/lib/web/css/docs/source/_typography.less
+++ b/lib/web/css/docs/source/_typography.less
@@ -3,7 +3,7 @@
 //  * See COPYING.txt for license details.
 //  */
 
-//  # Typogrphy
+//  # Typography
 //
 //  Magento UI library provides mixins for typography styling. To configure typography, global variables from **_variables.less** file are used.
 //
@@ -978,7 +978,7 @@
 
 //  # Text hide
 //
-//  The <code>.lib-text-hide()</code> mixin hides a text of the element the mixin is applyed to.
+//  The <code>.lib-text-hide()</code> mixin hides a text of the element the mixin is applied to.
 //
 //  ```html
 //  <p class="example-text-hide">

From 32bd463597c554a7825b33c4e3f60273895a9466 Mon Sep 17 00:00:00 2001
From: Kalpesh Mehta <k@lpe.sh>
Date: Sat, 5 May 2018 15:31:34 -0700
Subject: [PATCH 3/3] Fixed typo in _layout.less

---
 lib/web/css/docs/source/_layout.less | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/lib/web/css/docs/source/_layout.less b/lib/web/css/docs/source/_layout.less
index 37598197142f6..799f940b44c02 100644
--- a/lib/web/css/docs/source/_layout.less
+++ b/lib/web/css/docs/source/_layout.less
@@ -91,7 +91,7 @@ footer.footer {
 //            <th>@gutter-width</th>
 //            <td class="vars_value">0</td>
 //            <td class="vars_value">'' | false | value</td>
-//            <td>Distanse between columns</td>
+//            <td>Distance between columns</td>
 //        </tr>
 //        <tr>
 //            <th colspan="4" class="vars_section">Variables for layout columns</th>
@@ -361,7 +361,7 @@ footer.footer {
 
 //  # Layout width
 //
-//  The <code>.lib-layout-width()</code> mixin is used to set default page width of the element the mixin is applyed to. It can be used to set width for the whole page wrapper or for the page elements individualy like header, footer, and so on.
+//  The <code>.lib-layout-width()</code> mixin is used to set default page width of the element the mixin is applied to. It can be used to set width for the whole page wrapper or for the page elements individualy like header, footer, and so on.
 
 //  # Layout width variables
 //