From a86d54828869240fcab2c6119efe71752c0fb28f Mon Sep 17 00:00:00 2001
From: Colin Spence <udappia@gmail.com>
Date: Tue, 29 Mar 2022 12:09:33 -0600
Subject: [PATCH] Removes modal overlay blur animation and keyframes

---
 src/views/AddModule/modals/AddModuleModal.tsx       | 12 ------------
 src/views/TransactionBuilder/TransactionBuilder.tsx | 12 ------------
 2 files changed, 24 deletions(-)

diff --git a/src/views/AddModule/modals/AddModuleModal.tsx b/src/views/AddModule/modals/AddModuleModal.tsx
index 01bcec68..58ab5260 100644
--- a/src/views/AddModule/modals/AddModuleModal.tsx
+++ b/src/views/AddModule/modals/AddModuleModal.tsx
@@ -48,9 +48,6 @@ const useStyles = makeStyles((theme) => ({
   },
   backdrop: {
     backdropFilter: "blur(4px)",
-    animationName: "$blur",
-    animationDuration: "500ms",
-    animationTimingFunction: "ease",
   },
   description: {
     marginTop: theme.spacing(1),
@@ -94,14 +91,6 @@ const useStyles = makeStyles((theme) => ({
   warningText: {
     color: "#E0B325",
   },
-  "@keyframes blur": {
-    "0%": {
-      backdropFilter: "blur(0px)",
-    },
-    "100%": {
-      backdropFilter: "blur(4px)",
-    },
-  },
 }));
 
 export const AddModuleModal: React.FC<AddModuleModalProps> = ({
@@ -127,7 +116,6 @@ export const AddModuleModal: React.FC<AddModuleModalProps> = ({
       className={classNames(classes.modal, classes.row, classes.center)}
       BackdropProps={{
         className: classes.backdrop,
-        invisible: true,
       }}
     >
       <Fade in={open}>
diff --git a/src/views/TransactionBuilder/TransactionBuilder.tsx b/src/views/TransactionBuilder/TransactionBuilder.tsx
index 82e4326c..a40d787c 100644
--- a/src/views/TransactionBuilder/TransactionBuilder.tsx
+++ b/src/views/TransactionBuilder/TransactionBuilder.tsx
@@ -70,17 +70,6 @@ const useStyles = makeStyles((theme) => ({
   },
   backdrop: {
     backdropFilter: "blur(4px)",
-    animationName: "$blur",
-    animationDuration: "500ms",
-    animationTimingFunction: "ease",
-  },
-  "@keyframes blur": {
-    "0%": {
-      backdropFilter: "blur(0px)",
-    },
-    "100%": {
-      backdropFilter: "blur(4px)",
-    },
   },
   bagIcon: {
     marginLeft: theme.spacing(2),
@@ -158,7 +147,6 @@ export const TransactionBuilder = () => {
       className={classes.modal}
       BackdropProps={{
         className: classes.backdrop,
-        invisible: true,
       }}
     >
       <Fade in={open}>