Blind in quick options rather than hiding on runtime

Looks far better than having these dots disappear for no reason.

diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Mobile.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Mobile.js
index 708ef7ce1c85e7916902f62aae1ff0a09aae4b38..6c5f7c3cb3a75f8a8c37681da224d956b6dd0372 100644 (file)
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Mobile.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Mobile.js
@@ -186,20 +186,16 @@ define(
                                        });
                                        
                                        var quickOptions = elBySel('.messageQuickOptions', message);
-                                       if (quickOptions) {
-                                               if (navigation.childElementCount) {
-                                                       quickOptions.addEventListener(WCF_CLICK_EVENT, function (event) {
-                                                               if (_enabled) {
-                                                                       event.preventDefault();
-                                                                       event.stopPropagation();
-                                                                       
-                                                                       navigation.classList.toggle('open');
-                                                               }
-                                                       });
-                                               }
-                                               else {
-                                                       elHide(quickOptions);
-                                               }
+                                       if (quickOptions && navigation.childElementCount) {
+                                               quickOptions.classList.add('active');
+                                               quickOptions.addEventListener(WCF_CLICK_EVENT, function (event) {
+                                                       if (_enabled) {
+                                                               event.preventDefault();
+                                                               event.stopPropagation();
+                                                               
+                                                               navigation.classList.toggle('open');
+                                                       }
+                                               });
                                        }
                                }
                                

diff --git a/wcfsetup/install/files/style/ui/message.scss b/wcfsetup/install/files/style/ui/message.scss
index 6b6377cf2aa7183ccb7520b611c1525ee5a6f80f..441bdad11c551630c10d9e9b582a6afcb9448896 100644 (file)
--- a/wcfsetup/install/files/style/ui/message.scss
+++ b/wcfsetup/install/files/style/ui/message.scss
@@ -382,7 +382,10 @@
        @include screen-sm-down {
                flex: 0 0 24px !important;
                height: 1.5em;
+               opacity: 0;
                position: relative;
+               transition: opacity .12s linear, visibility 0s linear .12s;
+               visibility: hidden;
                
                &::before {
                        content: $fa-var-ellipsis-v;
@@ -396,6 +399,12 @@
                        width: 24px;
                }
                
+               &.active {
+                       opacity: 1;
+                       transition-delay: 0s;
+                       visibility: visible;
+               }
+               
                > li {
                        display: none;
                }