From a36ac17fc6148d7fce5bbedb16d8e821772e3dc5 Mon Sep 17 00:00:00 2001
From: giraldiego <40965898+giraldiego@users.noreply.github.com>
Date: Sun, 11 Apr 2021 11:00:01 -0500
Subject: [PATCH] Fix email layout menu link (#848)

---
 site/static/layouts/email/index.html | 52 +++++++++++++++++++++++++++-
 1 file changed, 51 insertions(+), 1 deletion(-)

diff --git a/site/static/layouts/email/index.html b/site/static/layouts/email/index.html
index fcaadf9..8f0118a 100644
--- a/site/static/layouts/email/index.html
+++ b/site/static/layouts/email/index.html
@@ -12,7 +12,7 @@
 
 <div id="layout" class="content pure-g">
     <div id="nav" class="pure-u">
-        <a href="#" class="nav-menu-button">Menu</a>
+        <a href="#" id="menuLink" class="nav-menu-button">Menu</a>
 
         <div class="nav-inner">
             <button class="primary-button pure-button">Compose</button>
@@ -171,6 +171,56 @@
         </div>
     </div>
 </div>
+<!-- Script to make the Menu link work -->
+<!-- Just stripped down version of the js/ui.js script for the side-menu layout -->
+<script>
+    function getElements() {
+        return {
+            menu: document.getElementById('nav'),
+            menuLink: document.getElementById('menuLink')
+        };
+    }
 
+    function toggleClass(element, className) {
+        var classes = element.className.split(/\s+/);
+        var length = classes.length;
+        var i = 0;
+
+        for (; i < length; i++) {
+            if (classes[i] === className) {
+                classes.splice(i, 1);
+                break;
+            }
+        }
+        // The className is not found
+        if (length === classes.length) {
+            classes.push(className);
+        }
+
+        element.className = classes.join(' ');
+    }
+
+    function toggleMenu() {
+        var active = 'active';
+        var elements = getElements();
+
+        toggleClass(elements.menu, active);
+    }
+
+    function handleEvent(e) {
+        var elements = getElements();
+
+        if (e.target.id === elements.menuLink.id) {
+            toggleMenu();
+            e.preventDefault();
+        } else if (elements.menu.className.indexOf('active') !== -1) {
+            toggleMenu();
+        }
+    }
+
+    document.addEventListener('DOMContentLoaded', function () {
+        document.addEventListener('click', handleEvent);
+    });
+</script>
 </body>
 </html>