From 3b6c8db2e0a29b0e79bde84783a263268f3fba77 Mon Sep 17 00:00:00 2001 From: JekkiNoopy Date: Sat, 16 May 2026 20:50:36 +0800 Subject: [PATCH] =?UTF-8?q?fix=20=E6=BC=A2=E5=A0=A1=E4=B8=BB=E9=A0=85?= =?UTF-8?q?=E9=BB=9E=E6=93=8A=E5=B1=95=E9=96=8B?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- assets/css/style.css | 84 +++++++++++++++++++++++++++++------------ assets/js/portal-nav.js | 16 ++++++++ 2 files changed, 76 insertions(+), 24 deletions(-) diff --git a/assets/css/style.css b/assets/css/style.css index ad8dddc..b2c43a2 100644 --- a/assets/css/style.css +++ b/assets/css/style.css @@ -317,11 +317,6 @@ nav a { box-sizing: border-box; } -.portal-nav .portal-nav__subgroup:hover>.portal-submenu-nested, -.portal-nav .portal-nav__subgroup:focus-within>.portal-submenu-nested { - display: flex; -} - .portal-nav .portal-submenu-nested li { padding-bottom: 0; list-style: none; @@ -393,15 +388,20 @@ nav a { box-sizing: border-box; } -.portal-nav .portal-nav__subgroup--nested:hover>.portal-submenu-nested--tier3, -.portal-nav .portal-nav__subgroup--nested:focus-within>.portal-submenu-nested--tier3, -.portal-nav .portal-submenu-nested--tier3:hover, -.portal-nav .portal-submenu-nested--tier3:focus-within { - display: flex; -} - @media (min-width: 992px) { + .portal-nav .portal-nav__subgroup:hover>.portal-submenu-nested, + .portal-nav .portal-nav__subgroup:focus-within>.portal-submenu-nested { + display: flex; + } + + .portal-nav .portal-nav__subgroup--nested:hover>.portal-submenu-nested--tier3, + .portal-nav .portal-nav__subgroup--nested:focus-within>.portal-submenu-nested--tier3, + .portal-nav .portal-submenu-nested--tier3:hover, + .portal-nav .portal-submenu-nested--tier3:focus-within { + display: flex; + } + .portal-nav .portal-nav__subgroup>.portal-submenu-nested { position: absolute !important; left: 100% !important; @@ -477,9 +477,7 @@ nav a { clamp(14px, 2vw + 10px, 32px) max(1rem, env(safe-area-inset-bottom, 0px)); z-index: 10000; - overflow-x: hidden; - overflow-y: auto; - -webkit-overflow-scrolling: touch; + overflow: hidden; background-color: var(--black); grid-template-columns: 1fr; grid-template-rows: auto auto minmax(0, 1fr); @@ -493,6 +491,14 @@ nav a { box-sizing: border-box; } + .portal-nav.portal-nav--open .logo, + .portal-nav.portal-nav--open .portal-nav__menu-toggle { + position: relative; + z-index: 2; + flex-shrink: 0; + background-color: var(--black); + } + .portal-nav .logo { grid-area: logo; justify-self: start; @@ -602,10 +608,18 @@ nav a { flex-direction: column; align-items: center; gap: 2px; + order: 1; + } + + .portal-nav>ul>li.open>a { + order: 0; } .portal-nav .portal-submenu { position: static; + top: auto; + left: auto; + right: auto; width: min(100%, 20rem); min-width: 0; margin: 4px auto 0; @@ -707,6 +721,18 @@ nav a { flex-direction: column; align-items: center; } + + .portal-nav .portal-submenu, + .portal-nav .portal-submenu-nested { + list-style: none; + margin-left: 0; + padding-left: 0; + } + + .portal-nav .portal-submenu>li, + .portal-nav .portal-submenu-nested>li { + list-style: none; + } } .portal-nav .portal-submenu>li+li>a[data-coming-soon="true"] { @@ -818,11 +844,14 @@ a.btn[data-coming-soon="true"], display: none !important; } -.portal-nav>ul>li:hover>.portal-submenu, -.portal-nav>ul>li:focus-within>.portal-submenu, -.portal-nav>ul>li.open>.portal-submenu { - display: grid; - gap: 6px; +@media (min-width: 992px) { + + .portal-nav>ul>li:hover>.portal-submenu, + .portal-nav>ul>li:focus-within>.portal-submenu, + .portal-nav>ul>li.open>.portal-submenu { + display: grid; + gap: 6px; + } } #particles { @@ -1778,9 +1807,12 @@ footer a .mark_b { overflow: visible; } -.map-page .portal-nav>ul>li:hover .portal-submenu, -.map-page .portal-nav>ul>li:focus-within .portal-submenu { - display: grid; +@media (min-width: 992px) { + + .map-page .portal-nav>ul>li:hover .portal-submenu, + .map-page .portal-nav>ul>li:focus-within .portal-submenu { + display: grid; + } } .map-page .portal-nav .portal-submenu a { @@ -2294,12 +2326,16 @@ header.map-archive-header { position: static; min-width: 0; margin-top: 6px; - display: grid; + display: none; box-shadow: none; background: #fffaf0; padding: 8px; } + .map-page .portal-nav>ul>li.open .portal-submenu { + display: grid; + } + #itinerary-search { width: calc(100% - 28px); } diff --git a/assets/js/portal-nav.js b/assets/js/portal-nav.js index 1e76e6b..501a147 100644 --- a/assets/js/portal-nav.js +++ b/assets/js/portal-nav.js @@ -345,6 +345,7 @@ const subgroupHead = event.target.closest(".portal-nav__subgroup-head"); if (subgroupHead) { event.preventDefault(); + event.stopPropagation(); const subgroup = subgroupHead.closest(".portal-nav__subgroup"); if (subgroup) subgroup.classList.toggle("open"); return; @@ -352,6 +353,17 @@ const link = event.target.closest("a[href]"); if (!link || link.classList.contains("logo")) return; + + const topItem = link.closest(".portal-nav > ul > li"); + const isTopTrigger = + topItem && + link === topItem.querySelector(":scope > a") && + topItem.querySelector(":scope > .portal-submenu"); + + if (isTopTrigger) { + return; + } + if (link.getAttribute("data-coming-soon") === "true") return; const href = link.getAttribute("href"); if (href && href !== "#") setPortalNavMenuOpen(nav, false); @@ -437,7 +449,11 @@ if (!isPortalNavDesktop()) { event.preventDefault(); + event.stopPropagation(); if (!isSoon && !item.classList.contains("coming-soon")) { + items.forEach((other) => { + if (other !== item) other.classList.remove("open"); + }); item.classList.toggle("open"); } return;