Hide the quote/reaction overlay on window resize

See https://www.woltlab.com/community/thread/309553-%C3%A4nderung-der-fenstergr%C3%B6%C3%9Fe-zitate-reaktionen/

diff --git a/ts/WoltLabSuite/Core/Ui/Message/Quote.ts b/ts/WoltLabSuite/Core/Ui/Message/Quote.ts
index d62f7c43fd76aa470708ae94c18398a47877a9bf..0487723d93dfaf1d68903bb4d68c232eb192839d 100644 (file)
--- a/ts/WoltLabSuite/Core/Ui/Message/Quote.ts
+++ b/ts/WoltLabSuite/Core/Ui/Message/Quote.ts
@@ -105,6 +105,14 @@ export class UiMessageQuote implements AjaxCallbackObject {
       },
       { passive: false },
     );
+
+    window.addEventListener(
+      "resize",
+      () => {
+        this.copyQuote.classList.remove("active");
+      },
+      { passive: true },
+    );
   }
 
   /**

diff --git a/ts/WoltLabSuite/Core/Ui/Reaction/Handler.ts b/ts/WoltLabSuite/Core/Ui/Reaction/Handler.ts
index b4fb00e27d0409b95bbdce8e5b831182216847ed..6c3de17677ab06ca0148d5de17b2dfd6926b51b3 100644 (file)
--- a/ts/WoltLabSuite/Core/Ui/Reaction/Handler.ts
+++ b/ts/WoltLabSuite/Core/Ui/Reaction/Handler.ts
@@ -99,6 +99,14 @@ class UiReactionHandler {
 
     DomChangeListener.add(`WoltLabSuite/Core/Ui/Reaction/Handler-${objectType}`, () => this.initReactButtons());
     UiCloseOverlay.add("WoltLabSuite/Core/Ui/Reaction/Handler", () => this._closePopover());
+
+    window.addEventListener(
+      "resize",
+      () => {
+        this._closePopover();
+      },
+      { passive: true },
+    );
   }
 
   /**

diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Message/Quote.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Message/Quote.js
index 431db62448b97bc7a7665795cd7121b52d9eb8f1..b0940925609449c4ea7aed85e63c532837380213 100644 (file)
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Message/Quote.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Message/Quote.js
@@ -49,6 +49,9 @@ define(["require", "exports", "tslib", "../../Ajax", "../../Core", "../../Event/
                     }, { once: true, passive: false });
                 }
             }, { passive: false });
+            window.addEventListener("resize", () => {
+                this.copyQuote.classList.remove("active");
+            }, { passive: true });
         }
         /**
          * Initializes message containers.

diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Reaction/Handler.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Reaction/Handler.js
index 95dd7ab9f9b45a1a7084652e55cfc444d59dc5ac..570f80ac07336ceef81b3bdc7c03020ed9d6dca9 100644 (file)
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Reaction/Handler.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Reaction/Handler.js
@@ -51,6 +51,9 @@ define(["require", "exports", "tslib", "../../Ajax", "../../Core", "../../Dom/Ch
             this.initReactButtons();
             Listener_1.default.add(`WoltLabSuite/Core/Ui/Reaction/Handler-${objectType}`, () => this.initReactButtons());
             CloseOverlay_1.default.add("WoltLabSuite/Core/Ui/Reaction/Handler", () => this._closePopover());
+            window.addEventListener("resize", () => {
+                this._closePopover();
+            }, { passive: true });
         }
         /**
          * Initializes all applicable react buttons with the given selector.