library-mirrors/pure
1
0
Fork 0
mirror of https://github.com/pure-css/pure.git synced 2024-11-24 10:44:21 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Fix email layout menu link (#848)

Browse Source
This commit is contained in:
giraldiego 2021-04-11 11:00:01 -05:00 committed by GitHub
parent 503265cc51
commit a36ac17fc6
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 51 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

52
site/static/layouts/email/index.html
View File

@ -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>