Merge pull request #5995 from overleaf/jk-navbar-menu-button

[web] Use real button for Menu button in navbar

GitOrigin-RevId: c1b85c366046774aa638801647cb61eba0de7098

services/web/frontend/js/features/editor-navigation-toolbar/components/menu-button.js

@@ -6,11 +6,16 @@ function MenuButton({ onClick }) {
   const { t } = useTranslation()
 
   return (
-    // eslint-disable-next-line jsx-a11y/anchor-is-valid
+    <div className="toolbar-item">
-    <a role="button" className="btn btn-full-height" href="#" onClick={onClick}>
+      <button className="btn btn-full-height" onClick={onClick}>
-      <Icon type="fw" modifier="bars" classes={{ icon: 'editor-menu-icon' }} />
+        <Icon
-      <p className="toolbar-label">{t('menu')}</p>
+          type="bars "
-    </a>
+          modifier="fw"
+          classes={{ icon: 'editor-menu-icon' }}
+        />
+        <p className="toolbar-label">{t('menu')}</p>
+      </button>
+    </div>
   )
 }
 

services/web/frontend/stylesheets/app/editor/toolbar.less

@@ -20,7 +20,8 @@
     }
   }
 
-  .toolbar-right {
+  .toolbar-right,
+  .toolbar-left {
     button {
       background: transparent;
       box-shadow: none;