fix(): Add 'back to' icon (#1327)

Author: imklau

src/_includes/menu/menu-destination.html

@@ -8,7 +8,8 @@
       <ul class="menu__list list list--unstyle">
         <li class="menu-item">
           <a href="{{ site.baseurl }}/connections/destinations/catalog/" class="menu-item__link menu-item__link--small menu-item__link--back">
-            Back to Connections
+            {% include icons/symbols/arrow-left.svg %}
+            <span>Back to Connections</span>
           </a>
         </li>
       </ul>

src/_includes/menu/menu-mobile.html

@@ -27,7 +27,10 @@
         <nav class="menu">
           <ul class="menu__list list list--unstyle">
             <li class="menu-item">
-              <a href="{{ site.baseurl }}/connections/destinations/catalog/" class="menu-item__link menu-item__link--small menu-item__link--highlight" data-ref="menu-panels[back]">Back to Connections</a>
+              <a href="{{ site.baseurl }}/connections/destinations/catalog/" class="menu-item__link menu-item__link--small menu-item__link--highlight menu-item__link--back" data-ref="menu-panels[back]">
+                {% include icons/symbols/arrow-left.svg %}
+                <span>Back to Connections</span>
+              </a>
             </li>
           </ul>
         </nav>
@@ -71,7 +74,10 @@
         <nav class="menu">
           <ul class="menu__list list list--unstyle">
             <li class="menu-item">
-              <a href="{{ site.baseurl }}/connections/sources/catalog/" class="menu-item__link menu-item__link--small menu-item__link--highlight" data-ref="menu-panels[back]">Back to Connections</a>
+              <a href="{{ site.baseurl }}/connections/sources/catalog/" class="menu-item__link menu-item__link--small menu-item__link--highlight menu-item__link--back" data-ref="menu-panels[back]">
+                {% include icons/symbols/arrow-left.svg %}
+                <span>Back to Connections</span>
+              </a>
             </li>
           </ul>
         </nav>

src/_includes/menu/menu-source.html

@@ -7,7 +7,10 @@
     <nav class="menu">
       <ul class="menu__list list list--unstyle">
         <li class="menu-item">
-          <a href="{{ site.baseurl }}/connections/sources/catalog/" class="menu-item__link menu-item__link--small menu-item__link--back">Back to Connections</a>
+          <a href="{{ site.baseurl }}/connections/sources/catalog/" class="menu-item__link menu-item__link--small menu-item__link--back">
+            {% include icons/symbols/arrow-left.svg %}
+            <span>Back to Connections</span>
+          </a>
         </li>
       </ul>
     </nav>

src/_includes/menu/menu-strat.html

@@ -6,7 +6,10 @@
     <nav class="menu">
       <ul class="menu__list list list--unstyle">
         <li class="menu-item">
-          <a href="{{ site.baseurl }}/connections/destinations/catalog/" class="menu-item__link menu-item__link--small menu-item__link--back">Back to Connections</a>
+          <a href="{{ site.baseurl }}/connections/destinations/catalog/" class="menu-item__link menu-item__link--small menu-item__link--back">
+            {% include icons/symbols/arrow-left.svg %}
+            <span>Back to Connections</span>
+          </a>
         </li>
       </ul>
     </nav>

src/_includes/menu/menu-warehouse.html

@@ -7,7 +7,10 @@
     <nav class="menu">
       <ul class="menu__list list list--unstyle">
         <li class="menu-item">
-          <a href="{{ site.baseurl }}/connections/storage/catalog/" class="menu-item__link menu-item__link--small menu-item__link--back">Back to Connections</a>
+          <a href="{{ site.baseurl }}/connections/storage/catalog/" class="menu-item__link menu-item__link--small menu-item__link--back">
+            {% include icons/symbols/arrow-left.svg %}
+            <span>Back to Connections</span>
+          </a>
         </li>
       </ul>
     </nav>

src/_sass/components/_menu-item.scss

@@ -69,6 +69,12 @@
       font-weight: 600;
       font-size: 12px;
       color: color(gray-700);
+
+      svg {
+        width: 10px;
+        margin-right: 8px;
+        align-self: baseline;
+      }
     }
 
     &--highlight {