fix: navbar dropdown not showing on mobile view

This commit is contained in:
Val 2025-02-25 00:23:35 +07:00
parent 69a444f95a
commit a2d63c143d
2 changed files with 12 additions and 28 deletions

View File

@ -1,3 +0,0 @@
export default function CobaPage() {
return <></>;
}

View File

@ -8,15 +8,15 @@ import { useEffect, useRef, useState } from "react";
import Link from "next/link"; import Link from "next/link";
export default function HeaderNav({ links, animateY = false }: any) { export default function HeaderNav({ links, animateY = false }: any) {
const [isDropdownOpen] = useState([""]); const [isDropdownOpen, setIsDropdownOpen] = useState([""]);
const dropdownRef = useRef(null); const dropdownRef = useRef(null);
// const toggleDropdown = (section: string[]) => { const toggleDropdown = (section: string[]) => {
// if (section == isDropdownOpen) { if (section == isDropdownOpen) {
// setIsDropdownOpen([""]); setIsDropdownOpen([""]);
// } }
// setIsDropdownOpen(section); setIsDropdownOpen(section);
// }; };
useEffect(() => { useEffect(() => {
setTimeout(() => { setTimeout(() => {
@ -55,15 +55,8 @@ export default function HeaderNav({ links, animateY = false }: any) {
{Array.isArray(link?.child) && ( {Array.isArray(link?.child) && (
<> <>
<Link <Link href={link?.href ?? "#"} className="mn-has-sub">
href={link?.href ?? "#"} {link.text} <i className="mi-chevron-down" onClick={() => toggleDropdown([link.text])} />
className="mn-has-sub"
// onClick={(e) => {
// e.preventDefault();
// toggleDropdown([link.text]);
// }}
>
{link.text} <i className="mi-chevron-down" />
</Link> </Link>
<ul className={`mn-sub to-right ${isDropdownOpen.includes(link.text) && "open"}`} ref={dropdownRef}> <ul className={`mn-sub to-right ${isDropdownOpen.includes(link.text) && "open"}`} ref={dropdownRef}>
@ -76,15 +69,9 @@ export default function HeaderNav({ links, animateY = false }: any) {
)} )}
{Array.isArray(subLink?.child) && ( {Array.isArray(subLink?.child) && (
<> <>
<Link <Link href={subLink?.href ?? "#"} className="mn-has-sub">
href={subLink?.href ?? "#"} {subLink.text}{" "}
className="mn-has-sub" <i className="mi-chevron-down" onClick={() => toggleDropdown([link.text, subLink.text])} />
// onClick={(e) => {
// e.preventDefault();
// toggleDropdown([link.text, subLink.text]);
// }}
>
{subLink.text} <i className="mi-chevron-down" />
</Link> </Link>
<ul className={`mn-sub to-right ${isDropdownOpen.includes(subLink.text) && "open"}`}> <ul className={`mn-sub to-right ${isDropdownOpen.includes(subLink.text) && "open"}`}>