🐛 Restore mobile menu transitions #19025

Author: 88250

app/src/assets/scss/main/_mobile.scss

@@ -1137,8 +1137,7 @@ body.mobile-topbar--merged {
 #menu {
   z-index: 7;
   top: 0;
-  transform: none;
-  transition: none;
+  transform: translateX(100vw);
 
   .mobile-main-menu {
     &__search {

app/src/assets/template/mobile/index.tpl

@@ -53,7 +53,7 @@
         <div class="fn__flex-column fn__none" data-type="sidebar-agent"></div>
     </div>
 </div>
-<div id="menu" class="b3-menu b3-menu--fullscreen fn__none"></div>
+<div id="menu" class="b3-menu b3-menu--fullscreen"></div>
 <div id="model" class="side-panel side-panel--all fn__flex-column">
     <div class="toolbar toolbar--border">
         <svg class="toolbar__icon"><use xlink:href="#iconMenu"></use></svg>

app/src/mobile/menu/index.ts

@@ -339,7 +339,7 @@ export const popMenu = () => {
     closePanel();
     const menuElement = document.getElementById("menu");
     menuElement.style.zIndex = (++window.siyuan.zIndex).toString();
-    menuElement.classList.remove("fn__none");
+    menuElement.style.transform = "translateX(0px)";
 };
 
 export const initRightMenu = (app: App) => {

app/src/mobile/util/MobileBackFoward.ts

@@ -47,7 +47,7 @@ export const goBack = () => {
             searchAssetsPanelElement.classList.add("fn__none");
         }
         return;
-    } else if ((menuElement && !menuElement.classList.contains("fn__none")) ||
+    } else if (menuElement?.style.transform === "translateX(0px)" ||
         document.getElementById("sidebar")?.style.transform === "translateX(0px)" ||
         document.getElementById("sidebarRight")?.style.transform === "translateX(0px)") {
         closePanel();

app/src/mobile/util/closePanel.ts

@@ -19,7 +19,6 @@ export const closePanel = () => {
     const menuElement = document.getElementById("menu");
     if (menuElement) {
         menuElement.dispatchEvent(new CustomEvent(MOBILE_MENU_CLOSE_EVENT));
-        menuElement.classList.add("fn__none");
         menuElement.style.removeProperty("transform");
         menuElement.style.removeProperty("z-index");
     }