Resolve ui bug

Koniverse · Feb 21, 2024 · a681077 · a681077
1 parent 11ce531
commit a681077
Show file tree

Hide file tree

Showing 5 changed files with 15 additions and 5 deletions.
diff --git a/packages/core/src/types.ts b/packages/core/src/types.ts
@@ -280,6 +280,7 @@ export type CommonPositions =
     | 'bottomRight'
     | 'bottomLeft'
     | 'topLeft'
+    | 'topCenter'
 
 export type AccountCenterPosition = CommonPositions
 

diff --git a/packages/core/src/validation.ts b/packages/core/src/validation.ts
@@ -156,7 +156,8 @@ const commonPositions = Joi.string().valid(
   'topRight',
   'bottomRight',
   'bottomLeft',
-  'topLeft'
+  'topLeft',
+  'topCenter'
 )
 
 const gasPriceProbabilities = [70, 80, 90, 95, 99]

diff --git a/packages/core/src/views/Index.svelte b/packages/core/src/views/Index.svelte
@@ -1,3 +1,4 @@
+
 <script lang="ts">
   import { shareReplay, startWith } from 'rxjs/operators'
   import { connectWallet$, switchChainModal$, wallets$ } from '../streams.js'
@@ -27,17 +28,23 @@
   const setPositioningDefaults = (targetComponentVariable: string) => {
     return {
       topLeft: `
-        top: var(--${targetComponentVariable}-position-top, 0);
+        top: var(--${targetComponentVariable}-position-top, 24px);
         left: var(--${targetComponentVariable}-position-left, 0);`,
       topRight: `
-        top: var(--${targetComponentVariable}-position-top, 0);
+        top: var(--${targetComponentVariable}-position-top, 24px);
         right: var(--${targetComponentVariable}-position-right, 0);`,
       bottomRight: `
         bottom: var(--${targetComponentVariable}-position-bottom, 0);
         right: var(--${targetComponentVariable}-position-right, 0);`,
       bottomLeft: `
         bottom: var(--${targetComponentVariable}-position-bottom, 0);
-        left: var(--${targetComponentVariable}-position-left, 0);`
+        left: var(--${targetComponentVariable}-position-left, 0);`,
+      topCenter:
+      ` top: var(--${targetComponentVariable}-position-top, 24px);
+        left: var(--${targetComponentVariable}-position-center, 50%);
+        transform: translate(-50%, -50%);
+      `
+
     }
   }
 

diff --git a/packages/core/src/views/notify/Notification.svelte b/packages/core/src/views/notify/Notification.svelte
@@ -70,6 +70,7 @@
     pointer-events: all;
     backdrop-filter: blur(5px);
     min-height: 56px;
+    max-width: 318px;
     display: flex;
     align-items: center;
     gap: var(--spacing-4);

diff --git a/packages/demo/src/web3-onboard.ts b/packages/demo/src/web3-onboard.ts
@@ -230,7 +230,7 @@ export default init({
         //   }
         // }
       },
-      position: 'topLeft'
+      position: 'topCenter'
     }
   }
 })
-Original file line number
+Diff line change
@@ Expand Up / @@ -230,7 +230,7 @@ export default init({ @@
             //   }
             // }
           },
-          position: 'topLeft'
+          position: 'topCenter'
         }
       }
     })