Weishen/Hydro
2
0 Fork 0
mirror of https://gitcode.com/gh_mirrors/hy/Hydro.git synced 2026-10-17 09:36:08 +08:00
Code Issues Packages Projects Releases Wiki Activity

ui: fix nav resize (#359)

Browse Source
This commit is contained in:
无限UCW authored and GitHub committed 2022-05-21 00:22:17 +08:00
1 parent 8582de2560
commit c556c542a5
1 file changed
+26 -23
Download Patch File Download Diff File Expand all files Collapse all files
packages/ui-default/components/navigation/navigation.page.js
+26 -23
View File
@@ -58,19 +58,22 @@ function handlerSwitchAccount(ev) {
ev.preventDefault();
}
let trigger;
let menu;
let $trigger;
let $menu;
function handleNavbar() {
let fromHide = false;
if ($(document).width() <= 600) {
for (const ele of menu.children()) {
ele.insertBefore(trigger, null);
}
trigger.hide();
$menu.children().each(function () {
const $ele = $(this);
$ele.addClass('nav__list-item').removeClass('menu__item');
$ele.children('a').addClass('nav__item').removeClass('menu__link');
$ele.insertBefore($trigger, null);
});
$trigger.hide();
return;
}
trigger.show();
$trigger.show();
const base = 70;
@@ -80,18 +83,18 @@ function handleNavbar() {
if (!$(navItems[navItem]).children('a').hasClass('nav--active')) {
$(navItems[navItem]).removeClass('nav__list-item').addClass('menu__item');
$(navItems[navItem]).children('a').removeClass('nav__item').addClass('menu__link');
$(menu).prepend($(navItems[navItem]));
$menu.prepend($(navItems[navItem]));
}
navItem--;
fromHide = true;
}
if (!fromHide && menu.children().length) {
while ($('#menu').children('div').height() <= base && menu.children().length) {
const ele = menu.children(0);
$(ele).addClass('nav__list-item').removeClass('menu__item');
$(ele).children('a').addClass('nav__item').removeClass('menu__link');
ele.insertBefore(trigger, null);
if (!fromHide && $menu.children().length) {
while ($('#menu').children('div').height() <= base && $menu.children().length) {
const $ele = $menu.children().first();
$ele.addClass('nav__list-item').removeClass('menu__item');
$ele.children('a').addClass('nav__item').removeClass('menu__link');
$ele.insertBefore($trigger, null);
}
}
@@ -102,14 +105,13 @@ function handleNavbar() {
if (!$(navItems[navItem]).children('a').hasClass('nav--active')) {
$(navItems[navItem]).removeClass('nav__list-item').addClass('menu__item');
$(navItems[navItem]).children('a').removeClass('nav__item').addClass('menu__link');
$(menu).prepend($(navItems[navItem]));
break;
$menu.prepend($(navItems[navItem]));
}
navItem--;
}
}
if (!menu.children().length) trigger.hide();
if (!$menu.children().length) $trigger.hide();
}
const navigationPage = new AutoloadPage('navigationPage', () => {
@@ -130,23 +132,24 @@ const navigationPage = new AutoloadPage('navigationPage', () => {
});
const $slideoutOverlay = $('.slideout-overlay');
$slideoutOverlay.click(() => slideout.close());
$slideoutOverlay.on('click', () => slideout.close());
slideout.on('beforeopen', () => $slideoutOverlay.show());
slideout.on('beforeclose', () => $slideoutOverlay.hide());
$('.header__hamburger').click(() => slideout.toggle());
$('.header__hamburger').on('click', () => slideout.toggle());
$(window).on('resize', handleNavbar);
}, () => {
trigger = $(tpl`
$trigger = $(tpl`
<li class="nav__list-item nav_more" data-dropdown-pos="bottom right" data-dropdown-target="#menu-nav-more">
<a href="javascript:;" class="nav__item">
${i18n('More')} <span class="icon icon-expand_more"></span>
</a>
</li>
`);
menu = $('<ol class="dropdown-target menu menu_more" id="menu-nav-more">');
trigger.append(menu);
$('.nav__list--main').append(trigger);
$menu = $('<ol class="dropdown-target menu menu_more" id="menu-nav-more">');
$trigger.append($menu);
$('.nav__list--main').append($trigger);
handleNavbar();
});