diff --git a/assets/js/nav-menu.js b/assets/js/nav-menu.js new file mode 100644 index 0000000..132653d --- /dev/null +++ b/assets/js/nav-menu.js @@ -0,0 +1,61 @@ +(function () { + const dropdownToggles = document.querySelectorAll(".hextra-nav-menu-toggle"); + + dropdownToggles.forEach((toggle) => { + toggle.addEventListener("click", (e) => { + e.preventDefault(); + e.stopPropagation(); + + // Close all other dropdowns first + dropdownToggles.forEach((otherToggle) => { + if (otherToggle !== toggle) { + otherToggle.dataset.state = "closed"; + const otherMenuItems = otherToggle.nextElementSibling; + otherMenuItems.classList.add("hx:hidden"); + } + }); + + // Toggle current dropdown + const isOpen = toggle.dataset.state === "open"; + toggle.dataset.state = isOpen ? "closed" : "open"; + const menuItemsElement = toggle.nextElementSibling; + + if (!isOpen) { + // Position dropdown centered with toggle + menuItemsElement.style.position = "absolute"; + menuItemsElement.style.top = "100%"; + menuItemsElement.style.left = "50%"; + menuItemsElement.style.transform = "translateX(-50%)"; + menuItemsElement.style.zIndex = "1000"; + + // Show dropdown + menuItemsElement.classList.remove("hx:hidden"); + } else { + // Hide dropdown + menuItemsElement.classList.add("hx:hidden"); + } + }); + }); + + // Dismiss dropdown when clicking outside + document.addEventListener("click", (e) => { + if (e.target.closest(".hextra-nav-menu-toggle") === null) { + dropdownToggles.forEach((toggle) => { + toggle.dataset.state = "closed"; + const menuItemsElement = toggle.nextElementSibling; + menuItemsElement.classList.add("hx:hidden"); + }); + } + }); + + // Close dropdowns on escape key + document.addEventListener("keydown", (e) => { + if (e.key === "Escape") { + dropdownToggles.forEach((toggle) => { + toggle.dataset.state = "closed"; + const menuItemsElement = toggle.nextElementSibling; + menuItemsElement.classList.add("hx:hidden"); + }); + } + }); +})(); diff --git a/exampleSite/hugo.yaml b/exampleSite/hugo.yaml index d2a2b58..1ccc87a 100644 --- a/exampleSite/hugo.yaml +++ b/exampleSite/hugo.yaml @@ -58,7 +58,7 @@ markup: extensions: passthrough: delimiters: - block: [['\[', '\]'], ['$$', '$$']] + block: [['\[', '\]'], ["$$", "$$"]] inline: [['\(', '\)']] enable: true @@ -70,9 +70,8 @@ menu: name: Documentation pageRef: /docs weight: 1 - - identifier: showcase - name: Showcase - pageRef: /showcase + - identifier: versions + name: Versions weight: 2 - identifier: blog name: Blog @@ -82,15 +81,27 @@ menu: name: About pageRef: /about weight: 4 - - name: Search + - identifier: showcase + name: Showcase + pageRef: /showcase weight: 5 + - name: Search + weight: 6 params: type: search - name: GitHub - weight: 6 + weight: 7 url: "https://github.com/imfing/hextra" params: icon: github + - identifier: development + name: Development ↗ + url: https://imfing.github.io/hextra/versions/latest/ + parent: versions + - identifier: v0.9 + name: v0.9 ↗ + url: https://imfing.github.io/hextra/versions/v0.9/ + parent: versions sidebar: - identifier: more @@ -163,7 +174,7 @@ params: # date | lastmod | publishDate | title | weight sortBy: date sortOrder: desc # or "asc" - + article: displayPagination: true diff --git a/exampleSite/hugo_stats.json b/exampleSite/hugo_stats.json index 01e9e2d..438d2cf 100644 --- a/exampleSite/hugo_stats.json +++ b/exampleSite/hugo_stats.json @@ -121,6 +121,9 @@ "hextra-max-footer-width", "hextra-max-navbar-width", "hextra-max-page-width", + "hextra-nav-menu-item", + "hextra-nav-menu-items", + "hextra-nav-menu-toggle", "hextra-pdf", "hextra-scrollbar", "hextra-sidebar-collapsible-button", @@ -311,6 +314,7 @@ "hx:duration-200", "hx:duration-75", "hx:ease-in", + "hx:ease-in-out", "hx:first:mt-0", "hx:flex", "hx:flex-col", diff --git a/exampleSite/i18n/fa.yaml b/exampleSite/i18n/fa.yaml index 595eac5..33e5510 100644 --- a/exampleSite/i18n/fa.yaml +++ b/exampleSite/i18n/fa.yaml @@ -4,3 +4,5 @@ blog: "وبلاگ" about: "درباره ما" more: "بیشتر" hugoDocs: "مستندات هیوگو ↖" +versions: "نسخه‌ها" +development: "آخرین نسخه توسعه‌ای" diff --git a/exampleSite/i18n/ja.yaml b/exampleSite/i18n/ja.yaml index f5e35d8..8ecfd6a 100644 --- a/exampleSite/i18n/ja.yaml +++ b/exampleSite/i18n/ja.yaml @@ -3,4 +3,6 @@ showcase: "展示" blog: "ブログ" about: "概要" more: "もっと見る" -hugoDocs: "Hugo ドキュメント ↗" \ No newline at end of file +hugoDocs: "Hugo ドキュメント ↗" +versions: "バージョン" +development: "最新の開発版" diff --git a/exampleSite/i18n/zh-cn.yaml b/exampleSite/i18n/zh-cn.yaml index fac8411..9931280 100644 --- a/exampleSite/i18n/zh-cn.yaml +++ b/exampleSite/i18n/zh-cn.yaml @@ -4,3 +4,5 @@ blog: "博客" about: "关于" more: "更多" hugoDocs: "Hugo 文档 ↗" +versions: "版本" +development: "最新开发版本" diff --git a/layouts/_partials/navbar.html b/layouts/_partials/navbar.html index 6f22e97..f19c49a 100644 --- a/layouts/_partials/navbar.html +++ b/layouts/_partials/navbar.html @@ -13,8 +13,11 @@ {{ end -}} {{- end -}} +
-
+