Changed the menu click point to the arrow

This commit is contained in:
Dustin Wilson 2019-08-13 21:56:57 -05:00 committed by Stéphane Goetz
parent 3f130712b4
commit 5bc71cc7f6
10 changed files with 12 additions and 16 deletions

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -107,15 +107,16 @@ if (hljs) {
}; };
}; };
var navItems = document.querySelectorAll('.Nav__item.has-children > a'); var navItems = document.querySelectorAll('.Nav__item.has-children i.Nav__arrow');
function _toggleSubMenu(ev) { function _toggleSubMenu(ev) {
if (ev.preventDefault !== undefined) { if (ev.preventDefault !== undefined) {
ev.preventDefault(); ev.preventDefault();
} }
var parent = ev.target.parentNode; var parent = ev.target.parentNode.parentNode;
var subNav = parent.querySelector('ul.Nav'); var subNav = parent.querySelector('ul.Nav');
console.log(parent);
if (ev.preventDefault !== undefined && parent.classList.contains('Nav__item--open')) { if (ev.preventDefault !== undefined && parent.classList.contains('Nav__item--open')) {
subNav.style.height = 0; subNav.style.height = 0;
@ -156,7 +157,7 @@ if (hljs) {
cur = navItems[i]; cur = navItems[i];
cur.addEventListener('click', _toggleSubMenu); cur.addEventListener('click', _toggleSubMenu);
if (cur.parentNode.classList.contains('Nav__item--open')) { if (cur.parentNode.parentNode.classList.contains('Nav__item--open')) {
_toggleSubMenu({ target: cur }); _toggleSubMenu({ target: cur });
} }
} }

View File

@ -159,11 +159,6 @@ Components
width: 16px; width: 16px;
margin-left: -16px; margin-left: -16px;
// Prevent arrow from being the target in its container's event listener.
&, &::before {
pointer-events: none;
}
&:before { &:before {
position: absolute; position: absolute;
display: block; display: block;