修复取色器父级hidden覆盖bug

package.json

@@ -2,7 +2,7 @@
   "name": "svelma-pro",
   "svelte": "src/index.js",
   "description": "Based on svelma project extension and modification",
-  "version": "1.2.0",
+  "version": "1.2.1",
   "author": "KeiferJu",
   "license": "MIT",
   "keywords": [
@@ -30,6 +30,7 @@
     "bulma": "^0.8.0"
   },
   "dependencies": {
+    "emotion": "^10.0.27",
     "tinycolor2": "^1.4.1",
     "tippy.js": "^6.2.3"
   },

src/components/ColorPicker/ColorPicker.svelte

@@ -10,9 +10,16 @@
   export let width = "200px";
 
    let active = false;
+
+   let panelX = 0;
+   let panelY = 0;
+   let transformX = 0;
   onMount(() => {});
 
   function openChrome(event) {
+    panelX = event.clientX - event.offsetX;;
+    panelY = event.clientY;
+    transformX = event.target.offsetWidth + 5;
     if (!active) {
       active = true;
     }
@@ -39,9 +46,8 @@
   }
 
    .smx-color-panel {
-      position: absolute;
+      position: fixed;
-      top: -105px;
+      z-index: 9999;
-      right: -250px;
     }
 </style>
 <svelte:window on:click={closeChrome}/>
@@ -55,7 +61,7 @@
     style="background: {color};"
     readonly />
   {#if active}
-    <div class="smx-color-panel" on:click|stopPropagation>
+    <div class="smx-color-panel" on:click|stopPropagation style="top: {panelY}px;left:{panelX}px;transform: translate({transformX}px, -50%)">
       <Chrome startColor={color} on:input={handleInput} fieldsIndex={fieldsIndex}/>
     </div>
   {/if}