From 14ad091e83c12ff9dca49a6948cbeeac668730f4 Mon Sep 17 00:00:00 2001
From: Brandon Millman <brandon.millman@gmail.com>
Date: Tue, 4 Dec 2018 15:20:26 -0800
Subject: [PATCH 1/3] fix(instant): lighten the overlay color to 0.7 opacity
 from 0.9

---
 packages/instant/src/components/ui/overlay.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/instant/src/components/ui/overlay.tsx b/packages/instant/src/components/ui/overlay.tsx
index 7d311dc2f3..0b5eaf2993 100644
--- a/packages/instant/src/components/ui/overlay.tsx
+++ b/packages/instant/src/components/ui/overlay.tsx
@@ -33,7 +33,7 @@ export const Overlay =
 
 Overlay.defaultProps = {
     zIndex: zIndex.overlayDefault,
-    backgroundColor: generateOverlayBlack(0.9),
+    backgroundColor: generateOverlayBlack(0.7),
 };
 
 Overlay.displayName = 'Overlay';

From 8b659dbd77294f3d44f4c1fe75a62d6fec3fea15 Mon Sep 17 00:00:00 2001
From: Brandon Millman <brandon.millman@gmail.com>
Date: Tue, 4 Dec 2018 15:20:55 -0800
Subject: [PATCH 2/3] feat(instant): give a stable class name to the close
 button on the overlay

---
 .../components/zero_ex_instant_overlay.tsx    | 20 ++++++++++---------
 packages/instant/src/constants.ts             |  1 +
 2 files changed, 12 insertions(+), 9 deletions(-)

diff --git a/packages/instant/src/components/zero_ex_instant_overlay.tsx b/packages/instant/src/components/zero_ex_instant_overlay.tsx
index b3fb57dd63..f823d050df 100644
--- a/packages/instant/src/components/zero_ex_instant_overlay.tsx
+++ b/packages/instant/src/components/zero_ex_instant_overlay.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 
 import { ZeroExInstantContainer } from '../components/zero_ex_instant_container';
-import { MAIN_CONTAINER_DIV_CLASS, OVERLAY_DIV_CLASS } from '../constants';
+import { MAIN_CONTAINER_DIV_CLASS, OVERLAY_CLOSE_BUTTON_DIV_CLASS, OVERLAY_DIV_CLASS } from '../constants';
 import { ColorOption } from '../style/theme';
 
 import { Container } from './ui/container';
@@ -22,14 +22,16 @@ export const ZeroExInstantOverlay: React.StatelessComponent<ZeroExInstantOverlay
             <Overlay zIndex={zIndex} className={OVERLAY_DIV_CLASS}>
                 <Flex height="100vh">
                     <Container position="absolute" top="0px" right="0px" display={{ default: 'initial', sm: 'none' }}>
-                        <Icon
-                            height={18}
-                            width={18}
-                            color={ColorOption.white}
-                            icon="closeX"
-                            onClick={onClose}
-                            padding="2em 2em"
-                        />
+                        <Container className={OVERLAY_CLOSE_BUTTON_DIV_CLASS}>
+                            <Icon
+                                height={18}
+                                width={18}
+                                color={ColorOption.white}
+                                icon="closeX"
+                                onClick={onClose}
+                                padding="2em 2em"
+                            />
+                        </Container>
                     </Container>
                     <Container
                         width={{ default: 'auto', sm: '100%' }}
diff --git a/packages/instant/src/constants.ts b/packages/instant/src/constants.ts
index 2439c7349e..89d4b88d00 100644
--- a/packages/instant/src/constants.ts
+++ b/packages/instant/src/constants.ts
@@ -8,6 +8,7 @@ export const DEFAULT_ZERO_EX_CONTAINER_SELECTOR = '#zeroExInstantContainer';
 export const INJECTED_DIV_CLASS = 'zeroExInstantResetRoot';
 export const INJECTED_DIV_ID = 'zeroExInstant';
 export const OVERLAY_DIV_CLASS = 'zeroExInstantOverlay';
+export const OVERLAY_CLOSE_BUTTON_DIV_CLASS = 'zeroExInstantOverlayCloseButton';
 export const MAIN_CONTAINER_DIV_CLASS = 'zeroExInstantMainContainer';
 export const WEB_3_WRAPPER_TRANSACTION_FAILED_ERROR_MSG_PREFIX = 'Transaction failed';
 export const GWEI_IN_WEI = new BigNumber(1000000000);

From feb715a08bba50f07600ef747246cb8417f98cfe Mon Sep 17 00:00:00 2001
From: Brandon Millman <brandon.millman@gmail.com>
Date: Tue, 4 Dec 2018 15:44:48 -0800
Subject: [PATCH 3/3] fix(instant): remove extra container around the button

---
 .../components/zero_ex_instant_overlay.tsx    | 26 +++++++++++--------
 1 file changed, 15 insertions(+), 11 deletions(-)

diff --git a/packages/instant/src/components/zero_ex_instant_overlay.tsx b/packages/instant/src/components/zero_ex_instant_overlay.tsx
index f823d050df..96e5606917 100644
--- a/packages/instant/src/components/zero_ex_instant_overlay.tsx
+++ b/packages/instant/src/components/zero_ex_instant_overlay.tsx
@@ -21,17 +21,21 @@ export const ZeroExInstantOverlay: React.StatelessComponent<ZeroExInstantOverlay
         <ZeroExInstantProvider {...rest}>
             <Overlay zIndex={zIndex} className={OVERLAY_DIV_CLASS}>
                 <Flex height="100vh">
-                    <Container position="absolute" top="0px" right="0px" display={{ default: 'initial', sm: 'none' }}>
-                        <Container className={OVERLAY_CLOSE_BUTTON_DIV_CLASS}>
-                            <Icon
-                                height={18}
-                                width={18}
-                                color={ColorOption.white}
-                                icon="closeX"
-                                onClick={onClose}
-                                padding="2em 2em"
-                            />
-                        </Container>
+                    <Container
+                        className={OVERLAY_CLOSE_BUTTON_DIV_CLASS}
+                        position="absolute"
+                        top="0px"
+                        right="0px"
+                        display={{ default: 'initial', sm: 'none' }}
+                    >
+                        <Icon
+                            height={18}
+                            width={18}
+                            color={ColorOption.white}
+                            icon="closeX"
+                            onClick={onClose}
+                            padding="2em 2em"
+                        />
                     </Container>
                     <Container
                         width={{ default: 'auto', sm: '100%' }}