Add modals z-index (#876)

* Add modals z-index

* Fix typo in docs

Author: lnbc1QWFyb24

packages/core/README.md

@@ -414,6 +414,8 @@ The Onboard styles can customized via [CSS variables](https://developer.mozilla.
   /* SHADOWS */
   --onboard-shadow-1: 0px 4px 12px rgba(0, 0, 0, 0.1);
   --onboard-shadow-2: inset 0px -1px 0px rgba(0, 0, 0, 0.1);
+
+  --onboard-modal-z-index
 }
 ```
 

packages/core/package.json

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

packages/core/src/index.ts

@@ -174,6 +174,8 @@ function mountApp() {
           /* SHADOWS */
           --shadow-1: 0px 4px 12px rgba(0, 0, 0, 0.1);
           --shadow-2: inset 0px -1px 0px rgba(0, 0, 0, 0.1);
+
+          --modal-z-index: 10;
         }
       </style>
     `

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

@@ -25,7 +25,7 @@
     top: 0;
     left: 0;
     pointer-events: none;
-    z-index: 10;
+    z-index: var(--onboard-modal-z-index, var(--modal-z-index));
   }
 
   .background {