diff --git a/ui/src/components/ClickAwayContainer.ts b/ui/src/components/ClickAwayContainer.ts
index 277f1ea7..144a816d 100644
--- a/ui/src/components/ClickAwayContainer.ts
+++ b/ui/src/components/ClickAwayContainer.ts
@@ -58,25 +58,28 @@ export default Vue.extend({
active: {
immediate: true,
handler(isActive: boolean, wasActive: boolean): void {
- const { documentElement } = document;
- // We are listening for clicks on the documentElement. Listening for clicks
- // on the body elements also works but less reliably. For example if the height
- // the body element is < 100% there will be places on the page which will
- // emit nothing when clicked.
- if (documentElement == null) {
- warn(
- `v-${this}: Cannot do anything without a documentElement element.`
- );
- return;
- }
- if (isActive && !wasActive) {
- this.$el.addEventListener("click", this.click, false);
- documentElement.addEventListener("click", this.click, false);
- }
- if (!isActive && wasActive) {
- this.$el.removeEventListener("click", this.click, false);
- documentElement.removeEventListener("click", this.click, false);
- }
+ const raf = requestAnimationFrame || (cb => setTimeout(cb, 16));
+ raf(() => {
+ const { documentElement } = document;
+ // We are listening for clicks on the documentElement. Listening for clicks
+ // on the body elements also works but less reliably. For example if the height
+ // the body element is < 100% there will be places on the page which will
+ // emit nothing when clicked.
+ if (documentElement == null) {
+ warn(
+ `v-${this}: Cannot do anything without a documentElement element.`
+ );
+ return;
+ }
+ if (isActive && !wasActive) {
+ this.$el.addEventListener("click", this.click, false);
+ documentElement.addEventListener("click", this.click, false);
+ }
+ if (!isActive && wasActive) {
+ this.$el.removeEventListener("click", this.click, false);
+ documentElement.removeEventListener("click", this.click, false);
+ }
+ });
}
}
}
diff --git a/ui/src/components/Modal/Modal.vue b/ui/src/components/Modal/Modal.vue
index 2723b830..848f8107 100644
--- a/ui/src/components/Modal/Modal.vue
+++ b/ui/src/components/Modal/Modal.vue
@@ -1,53 +1,48 @@
-
-
+
-
-
-
-
-
-
-
-
-
+
-
+
+
+
+
+
+