From 9667eec67da7b0ea36375cec803b27d6737105f2 Mon Sep 17 00:00:00 2001
From: Ryon Coleman <ryon55@gmail.com>
Date: Thu, 8 Apr 2021 16:58:02 +0000
Subject: [PATCH 1/2] feat: hide popup before it's called the first time

---
 resources/js/Shared/Layouts/MapSheetLayout.vue | 9 ++++++++-
 1 file changed, 8 insertions(+), 1 deletion(-)

diff --git a/resources/js/Shared/Layouts/MapSheetLayout.vue b/resources/js/Shared/Layouts/MapSheetLayout.vue
index cd582047..ba62b0a6 100644
--- a/resources/js/Shared/Layouts/MapSheetLayout.vue
+++ b/resources/js/Shared/Layouts/MapSheetLayout.vue
@@ -6,8 +6,8 @@
       @source-data-loaded="sourceDataLoaded"
     />
     <parcel-popup
+      v-show="isPopupVisible"
       ref="parcelpopup"
-      :showed="true"
     >
       <parcel-info
         ref="parcelinfo"
@@ -36,6 +36,12 @@ export default {
   },
 
   layout: Layout,
+
+  data() {
+    return {
+      isPopupVisible: false,
+    };
+  },
   mounted: () => {
   },
   methods: {
@@ -79,6 +85,7 @@ export default {
         this.$refs.parcelpopup.open = false;
         this.$refs.mapboxmap.highlightClear();
       } else {
+        this.isPopupVisible = true;
         this.$refs.parcelpopup.setMapboxMap(this.$refs.mapboxmap.map);
         this.$refs.parcelpopup.setCoords(event.coords);
         this.$refs.parcelinfo.fetchParcel(event.properties.parcel_id);

From 87ac044104853dc9d5669a4c32ca0cfc2eda4158 Mon Sep 17 00:00:00 2001
From: Ryon Coleman <ryon55@gmail.com>
Date: Thu, 8 Apr 2021 16:58:53 +0000
Subject: [PATCH 2/2] feat: limit size of bottom sheet for desktop/landscape
 use

---
 resources/js/Shared/LPBottomSheet.vue  | 9 ++++++---
 resources/js/Shared/Layouts/Layout.vue | 2 +-
 2 files changed, 7 insertions(+), 4 deletions(-)

diff --git a/resources/js/Shared/LPBottomSheet.vue b/resources/js/Shared/LPBottomSheet.vue
index de97f3e9..4b4b0068 100644
--- a/resources/js/Shared/LPBottomSheet.vue
+++ b/resources/js/Shared/LPBottomSheet.vue
@@ -1,6 +1,6 @@
 <template>
-  <div class="lp-sheet">
-    <v-card>
+  <div class="lp-sheet d-flex">
+    <v-card class="d-flex flex-column flex-grow-1">
       <v-btn
         block
         plain
@@ -12,6 +12,7 @@
       <v-divider />
 
       <v-expansion-panels
+        style="flex: 1 1 auto; overflow: auto"
         flat
         tile
         :value="isExpanded ? 0 : false"
@@ -73,8 +74,10 @@ export default {
 <style lang="scss" scoped>
   .lp-sheet {
     bottom: 0;
+    max-height: 100%;
+    max-width: 100%;
     position: absolute;
-    width: 100%;
+    width: 425px;
     z-index: 2;
   }
 
diff --git a/resources/js/Shared/Layouts/Layout.vue b/resources/js/Shared/Layouts/Layout.vue
index 5ccb9467..085f76dd 100644
--- a/resources/js/Shared/Layouts/Layout.vue
+++ b/resources/js/Shared/Layouts/Layout.vue
@@ -17,7 +17,7 @@
       </v-btn>
     </v-bottom-navigation>
 
-    <v-main>
+    <v-main style="overflow: hidden">
       <slot />
     </v-main>
   </v-app>