1 files changed, 6 insertions, 21 deletions
diff --git a/app/assets/javascripts/terms/components/app.vue b/app/assets/javascripts/terms/components/app.vue
index eecf32f83df..0ae97a47170 100644
--- a/app/assets/javascripts/terms/components/app.vue
+++ b/app/assets/javascripts/terms/components/app.vue
@@ -2,7 +2,6 @@
 import { GlButton, GlIntersectionObserver } from '@gitlab/ui';
 import SafeHtml from '~/vue_shared/directives/safe_html';
 
-import { FLASH_TYPES, FLASH_CLOSED_EVENT } from '~/flash';
 import { isLoggedIn } from '~/lib/utils/common_utils';
 import { __ } from '~/locale';
 import csrf from '~/lib/utils/csrf';
@@ -26,6 +25,9 @@ export default {
   data() {
     return {
       acceptDisabled: true,
+      observer: new MutationObserver(() => {
+        this.setScrollableViewportHeight();
+      }),
     };
   },
   computed: {
@@ -34,23 +36,10 @@ export default {
   mounted() {
     this.renderGFM();
     this.setScrollableViewportHeight();
-
-    this.$options.flashElements = [
-      ...document.querySelectorAll(
-        Object.values(FLASH_TYPES)
-          .map((flashType) => `.flash-${flashType}`)
-          .join(','),
-      ),
-    ];
-
-    this.$options.flashElements.forEach((flashElement) => {
-      flashElement.addEventListener(FLASH_CLOSED_EVENT, this.handleFlashClose);
-    });
+    this.observer.observe(document.body, { childList: true, subtree: true });
   },
   beforeDestroy() {
-    this.$options.flashElements.forEach((flashElement) => {
-      flashElement.removeEventListener(FLASH_CLOSED_EVENT, this.handleFlashClose);
-    });
+    this.observer.disconnect();
   },
   methods: {
     renderGFM() {
@@ -70,10 +59,6 @@ export default {
         scrollHeight - clientHeight
       }px)`;
     },
-    handleFlashClose(event) {
-      this.setScrollableViewportHeight();
-      event.target.removeEventListener(FLASH_CLOSED_EVENT, this.handleFlashClose);
-    },
     trackTrialAcceptTerms,
   },
 };
@@ -96,7 +81,7 @@ export default {
         </gl-intersection-observer>
       </div>
     </div>
-    <div v-if="isLoggedIn" class="gl-display-flex gl-justify-content-end">
+    <div v-if="isLoggedIn" class="gl-display-flex gl-justify-content-end gl-p-5">
       <form v-if="permissions.canDecline" method="post" :action="paths.decline">
         <gl-button type="submit">{{ $options.i18n.decline }}</gl-button>
         <input :value="$options.csrf.token" type="hidden" name="authenticity_token" />