From 9b42b443425e6d5507bf84e95936732be2e1f69b Mon Sep 17 00:00:00 2001 From: Alexander Ebert <ebert@woltlab.com> Date: Sun, 2 Oct 2016 13:09:20 +0200 Subject: [PATCH] Blind in quick options rather than hiding on runtime Looks far better than having these dots disappear for no reason. --- .../files/js/WoltLabSuite/Core/Ui/Mobile.js | 24 ++++++++----------- wcfsetup/install/files/style/ui/message.scss | 9 +++++++ 2 files changed, 19 insertions(+), 14 deletions(-) diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Mobile.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Mobile.js index 708ef7ce1c..6c5f7c3cb3 100644 --- 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 6b6377cf2a..441bdad11c 100644 --- 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; } -- 2.20.1