diff --git a/src/App.vue b/src/App.vue
index b3e60e0..4a4eb17 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,21 +1,15 @@
 <template>
   <ion-app>
-    <ion-split-pane content-id="main-content">
-      <RouteMenu v-if="!isOnBrokeringRunPage"/>
-      <ion-router-outlet id="main-content" />
-    </ion-split-pane>
+    <ion-router-outlet />
   </ion-app>
 </template>
 
 <script setup lang="ts">
-import { computed, onMounted, onUnmounted, ref } from 'vue';
-import { IonApp, IonRouterOutlet, IonSplitPane, loadingController, onIonViewWillEnter } from '@ionic/vue';
+import { onMounted, onUnmounted, ref } from 'vue';
+import { IonApp, IonRouterOutlet, loadingController } from '@ionic/vue';
 import emitter from "@/event-bus"
-import RouteMenu from "@/components/RouteMenu.vue"
-import { useRouter } from 'vue-router';
 
 const loader = ref(null) as any
-const router = useRouter();
 
 async function presentLoader(message = "Click the backdrop to dismiss.") {
   if (!loader.value) {
@@ -36,8 +30,6 @@ function dismissLoader() {
   }
 }
 
-const isOnBrokeringRunPage = computed(() => router.currentRoute.value.fullPath === '/tabs/brokering')
-
 onMounted(async () => {
   loader.value = await loadingController
     .create({
diff --git a/src/components/RouteMenu.vue b/src/components/RouteMenu.vue
index ee3ad61..8c1a5c7 100644
--- a/src/components/RouteMenu.vue
+++ b/src/components/RouteMenu.vue
@@ -1,7 +1,7 @@
 <template>
-  <div class="route-menu">
-    <div>
-      <ion-list>
+  <ion-menu>
+    <ion-content>
+      <ion-list v-show="isOnBrokeringRulePage">
         <ion-list-header ref="listHeader">
           <ion-label>{{ "Order batches" }}</ion-label>
           <ion-button color="primary" fill="clear">
@@ -9,14 +9,14 @@
             <ion-icon :icon="addCircleOutline" />
           </ion-button>
         </ion-list-header>
-        <ion-card v-for="card in [1, 2, 3, 4]" ref="cards" :key="card" @click.prevent="animate">
+        <ion-card v-for="card in [1, 2, 3, 4]" ref="cards" :key="card" @click.prevent="router.push('query')">
           <ion-item lines="full">
             <ion-label>
               <h1>{{ 'Order lookup name' }}</h1>
             </ion-label>
             <ion-chip>{{ `${card}/4` }}</ion-chip>
           </ion-item>
-          <ion-item v-show="isOnBrokeringRulePage" ref="item">
+          <ion-item ref="item">
             <ion-badge>{{ 'BADGE' }}</ion-badge>
             <ion-button fill="clear" color="medium" slot="end">
               {{ 'Archive' }}
@@ -24,21 +24,12 @@
           </ion-item>
         </ion-card>
       </ion-list>
-      <ion-footer v-show="isOnBrokeringRulePage">
-        <ion-toolbar>
-          <ion-item lines="none">
-            <ion-buttons>
-              <ion-button>
-                <ion-icon :icon="archiveOutline"/>
-                {{ "Archive" }}
-              </ion-button>
-            </ion-buttons>
-            <ion-badge slot="end">
-              {{ "4 rules" }}
-            </ion-badge>
-          </ion-item>
-        </ion-toolbar>
-      </ion-footer>
+      <ion-item lines="none">
+        <ion-label><h1>{{ "<order lookup name>" }}</h1></ion-label>
+        <ion-chip slot="end">{{ "2/4" }}
+          <ion-icon :icon="chevronUpOutline"/>
+        </ion-chip>
+      </ion-item>
       <ion-list v-show="!isOnBrokeringRulePage">
         <ion-item-group>
           <ion-item-divider color="medium">
@@ -95,13 +86,28 @@
           </ion-reorder-group>
         </ion-item-group>
       </ion-list>
-    </div>
-  </div>
+    </ion-content>
+    <ion-footer v-show="isOnBrokeringRulePage">
+      <ion-toolbar>
+        <ion-item lines="none">
+          <ion-buttons>
+            <ion-button>
+              <ion-icon :icon="archiveOutline"/>
+              {{ "Archive" }}
+            </ion-button>
+          </ion-buttons>
+          <ion-badge slot="end">
+            {{ "4 rules" }}
+          </ion-badge>
+        </ion-item>
+      </ion-toolbar>
+    </ion-footer>
+  </ion-menu>
 </template>
 
 <script setup lang="ts">
-import { IonBadge, IonButtons, IonButton, IonCard, IonChip, IonFooter, IonIcon, IonItem, IonItemDivider, IonItemGroup, IonLabel, IonList, IonListHeader, IonReorder, IonReorderGroup, IonSelect, IonSelectOption, IonToolbar, createAnimation } from '@ionic/vue';
-import { addCircleOutline, archiveOutline } from "ionicons/icons";
+import { IonBadge, IonButtons, IonButton, IonCard, IonChip, IonContent, IonFooter, IonIcon, IonItem, IonItemDivider, IonItemGroup, IonLabel, IonList, IonListHeader, IonMenu, IonReorder, IonReorderGroup, IonSelect, IonSelectOption, IonToolbar, createAnimation } from '@ionic/vue';
+import { addCircleOutline, archiveOutline, chevronUpOutline } from "ionicons/icons";
 import { computed, ref } from 'vue';
 import { useRouter } from 'vue-router';
 
@@ -109,73 +115,6 @@ const router = useRouter();
 const cards = ref([])
 const listHeader = ref(null) as any
 const item = ref(null) as any
-const moveTop = ref(0)
 
 const isOnBrokeringRulePage = computed(() => router.currentRoute.value.fullPath.includes('/route'))
-
-function animate(e: Event) {
-  if(isOnBrokeringRulePage.value) {
-    routeForward(e)
-  } else {
-    routeBackward(e)
-  }
-}
-
-function routeForward(e: Event) {
-  const element = e.currentTarget as HTMLElement
-  const hideCards = cards.value.map((card: any) => {
-    if(element != card.$el) {
-      return card.$el
-    }
-  }).filter(card => card)
-
-  
-  createAnimation()
-    .addElement(listHeader.value.$el)
-    .addElement(item.value.$el)
-    .addElement(hideCards)
-    .duration(1000)
-    .fromTo('opacity', '1', '0')
-    .to('display', 'none').play()
-  
-  moveTop.value = element.getBoundingClientRect().top
-
-  createAnimation()
-    .addElement(element)
-    .duration(1000)
-    .fromTo('transform', 'translateY(0px)', `translateY(-${moveTop.value}px)`).play()
-
-  router.push('query')
-}
-
-function routeBackward(e: Event) {
-  const showCards = cards.value.map((card: any) => {
-    if(e.currentTarget != card.$el) {
-      return card.$el
-    }
-  }).filter(card => card)
-  const element = e.currentTarget as HTMLElement
-  
-  createAnimation()
-  .addElement(listHeader.value.$el)
-  .addElement(item.value.$el)
-  .addElement(showCards)
-  .duration(1000)
-  .fromTo('opacity', '0', '1')
-  .to('display', 'block').play()
-  
-  createAnimation()
-    .addElement(element)
-    .duration(1000)
-    .fromTo('transform', `translateY(-${moveTop.value}px)`, 'translateY(0px)').play();
-
-  router.go(-1)
-}
-
 </script>
-
-<style scoped>
-.route-menu > div {
-  width: 100%;
-}
-</style>
diff --git a/src/views/BrokeringQuery.vue b/src/views/BrokeringQuery.vue
index 2d2ce52..588ae33 100644
--- a/src/views/BrokeringQuery.vue
+++ b/src/views/BrokeringQuery.vue
@@ -1,127 +1,196 @@
 <template>
   <ion-page>
-    <ion-split-pane content-id="query-content">
-      <ion-list>
-        <ion-reorder-group :disabled="false">
-          <ion-item>
-            <ion-label>{{ "Warehouse only" }}</ion-label>
-            <ion-reorder />
+    <ion-content>
+      <div>
+        <div class="menu">
+          <ion-item lines="none">
+            <ion-label>{{ "<order lookup name>" }}</ion-label>
+            <ion-chip slot="end" outline @click="router.push('route')">
+              {{ "2/4" }}
+              <ion-icon :icon="chevronUpOutline" />
+            </ion-chip>
           </ion-item>
-          <ion-item>
-            <ion-label>{{ "Warehouse and stores" }}</ion-label>
-            <ion-reorder />
-          </ion-item>
-          <ion-item>
-            <ion-label>{{ "Any Location" }}</ion-label>
-            <ion-reorder />
-          </ion-item>
-        </ion-reorder-group>
-      </ion-list>
-      <ion-content id="query-content">
-        <section class="filters">
-          <ion-card>
+          <ion-button expand="block">{{ "Save Changes" }}</ion-button>
+          <ion-item-group>
+            <ion-item-divider color="medium">
+              <ion-label>{{ 'Filters' }}</ion-label>
+            </ion-item-divider>
             <ion-item>
-              <ion-icon slot="start" :icon="filterOutline"/>
-              <ion-label>{{ "Filters" }}</ion-label>
-              <ion-icon :icon="optionsOutline"/>
+              <ion-select label="Queue" value="Brokering Queue">
+                <ion-select-option value="Brokering Queue">{{ 'Brokering Queue' }}</ion-select-option>
+              </ion-select>
             </ion-item>
             <ion-item>
-              <ion-select label="Group" value="East coast stores">
-                <ion-select-option value="East coast stores">{{ 'East coast stores' }}</ion-select-option>
+              <ion-select label="Shipping method" value="Next Day">
+                <ion-select-option value="Next Day">{{ 'Next Day' }}</ion-select-option>
               </ion-select>
             </ion-item>
             <ion-item>
-              <ion-select label="Proximity" value="Zone 1">
-                <ion-select-option value="Zone 1">{{ 'Zone 1' }}</ion-select-option>
+              <ion-select label="Order priority" value="High">
+                <ion-select-option value="High">{{ 'High' }}</ion-select-option>
               </ion-select>
             </ion-item>
             <ion-item>
-              <ion-label>{{ "Brokering safety stock" }}</ion-label>
-              <ion-chip>{{ "3" }}</ion-chip>
+              <ion-label>{{ 'Promise date' }}</ion-label>
+              <ion-chip>{{ 'select date' }}</ion-chip>
             </ion-item>
-          </ion-card>
-          <ion-card>
             <ion-item>
-              <ion-icon slot="start" :icon="swapVerticalOutline"/>
-              <ion-label>{{ "Sort" }}</ion-label>
-              <ion-icon :icon="optionsOutline"/>
+              <ion-select label="Queue" value="Brokering Queue">
+                <ion-select-option value="Brokering Queue">{{ 'Brokering Queue' }}</ion-select-option>
+              </ion-select>
             </ion-item>
+          </ion-item-group>
+          <ion-item-group>
+            <ion-item-divider color="medium">
+              <ion-label>{{ 'Sort' }}</ion-label>
+            </ion-item-divider>
             <ion-reorder-group :disabled="false">
               <ion-item>
-                <ion-label>{{ "Proximity" }}</ion-label>
+                <ion-label>{{ 'Ship by' }}</ion-label>
                 <ion-reorder />
               </ion-item>
               <ion-item>
-                <ion-label>{{ "Order limit" }}</ion-label>
+                <ion-label>{{ 'Ship after' }}</ion-label>
                 <ion-reorder />
               </ion-item>
               <ion-item>
-                <ion-label>{{ "Inventory balance" }}</ion-label>
+                <ion-label>{{ 'Order date' }}</ion-label>
                 <ion-reorder />
               </ion-item>
               <ion-item>
-                <ion-label>{{ "Custom Sequence" }}</ion-label>
+                <ion-label>{{ 'Shipping method' }}</ion-label>
                 <ion-reorder />
               </ion-item>
             </ion-reorder-group>
-          </ion-card>
-        </section>
-        <section>
-          <h2 class="ion-padding-start">{{ "Actions" }}</h2>
-          <div class="actions">
-            <ion-card>
-              <ion-item lines="none">
-                <ion-label>{{ "Fully available" }}</ion-label>
+          </ion-item-group>
+        </div>
+        <div class="menu">
+          <ion-list>
+            <ion-reorder-group :disabled="false">
+              <ion-item>
+                <ion-label>{{ "Warehouse only" }}</ion-label>
+                <ion-reorder />
               </ion-item>
-              <ion-item lines="none">
-                <ion-chip>{{ "Next rule" }}</ion-chip>
-                <ion-chip>{{ "Move to queue" }}</ion-chip>
-                <ion-chip>
-                  <ion-icon slot="start" :icon="checkmarkOutline" />
-                  {{ "Auto cancel days: 10" }}
-                </ion-chip>
+              <ion-item>
+                <ion-label>{{ "Warehouse and stores" }}</ion-label>
+                <ion-reorder />
               </ion-item>
-            </ion-card>
+              <ion-item>
+                <ion-label>{{ "Any Location" }}</ion-label>
+                <ion-reorder />
+              </ion-item>
+            </ion-reorder-group>
+          </ion-list>
+        </div>
+        <div>
+          <section class="filters">
             <ion-card>
-              <ion-item lines="none">
-                <ion-label>{{ "Partially available" }}</ion-label>
+              <ion-item>
+                <ion-icon slot="start" :icon="filterOutline"/>
+                <ion-label>{{ "Filters" }}</ion-label>
+                <ion-icon :icon="optionsOutline"/>
+              </ion-item>
+              <ion-item>
+                <ion-select label="Group" value="East coast stores">
+                  <ion-select-option value="East coast stores">{{ 'East coast stores' }}</ion-select-option>
+                </ion-select>
               </ion-item>
-              <ion-item lines="none">
-                <ion-chip>
-                  <ion-icon :icon="checkmarkOutline" />
-                  <ion-label>{{ "Allocate partial" }}</ion-label>
-                </ion-chip>
-                <ion-chip>{{ "Next rule" }}</ion-chip>
-                <ion-chip>{{ "Move to queue" }}</ion-chip>
-                <ion-chip>
-                  <ion-icon :icon="checkmarkOutline" />
-                  <ion-label>{{ "Auto cancel days: 10" }}</ion-label>
-                </ion-chip>
+              <ion-item>
+                <ion-select label="Proximity" value="Zone 1">
+                  <ion-select-option value="Zone 1">{{ 'Zone 1' }}</ion-select-option>
+                </ion-select>
+              </ion-item>
+              <ion-item>
+                <ion-label>{{ "Brokering safety stock" }}</ion-label>
+                <ion-chip>{{ "3" }}</ion-chip>
               </ion-item>
             </ion-card>
             <ion-card>
-              <ion-item lines="none">
-                <ion-label>{{ "Not available" }}</ion-label>
-              </ion-item>
-              <ion-item lines="none">
-                <ion-chip>{{ "Move to queue" }}</ion-chip>
-                <ion-chip>{{ "Next rule" }}</ion-chip>
-                <ion-chip>
-                  <ion-icon :icon="checkmarkOutline"/>
-                  <ion-label>{{ "Auto cancel days: 10" }}</ion-label>
-                </ion-chip>
+              <ion-item>
+                <ion-icon slot="start" :icon="swapVerticalOutline"/>
+                <ion-label>{{ "Sort" }}</ion-label>
+                <ion-icon :icon="optionsOutline"/>
               </ion-item>
+              <ion-reorder-group :disabled="false">
+                <ion-item>
+                  <ion-label>{{ "Proximity" }}</ion-label>
+                  <ion-reorder />
+                </ion-item>
+                <ion-item>
+                  <ion-label>{{ "Order limit" }}</ion-label>
+                  <ion-reorder />
+                </ion-item>
+                <ion-item>
+                  <ion-label>{{ "Inventory balance" }}</ion-label>
+                  <ion-reorder />
+                </ion-item>
+                <ion-item>
+                  <ion-label>{{ "Custom Sequence" }}</ion-label>
+                  <ion-reorder />
+                </ion-item>
+              </ion-reorder-group>
             </ion-card>
-          </div>
-        </section>
-      </ion-content>
-    </ion-split-pane>
+          </section>
+          <section>
+            <h2 class="ion-padding-start">{{ "Actions" }}</h2>
+            <div class="actions">
+              <ion-card>
+                <ion-item lines="none">
+                  <ion-label>{{ "Fully available" }}</ion-label>
+                </ion-item>
+                <ion-item lines="none">
+                  <ion-chip>{{ "Next rule" }}</ion-chip>
+                  <ion-chip>{{ "Move to queue" }}</ion-chip>
+                  <ion-chip>
+                    <ion-icon slot="start" :icon="checkmarkOutline" />
+                    {{ "Auto cancel days: 10" }}
+                  </ion-chip>
+                </ion-item>
+              </ion-card>
+              <ion-card>
+                <ion-item lines="none">
+                  <ion-label>{{ "Partially available" }}</ion-label>
+                </ion-item>
+                <ion-item lines="none">
+                  <ion-chip>
+                    <ion-icon :icon="checkmarkOutline" />
+                    <ion-label>{{ "Allocate partial" }}</ion-label>
+                  </ion-chip>
+                  <ion-chip>{{ "Next rule" }}</ion-chip>
+                  <ion-chip>{{ "Move to queue" }}</ion-chip>
+                  <ion-chip>
+                    <ion-icon :icon="checkmarkOutline" />
+                    <ion-label>{{ "Auto cancel days: 10" }}</ion-label>
+                  </ion-chip>
+                </ion-item>
+              </ion-card>
+              <ion-card>
+                <ion-item lines="none">
+                  <ion-label>{{ "Not available" }}</ion-label>
+                </ion-item>
+                <ion-item lines="none">
+                  <ion-chip>{{ "Move to queue" }}</ion-chip>
+                  <ion-chip>{{ "Next rule" }}</ion-chip>
+                  <ion-chip>
+                    <ion-icon :icon="checkmarkOutline"/>
+                    <ion-label>{{ "Auto cancel days: 10" }}</ion-label>
+                  </ion-chip>
+                </ion-item>
+              </ion-card>
+            </div>
+          </section>
+        </div>
+      </div>
+    </ion-content>
   </ion-page>
 </template>
 
 <script setup lang="ts">
-import { IonCard, IonChip, IonContent, IonIcon, IonItem, IonLabel, IonList, IonPage, IonReorder, IonReorderGroup, IonSelect, IonSelectOption, IonSplitPane } from "@ionic/vue";
-import { checkmarkOutline, filterOutline, optionsOutline, swapVerticalOutline } from "ionicons/icons"
+import { IonButton, IonCard, IonChip, IonContent, IonIcon, IonItem, IonItemDivider, IonItemGroup, IonLabel, IonList, IonPage, IonReorder, IonReorderGroup, IonSelect, IonSelectOption } from "@ionic/vue";
+import { checkmarkOutline, chevronUpOutline, filterOutline, optionsOutline, swapVerticalOutline } from "ionicons/icons"
+import { useRouter } from "vue-router";
+
+const router = useRouter();
 </script>
 
 <style scoped>
@@ -129,4 +198,14 @@ import { checkmarkOutline, filterOutline, optionsOutline, swapVerticalOutline }
   display: grid;
   grid-template-columns: repeat(2, auto);
 }
+
+ion-content > div {
+  display: grid;
+  grid-template-columns: 300px 300px 1fr;
+  height: 100%;
+}
+
+ion-content > div > .menu {
+  border-right: 1px solid #92949C;
+}
 </style>
diff --git a/src/views/BrokeringRoute.vue b/src/views/BrokeringRoute.vue
index f8bc40f..bb8ffdf 100644
--- a/src/views/BrokeringRoute.vue
+++ b/src/views/BrokeringRoute.vue
@@ -1,59 +1,89 @@
 <template>
   <ion-page>
-    <ion-header :translucent="true">
+    <ion-header>
       <ion-toolbar>
+        <ion-buttons slot="start">
+          <ion-back-button default-href="/" />
+        </ion-buttons>
         <ion-title>{{ "Brokering run name" }}</ion-title>
       </ion-toolbar>
     </ion-header>
-
     <ion-content>
-      <section class="ion-padding">
-        <main>
-          <ion-item lines="none">
-            {{ "Description" }}
-            <ion-button fill="clear" slot="end">
-              {{ "Edit" }}
+      <div>
+        <ion-list>
+          <ion-list-header ref="listHeader">
+            <ion-label>{{ "Order batches" }}</ion-label>
+            <ion-button color="primary" fill="clear">
+              {{ "New" }}
+              <ion-icon :icon="addCircleOutline" />
             </ion-button>
-          </ion-item>
-          <ion-item lines="none">
-            <ion-label>
-              {{ "This is what a long description of the routing rule that the user has created looks like. This also includes an edit button where the user can edit their description inline" }}
-            </ion-label>
-          </ion-item>
-        </main>
-        <aside>
-          <ion-card>
-            <ion-card-header>
-              <ion-card-title>
-                {{ "Scheduler" }}
-              </ion-card-title>
-            </ion-card-header>
+          </ion-list-header>
+          <ion-card v-for="card in [1, 2, 3, 4]" ref="cards" :key="card" @click="router.push('query')">
+            <ion-item lines="full">
+              <ion-label>
+                <h1>{{ 'Order lookup name' }}</h1>
+              </ion-label>
+              <ion-chip>{{ `${card}/4` }}</ion-chip>
+            </ion-item>
+            <ion-item ref="item">
+              <ion-badge>{{ 'BADGE' }}</ion-badge>
+              <ion-button fill="clear" color="medium" slot="end">
+                {{ 'Archive' }}
+              </ion-button>
+            </ion-item>
+          </ion-card>
+        </ion-list>
+        <section class="ion-padding">
+          <main>
+            <ion-item lines="none">
+              {{ "Description" }}
+              <ion-button fill="clear" slot="end">
+                {{ "Edit" }}
+              </ion-button>
+            </ion-item>
+            <ion-item lines="none">
+              <ion-label>
+                {{ "This is what a long description of the routing rule that the user has created looks like. This also includes an edit button where the user can edit their description inline" }}
+              </ion-label>
+            </ion-item>
+          </main>
+          <aside>
+            <ion-card>
+              <ion-card-header>
+                <ion-card-title>
+                  {{ "Scheduler" }}
+                </ion-card-title>
+              </ion-card-header>
+              <ion-item>
+                <ion-icon slot="start" :icon="timeOutline"/>
+                <ion-label>{{ 'Run time' }}</ion-label>
+                <ion-label slot="end">{{ '3:00 PM EST' }}</ion-label>
+              </ion-item>
+              <ion-item>
+                <ion-icon slot="start" :icon="timerOutline"/>
+                <ion-label>{{ 'Schedule' }}</ion-label>
+                <ion-label slot="end">{{ 'Every 5 minutes' }}</ion-label>
+              </ion-item>
+            </ion-card>
             <ion-item>
-              <ion-icon slot="start" :icon="timeOutline"/>
-              <ion-label>{{ 'Run time' }}</ion-label>
-              <ion-label slot="end">{{ '3:00 PM EST' }}</ion-label>
+              {{ 'Created at <time>' }}
             </ion-item>
             <ion-item>
-              <ion-icon slot="start" :icon="timerOutline"/>
-              <ion-label>{{ 'Schedule' }}</ion-label>
-              <ion-label slot="end">{{ 'Every 5 minutes' }}</ion-label>
+              {{ 'Updated at <time>' }}
             </ion-item>
-          </ion-card>
-          <ion-item>
-            {{ 'Created at <time>' }}
-          </ion-item>
-          <ion-item>
-            {{ 'Updated at <time>' }}
-          </ion-item>
-        </aside>
-      </section>
+          </aside>
+        </section>
+      </div>
     </ion-content>
   </ion-page>
 </template>
 
 <script setup lang="ts">
-import { IonButton, IonCard, IonCardHeader, IonCardTitle, IonContent, IonHeader, IonIcon, IonItem, IonLabel, IonPage, IonTitle, IonToolbar } from "@ionic/vue";
-import { timeOutline, timerOutline } from "ionicons/icons"
+import { IonBackButton, IonBadge, IonButtons, IonButton, IonCard, IonCardHeader, IonCardTitle, IonChip, IonContent, IonHeader, IonIcon, IonItem, IonLabel, IonList, IonListHeader, IonPage, IonTitle, IonToolbar } from "@ionic/vue";
+import { addCircleOutline, timeOutline, timerOutline } from "ionicons/icons"
+import { useRouter } from "vue-router";
+
+const router = useRouter();
 </script>
 
 <style scoped>
@@ -65,4 +95,14 @@ section {
 section > * {
   min-width: 40ch;
 }
+
+ion-content > div {
+  display: grid;
+  grid-template-columns: 300px 1fr;
+  height: 100%;
+}
+
+ion-content > div > ion-list {
+  border-right: 1px solid #92949C;
+}
 </style>
diff --git a/src/views/Settings.vue b/src/views/Settings.vue
index b897a74..7279234 100644
--- a/src/views/Settings.vue
+++ b/src/views/Settings.vue
@@ -39,7 +39,7 @@
 </template>
 
 <script lang="ts">
-import { alertController, IonButton, IonBackButton , IonContent, IonHeader,IonIcon, IonItem, IonLabel, IonPage, IonSelect, IonSelectOption, IonTitle, IonToolbar, popoverController, modalController } from '@ionic/vue';
+import { IonButton, IonBackButton , IonContent, IonHeader,IonIcon, IonItem, IonLabel, IonPage, IonSelect, IonSelectOption, IonTitle, IonToolbar, modalController } from '@ionic/vue';
 import { defineComponent } from 'vue';
 import { codeWorkingOutline, ellipsisVertical, personCircleOutline, storefrontOutline, timeOutline} from 'ionicons/icons'
 import { mapGetters, useStore } from 'vuex';
diff --git a/src/views/Tabs.vue b/src/views/Tabs.vue
index 02132ee..dd41dec 100644
--- a/src/views/Tabs.vue
+++ b/src/views/Tabs.vue
@@ -19,7 +19,7 @@
 
 <script setup lang="ts">
 import { IonIcon, IonLabel, IonPage, IonRouterOutlet, IonTabBar, IonTabButton, IonTabs,  } from "@ionic/vue";
-import { cogOutline, settingsOutline, shuffleOutline } from "ionicons/icons";
+import { settingsOutline, shuffleOutline } from "ionicons/icons";
 </script>
 
 <style scoped>