Fixing modal backdrop color

0xsequence · Feb 13, 2025 · 6518c3f · 6518c3f
1 parent 24fafa9
commit 6518c3f
Show file tree

Hide file tree

Showing 5 changed files with 3 additions and 12 deletions.
diff --git a/examples/react/src/components/Connected.tsx b/examples/react/src/components/Connected.tsx
@@ -791,7 +791,6 @@ export const Connected = () => {
               }
             }}
             scroll={false}
-            backdropColor="backgroundBackdrop"
             onClose={() => setIsCheckoutInfoModalOpen(false)}
           >
             <div id="sequence-kit-checkout-info-modal">

diff --git a/examples/react/src/index.css b/examples/react/src/index.css
@@ -6,11 +6,11 @@
 
 body {
   margin: 0;
-  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans',
-    'Helvetica Neue', sans-serif;
+  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans',
+    'Droid Sans', 'Helvetica Neue', sans-serif;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
-  background: var(--seq-colors-background-primary);
+  background: var(--seq-color-background-primary);
 }
 
 code {

diff --git a/packages/checkout/src/shared/components/KitCheckoutProvider.tsx b/packages/checkout/src/shared/components/KitCheckoutProvider.tsx
@@ -259,7 +259,6 @@ export const KitCheckoutContent = ({ children }: KitCheckoutProvider) => {
                               }
                             }}
                             scroll={false}
-                            backdropColor="backgroundBackdrop"
                             onClose={() => setOpenCheckoutModal(false)}
                           >
                             <div id="sequence-kit-checkout-content">
@@ -278,7 +277,6 @@ export const KitCheckoutContent = ({ children }: KitCheckoutProvider) => {
                               }
                             }}
                             scroll={false}
-                            backdropColor="backgroundBackdrop"
                             onClose={closeAddFunds}
                           >
                             <div id="sequence-kit-add-funds-content">
@@ -297,7 +295,6 @@ export const KitCheckoutContent = ({ children }: KitCheckoutProvider) => {
                                 scrollbarWidth: 'thin'
                               }
                             }}
-                            backdropColor="backgroundBackdrop"
                             onClose={() => setOpenPaymentSelectionModal(false)}
                           >
                             <div id="sequence-kit-payment-selection-content">
@@ -313,7 +310,6 @@ export const KitCheckoutContent = ({ children }: KitCheckoutProvider) => {
                                 ...getModalPositionCss(position)
                               }
                             }}
-                            backdropColor="backgroundBackdrop"
                             onClose={closeTransferFunds}
                           >
                             <div id="sequence-kit-transfer-funds-modal">
@@ -346,7 +342,6 @@ export const KitCheckoutContent = ({ children }: KitCheckoutProvider) => {
                                 ...getModalPositionCss(position)
                               }
                             }}
-                            backdropColor="backgroundBackdrop"
                             onClose={closeSwapModal}
                           >
                             <div id="sequence-kit-swap-modal">

diff --git a/packages/kit/src/components/KitProvider/KitProvider.tsx b/packages/kit/src/components/KitProvider/KitProvider.tsx
@@ -147,7 +147,6 @@ export const KitProvider = (props: KitConnectProviderProps) => {
                       {openConnectModal && (
                         <Modal
                           scroll={false}
-                          backdropColor="backgroundBackdrop"
                           size="sm"
                           contentProps={{
                             style: {
@@ -165,7 +164,6 @@ export const KitProvider = (props: KitConnectProviderProps) => {
                       {pendingRequestConfirmation && (
                         <Modal
                           scroll={false}
-                          backdropColor="backgroundBackdrop"
                           size="sm"
                           contentProps={{
                             style: {

diff --git a/packages/wallet/src/shared/KitWalletProvider/index.tsx b/packages/wallet/src/shared/KitWalletProvider/index.tsx
@@ -75,7 +75,6 @@ export const KitWalletContent = ({ children }: KitWalletProviderProps) => {
                     }
                   }}
                   scroll={false}
-                  backdropColor="backgroundBackdrop"
                   onClose={() => setOpenWalletModal(false)}
                 >
                   <div id="sequence-kit-wallet-content">