Merge branch 'patching-v0.27'

diff --combined resources/js/components/page-comments.js
index cabce91396082cf1944153e274d590643ed25742,5d8d169589804a5c92fd355281353bdcdaf6ed88..5d8d169589804a5c92fd355281353bdcdaf6ed88
--- 1/resources/js/components/page-comments.js
--- 2/resources/assets/js/components/page-comments.js
+++ b/resources/js/components/page-comments.js
@@@ -26,10 -26,12 +26,12 @@@ class PageComments 
  
      handleAction(event) {
          let actionElem = event.target.closest('[action]');
+ 
          if (event.target.matches('a[href^="#"]')) {
              const id = event.target.href.split('#')[1];
              scrollAndHighlightElement(document.querySelector('#' + id));
          }
+ 
          if (actionElem === null) return;
          event.preventDefault();
  

diff --combined resources/js/services/animations.js
index 8a3e9a57b4ac1a22a932981296570468f4a960f9,b6158ea5f8fbee97872d6350f0a8fa72e9954c13..b6158ea5f8fbee97872d6350f0a8fa72e9954c13
--- 1/resources/js/services/animations.js
--- 2/resources/assets/js/services/animations.js
+++ b/resources/js/services/animations.js
@@@ -1,3 -1,10 +1,10 @@@
+ /**
+  * Used in the function below to store references of clean-up functions.
+  * Used to ensure only one transitionend function exists at any time.
+  * @type {WeakMap<object, any>}
+  */
+ const animateStylesCleanupMap = new WeakMap();
+ 
  /**
   * Fade out the given element.
   * @param {Element} element
@@@ -5,6 -12,7 +12,7 @@@
   * @param {Function|null} onComplete
   */
  export function fadeOut(element, animTime = 400, onComplete = null) {
+     cleanupExistingElementAnimation(element);
      animateStyles(element, {
          opacity: ['1', '0']
      }, animTime, () => {
@@@ -19,6 -27,7 +27,7 @@@
   * @param {Number} animTime
   */
  export function slideUp(element, animTime = 400) {
+     cleanupExistingElementAnimation(element);
      const currentHeight = element.getBoundingClientRect().height;
      const computedStyles = getComputedStyle(element);
      const currentPaddingTop = computedStyles.getPropertyValue('padding-top');
@@@ -41,6 -50,7 +50,7 @@@
   * @param {Number} animTime - Animation time in ms
   */
  export function slideDown(element, animTime = 400) {
+     cleanupExistingElementAnimation(element);
      element.style.display = 'block';
      const targetHeight = element.getBoundingClientRect().height;
      const computedStyles = getComputedStyle(element);
@@@ -56,13 -66,6 +66,6 @@@
      animateStyles(element, animStyles, animTime);
  }
  
- /**
-  * Used in the function below to store references of clean-up functions.
-  * Used to ensure only one transitionend function exists at any time.
-  * @type {WeakMap<object, any>}
-  */
- const animateStylesCleanupMap = new WeakMap();
- 
  /**
   * Animate the css styles of an element using FLIP animation techniques.
   * Styles must be an object where the keys are style properties, camelcase, and the values
@@@ -84,23 -87,28 +87,28 @@@ function animateStyles(element, styles
          }
          element.style.transition = null;
          element.removeEventListener('transitionend', cleanup);
+         animateStylesCleanupMap.delete(element);
          if (onComplete) onComplete();
      };
  
      setTimeout(() => {
-         requestAnimationFrame(() => {
-             element.style.transition = `all ease-in-out ${animTime}ms`;
-             for (let style of styleNames) {
-                 element.style[style] = styles[style][1];
-             }
+         element.style.transition = `all ease-in-out ${animTime}ms`;
+         for (let style of styleNames) {
+             element.style[style] = styles[style][1];
+         }
  
-             if (animateStylesCleanupMap.has(element)) {
-                 const oldCleanup = animateStylesCleanupMap.get(element);
-                 element.removeEventListener('transitionend', oldCleanup);
-             }
+         element.addEventListener('transitionend', cleanup);
+         animateStylesCleanupMap.set(element, cleanup);
+     }, 15);
+ }
  
-             element.addEventListener('transitionend', cleanup);
-             animateStylesCleanupMap.set(element, cleanup);
-         });
-     }, 10);
+ /**
+  * Run the active cleanup action for the given element.
+  * @param {Element} element
+  */
+ function cleanupExistingElementAnimation(element) {
+     if (animateStylesCleanupMap.has(element)) {
+         const oldCleanup = animateStylesCleanupMap.get(element);
+         oldCleanup();
+     }
  }

diff --combined resources/sass/styles.scss
index 8f1fef70c9c512b0629dcef8545304d9779f3b16,1f4d00f6b9606b1ebe15d94b0c5b8788dd747b6e..1f4d00f6b9606b1ebe15d94b0c5b8788dd747b6e
--- 1/resources/sass/styles.scss
--- 2/resources/assets/sass/styles.scss
+++ b/resources/sass/styles.scss
@@@ -253,7 -253,8 +253,8 @@@ $btt-size: 40px
    .list-sort {
      display: inline-grid;
      margin-left: $-s;
-     grid-template-columns: 120px 40px;
+     grid-template-columns: minmax(120px, max-content) 40px;
+     font-size: 0.9rem;
      border: 2px solid #DDD;
      border-radius: 4px;
    }