From df2680ca42a0ef3f6c9fab9bd87ed0632121a987 Mon Sep 17 00:00:00 2001
From: Cord Slatton <cords@arcimoto.com>
Date: Tue, 10 Mar 2020 10:25:34 -0700
Subject: [PATCH] bugfix: prevent reveal/slide animation text wrap

---
 src/components/Menu.vue        | 8 +++++++-
 src/components/Menu/reveal.vue | 2 +-
 src/components/Menu/slide.vue  | 2 +-
 3 files changed, 9 insertions(+), 3 deletions(-)

diff --git a/src/components/Menu.vue b/src/components/Menu.vue
index 858991a..eb0b30f 100644
--- a/src/components/Menu.vue
+++ b/src/components/Menu.vue
@@ -1,7 +1,7 @@
 <template>
     <div>
         <div ref="sideNav" class="bm-menu">
-            <nav class="bm-item-list">
+            <nav class="bm-item-list" :style="{'--bmItemListWidth': ['slide', 'reveal'].includes(menuType) ? `${width}px` : 'auto'}">
                 <slot></slot>
             </nav>
             <span class="bm-cross-button cross-style" @click="closeMenu" :class="{ hidden: !crossIcon }">
@@ -65,6 +65,11 @@
           type: Boolean,
           required: false,
           default: false
+        },
+        menuType: {
+          type: String,
+          required: false,
+          default: null
         }
       },
       methods: {
@@ -251,6 +256,7 @@
       color: #b8b7ad;
       margin-left: 10%;
       font-size: 20px;
+      width: var(--bmItemListWidth);
     }
     .bm-item-list > * {
       display: flex;
diff --git a/src/components/Menu/reveal.vue b/src/components/Menu/reveal.vue
index ea62185..fc90812 100644
--- a/src/components/Menu/reveal.vue
+++ b/src/components/Menu/reveal.vue
@@ -1,6 +1,6 @@
 <template>
     <div>
-        <Menu v-bind="this.$attrs" @openMenu="push" @closeMenu="pull">
+        <Menu v-bind="this.$attrs" @openMenu="push" @closeMenu="pull" menuType="reveal">
             <slot></slot>
         </Menu>
     </div>
diff --git a/src/components/Menu/slide.vue b/src/components/Menu/slide.vue
index 46dd92c..5db8c7c 100644
--- a/src/components/Menu/slide.vue
+++ b/src/components/Menu/slide.vue
@@ -1,6 +1,6 @@
 <template>
     <div>
-        <Menu v-bind="this.$attrs" @openMenu="openMenu" @closeMenu="closeMenu">
+        <Menu v-bind="this.$attrs" @openMenu="openMenu" @closeMenu="closeMenu" menuType="slide">
             <slot></slot>
         </Menu>
     </div>