Fix mobile positioning of wallet select and magic overlay on mobile

Author: Adamj1232

packages/core/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@web3-onboard/core",
-  "version": "2.2.4",
+  "version": "2.2.5",
   "scripts": {
     "build": "rollup -c",
     "dev": "rollup -c -w",

packages/core/src/views/shared/Modal.svelte

@@ -58,7 +58,7 @@
 
   @media all and (max-width: 520px) {
     .relative {
-      width: calc(100% - 1rem);
+      width: 100vw;
     }
 
     .modal-overflow {

packages/magic/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@web3-onboard/magic",
-  "version": "2.0.2",
+  "version": "2.0.3",
   "description": "Magic module for Onboard.js",
   "scripts": {
     "build": "rollup -c",

packages/magic/src/index.ts

@@ -59,8 +59,6 @@ function magic(options: MagicInitOptions): WalletInit {
           }
         }
 
-        if (userEmail) loggedIn = await loginWithEmail(userEmail)
-
         const handleLogin = async () => {
           loggedIn = await loginModal({
             walletName: walletName,
@@ -77,6 +75,7 @@ function magic(options: MagicInitOptions): WalletInit {
           const patchedProvider = createEIP1193Provider(magicProvider, {
             eth_requestAccounts: async ({ baseRequest }) => {
               try {
+                if (userEmail) loggedIn = await loginWithEmail(userEmail)
                 if (!loggedIn) await handleLogin()
                 const accounts = await baseRequest({ method: 'eth_accounts' })
                 activeAddress = accounts[0]

packages/magic/src/view/LoginModal.svelte

@@ -208,6 +208,16 @@
       var(--onboard-font-family-light, var(--font-family-light))
     );
   }
+
+  @media all and (max-width: 520px) {
+    .onboard-magic-login-modal {
+      min-width: 22rem;
+      width: 98vw;
+    }
+    input[type='text'] {
+      width: 21rem;
+    }
+  }
 </style>
 
 <div class="container">

packages/react/package.json

@@ -22,7 +22,7 @@
   },
   "dependencies": {
     "@web3-onboard/common": "^2.0.6",
-    "@web3-onboard/core": "^2.2.4"
+    "@web3-onboard/core": "^2.2.5"
   },
   "peerDependencies": {
     "react": "^17.0.2"