diff --git a/src/App.vue b/src/App.vue
index 61beeb75..be0aeeb7 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -30,10 +30,8 @@
+ style="width: 100%; pointer-events: none"
+ >
+
diff --git a/src/styles/index.css b/src/styles/index.css
index c3d4933d..c10c6683 100644
--- a/src/styles/index.css
+++ b/src/styles/index.css
@@ -91,7 +91,11 @@ input[type='number']::-webkit-inner-spin-button {
}
.w-dialog {
- width: 300px;
+ width: 24rem;
+}
+
+.w-toast {
+ width: 24rem;
}
.w-quick-edit {
diff --git a/src/utils/interactive.ts b/src/utils/interactive.ts
index 07390cf1..3fc84d3e 100644
--- a/src/utils/interactive.ts
+++ b/src/utils/interactive.ts
@@ -34,11 +34,7 @@ export async function showDialog(options: DO) {
},
});
- const fragment = document.createDocumentFragment();
-
- // @ts-ignore
- dialogApp.mount(fragment);
- document.body.append(fragment);
+ fragmentMountComponent(dialogApp);
}) as DialogReturn;
}
@@ -49,40 +45,13 @@ export async function showToast(options: ToastOptions) {
},
});
- replaceAndAppendMount(toastApp, 'toast-target');
+ fragmentMountComponent(toastApp);
}
-function replaceAndAppendMount(app: App, replaceId: string) {
+function fragmentMountComponent(app: App) {
const fragment = document.createDocumentFragment();
- const target = document.getElementById(replaceId);
- if (target === null) {
- return;
- }
-
- const parent = target.parentElement;
- const clone = target.cloneNode();
// @ts-ignore
app.mount(fragment);
- target.replaceWith(fragment);
- parent!.append(clone);
+ document.body.append(fragment);
}
-
-// @ts-ignore
-window.st = () => showToast({ message: 'peace' });
-
-// @ts-ignore
-window.sd = async function () {
- const options = {
- title: 'Do This?',
- description: 'Give me confirmation, should I do this?',
- buttons: [
- { label: 'Yes', handler: () => 'do it', isPrimary: true },
- { label: 'No', handler: () => 'dont do it' },
- ],
- };
-
- const ret = await showDialog(options);
- console.log(ret);
- return ret;
-};