From e93a49c654aee630fe3941e0c7a431624af01282 Mon Sep 17 00:00:00 2001
From: Jamey Huffnagle <jamey.huffnagle@opentrons.com>
Date: Mon, 21 Oct 2024 16:47:07 -0400
Subject: [PATCH] refactor(app): permit scrolling during ER & drop tip on
 desktop app

---
 app/src/organisms/DropTipWizardFlows/DropTipWizard.tsx     | 7 ++++++-
 .../shared/RecoveryInterventionModal.tsx                   | 7 +++++--
 2 files changed, 11 insertions(+), 3 deletions(-)

diff --git a/app/src/organisms/DropTipWizardFlows/DropTipWizard.tsx b/app/src/organisms/DropTipWizardFlows/DropTipWizard.tsx
index a81891d2144..be4cc9979ef 100644
--- a/app/src/organisms/DropTipWizardFlows/DropTipWizard.tsx
+++ b/app/src/organisms/DropTipWizardFlows/DropTipWizard.tsx
@@ -17,6 +17,7 @@ import {
   ModalShell,
   DISPLAY_FLEX,
   OVERFLOW_HIDDEN,
+  OVERFLOW_AUTO,
 } from '@opentrons/components'
 
 import { getTopPortalEl } from '/app/App/portal'
@@ -307,7 +308,11 @@ function useInitiateExit(): {
 const SHARED_STYLE = `
   display: ${DISPLAY_FLEX};
   flex-direction: ${DIRECTION_COLUMN};
-  overflow: ${OVERFLOW_HIDDEN};
+  overflow-y: ${OVERFLOW_AUTO};
+  
+  @media ${RESPONSIVENESS.touchscreenMediaQuerySpecs} {
+    overflow: ${OVERFLOW_HIDDEN};
+  }
 `
 
 const INTERVENTION_CONTAINER_STYLE = css`
diff --git a/app/src/organisms/ErrorRecoveryFlows/shared/RecoveryInterventionModal.tsx b/app/src/organisms/ErrorRecoveryFlows/shared/RecoveryInterventionModal.tsx
index 631c7c0c962..ccfaa8376ba 100644
--- a/app/src/organisms/ErrorRecoveryFlows/shared/RecoveryInterventionModal.tsx
+++ b/app/src/organisms/ErrorRecoveryFlows/shared/RecoveryInterventionModal.tsx
@@ -4,6 +4,7 @@ import { css } from 'styled-components'
 
 import {
   Flex,
+  OVERFLOW_AUTO,
   OVERFLOW_HIDDEN,
   RESPONSIVENESS,
   SPACING,
@@ -56,19 +57,21 @@ const SMALL_MODAL_STYLE = css`
   height: 22rem;
   padding: ${SPACING.spacing32};
   width: 100%;
-  overflow: ${OVERFLOW_HIDDEN};
+  overflow-y: ${OVERFLOW_AUTO};
 
   @media ${RESPONSIVENESS.touchscreenMediaQuerySpecs} {
     padding: ${SPACING.spacing32};
     height: 100%;
+    overflow: ${OVERFLOW_HIDDEN};
   }
 `
 const LARGE_MODAL_STYLE = css`
   height: 26.75rem;
   width: 100%;
-  overflow: ${OVERFLOW_HIDDEN};
+  overflow-y: ${OVERFLOW_AUTO};
 
   @media ${RESPONSIVENESS.touchscreenMediaQuerySpecs} {
     height: 100%;
+    overflow: ${OVERFLOW_HIDDEN};
   }
 `