From 1345110545151046fe18bc5a0659ef280805f25b Mon Sep 17 00:00:00 2001
From: Tyler Matteo <tylermatteo434@gmail.com>
Date: Thu, 22 Aug 2024 17:27:40 -0400
Subject: [PATCH] Add responsive padding to FlyToGeoJsonExtension

---
 app/extensions/FlyToGeoJsonExtension.ts | 18 +++++++++++++-----
 1 file changed, 13 insertions(+), 5 deletions(-)

diff --git a/app/extensions/FlyToGeoJsonExtension.ts b/app/extensions/FlyToGeoJsonExtension.ts
index a560317..80d36ac 100644
--- a/app/extensions/FlyToGeoJsonExtension.ts
+++ b/app/extensions/FlyToGeoJsonExtension.ts
@@ -24,14 +24,22 @@ export class FlyToGeoJsonExtension extends LayerExtension {
     ) {
       const viewport = this.context.viewport as WebMercatorViewport;
       const [minX, minY, maxX, maxY] = bbox(props.data as Geometry);
-      const { longitude, latitude, zoom } = viewport.fitBounds([
-        [minX, minY],
-        [maxX, maxY],
-      ]);
+      const { longitude, latitude, zoom } = viewport.fitBounds(
+        [
+          [minX, minY],
+          [maxX, maxY],
+        ],
+        {
+          padding:
+            window.innerWidth < 992
+              ? { top: 100, bottom: 400, left: 16, right: 16 }
+              : { top: 64, bottom: 64, left: 368, right: 368 },
+        },
+      );
       const newViewState = {
         longitude,
         latitude,
-        zoom: zoom - 0.25,
+        zoom: zoom,
         transitionDuration: 750,
         transitionInterpolator: new FlyToInterpolator(),
       };