From 694cb0518b00a1b8e408520cacc9eedc7403b709 Mon Sep 17 00:00:00 2001 From: MoonbamiOfficial <141120384+MoonbamiOfficial@users.noreply.github.com> Date: Tue, 23 Jan 2024 15:32:22 +0800 Subject: [PATCH] fix: temporary turn off header --- app/layout.tsx | 4 +- components/header/Header.tsx | 398 +++++++++++++++++------------------ 2 files changed, 201 insertions(+), 201 deletions(-) diff --git a/app/layout.tsx b/app/layout.tsx index 48d2cb7..6f68a55 100644 --- a/app/layout.tsx +++ b/app/layout.tsx @@ -2,7 +2,7 @@ import type { Metadata } from 'next'; import Providers from '../providers/providers'; import '@styles/globals.css'; -import Header from '@components/header/Header'; +// import Header from '@components/header/Header'; import Footer from '@components/footer/Footer'; export const metadata: Metadata = { @@ -22,7 +22,7 @@ export default function RootLayout({ -
+ {/*
*/}
{children}
diff --git a/components/header/Header.tsx b/components/header/Header.tsx index 218e626..f2f826e 100644 --- a/components/header/Header.tsx +++ b/components/header/Header.tsx @@ -1,211 +1,211 @@ -'use client' +// 'use client' -import { useState, useEffect, useRef } from "react"; -import Image from "next/image"; -import Link from "next/link"; +// import { useState, useEffect, useRef } from "react"; +// import Image from "next/image"; +// import Link from "next/link"; -// Assets -import Moonbami_Logo from '@public/tsukiwa-logo.png' -import Button from "./Button"; -import SubButton from "./SubButton"; +// // Assets +// import Moonbami_Logo from '@public/tsukiwa-logo.png' +// import Button from "./Button"; +// import SubButton from "./SubButton"; -// Components -import Anchor from "./Anchor"; -import SubAnchor from "./SubAnchor"; -import ThemeSwitchBtn from "@components/ThemeSwitchBtn"; +// // Components +// import Anchor from "./Anchor"; +// import SubAnchor from "./SubAnchor"; +// import ThemeSwitchBtn from "@components/ThemeSwitchBtn"; -// Fontawesome -import { FaBars } from "react-icons/fa"; -import { FaBarsStaggered } from "react-icons/fa6"; -import { FaCaretRight } from "react-icons/fa" -import { FaCaretDown } from "react-icons/fa"; +// // Fontawesome +// import { FaBars } from "react-icons/fa"; +// import { FaBarsStaggered } from "react-icons/fa6"; +// import { FaCaretRight } from "react-icons/fa" +// import { FaCaretDown } from "react-icons/fa"; -const Header = () => { - const [ isMenuActive, setIsMenuActive ] = useState(false) - const [ isHomeDropdownActive, setIsHomeDropdownActive ] = useState(false) - const [ isAnimeDropdownActive, setIsAnimeDropdownActive ] = useState(false) - const [ isGamesDropdownActive, setIsGamesDropdownActive ] = useState(false) - const [ isHobbiesDropdownActive, setIsHobbiesDropdownActive ] = useState(false) - const [ isMusicDropdownActive, seetIsMusicDropdowenActive ] = useState(false) - const [ scrollHeaderBg, setScrollHeaderBg ] = useState("unscrolled-header-bg") - const [ scrollHeader, setScrollHeader ] = useState("unscrolled-header") +// const Header = () => { +// const [ isMenuActive, setIsMenuActive ] = useState(false) +// const [ isHomeDropdownActive, setIsHomeDropdownActive ] = useState(false) +// const [ isAnimeDropdownActive, setIsAnimeDropdownActive ] = useState(false) +// const [ isGamesDropdownActive, setIsGamesDropdownActive ] = useState(false) +// const [ isHobbiesDropdownActive, setIsHobbiesDropdownActive ] = useState(false) +// const [ isMusicDropdownActive, seetIsMusicDropdowenActive ] = useState(false) +// const [ scrollHeaderBg, setScrollHeaderBg ] = useState("unscrolled-header-bg") +// const [ scrollHeader, setScrollHeader ] = useState("unscrolled-header") - const handleScrollHeader = () => { - if(window.scrollY < 100) return setScrollHeader("unscrolled-header") - else if(window.scrollY > 100) return setScrollHeader("scrolled-header") - } - const handleScrollHeaderBg = () => { - if(window.scrollY < 100) return setScrollHeaderBg("unscrolled-header-bg") - else if(window.scrollY > 100) return setScrollHeaderBg("scrolled-header-bg") - } +// const handleScrollHeader = () => { +// if(window.scrollY < 100) return setScrollHeader("unscrolled-header") +// else if(window.scrollY > 100) return setScrollHeader("scrolled-header") +// } +// const handleScrollHeaderBg = () => { +// if(window.scrollY < 100) return setScrollHeaderBg("unscrolled-header-bg") +// else if(window.scrollY > 100) return setScrollHeaderBg("scrolled-header-bg") +// } - const handleScrollIntoView = (scrollInto: string) => { - const section = document.querySelector(scrollInto) - if(section) section.scrollIntoView({ behavior: 'smooth' }) - } +// const handleScrollIntoView = (scrollInto: string) => { +// const section = document.querySelector(scrollInto) +// if(section) section.scrollIntoView({ behavior: 'smooth' }) +// } - const toggleMenu = () => { - setIsMenuActive(!isMenuActive) - } - const toggleHomeDropdown = () => { - setIsHomeDropdownActive(!isHomeDropdownActive) - setIsAnimeDropdownActive(false) - setIsGamesDropdownActive(false) - setIsHobbiesDropdownActive(false) - seetIsMusicDropdowenActive(false) - } - const toggleAnimeDropdown = () => { - setIsHomeDropdownActive(false) - setIsAnimeDropdownActive(!isAnimeDropdownActive) - setIsGamesDropdownActive(false) - setIsHobbiesDropdownActive(false) - seetIsMusicDropdowenActive(false) - } - const toggleGamesDropdown = () => { - setIsHomeDropdownActive(false) - setIsAnimeDropdownActive(false) - setIsGamesDropdownActive(!isGamesDropdownActive) - setIsHobbiesDropdownActive(false) - seetIsMusicDropdowenActive(false) - } - const toggleHobbiesDropdown = () => { - setIsHomeDropdownActive(false) - setIsAnimeDropdownActive(false) - setIsGamesDropdownActive(false) - setIsHobbiesDropdownActive(!isHobbiesDropdownActive) - seetIsMusicDropdowenActive(false) - } - const toggleMusicDropdown = () => { - setIsHomeDropdownActive(false) - setIsAnimeDropdownActive(false) - setIsGamesDropdownActive(false) - setIsHobbiesDropdownActive(false) - seetIsMusicDropdowenActive(!isMusicDropdownActive) - } +// const toggleMenu = () => { +// setIsMenuActive(!isMenuActive) +// } +// const toggleHomeDropdown = () => { +// setIsHomeDropdownActive(!isHomeDropdownActive) +// setIsAnimeDropdownActive(false) +// setIsGamesDropdownActive(false) +// setIsHobbiesDropdownActive(false) +// seetIsMusicDropdowenActive(false) +// } +// const toggleAnimeDropdown = () => { +// setIsHomeDropdownActive(false) +// setIsAnimeDropdownActive(!isAnimeDropdownActive) +// setIsGamesDropdownActive(false) +// setIsHobbiesDropdownActive(false) +// seetIsMusicDropdowenActive(false) +// } +// const toggleGamesDropdown = () => { +// setIsHomeDropdownActive(false) +// setIsAnimeDropdownActive(false) +// setIsGamesDropdownActive(!isGamesDropdownActive) +// setIsHobbiesDropdownActive(false) +// seetIsMusicDropdowenActive(false) +// } +// const toggleHobbiesDropdown = () => { +// setIsHomeDropdownActive(false) +// setIsAnimeDropdownActive(false) +// setIsGamesDropdownActive(false) +// setIsHobbiesDropdownActive(!isHobbiesDropdownActive) +// seetIsMusicDropdowenActive(false) +// } +// const toggleMusicDropdown = () => { +// setIsHomeDropdownActive(false) +// setIsAnimeDropdownActive(false) +// setIsGamesDropdownActive(false) +// setIsHobbiesDropdownActive(false) +// seetIsMusicDropdowenActive(!isMusicDropdownActive) +// } - const dropdown = useRef(null) +// const dropdown = useRef(null) - useEffect(() => { - const handleDropdowns = ({ target }: Event) => { - if(!dropdown.current?.contains(target as Node)) { - setIsMenuActive(false) - setIsHomeDropdownActive(false) - setIsAnimeDropdownActive(false) - setIsGamesDropdownActive(false) - setIsHobbiesDropdownActive(false) - seetIsMusicDropdowenActive(false) - } - } - document.addEventListener('mousedown', handleDropdowns) - document.addEventListener('scroll', handleScrollHeader) - document.addEventListener('scroll', handleScrollHeaderBg) - return () => { - document.removeEventListener('mousedown', handleDropdowns) - document.removeEventListener('scroll', handleScrollHeader) - document.removeEventListener('scroll', handleScrollHeaderBg) - } - }, []); +// useEffect(() => { +// const handleDropdowns = ({ target }: Event) => { +// if(!dropdown.current?.contains(target as Node)) { +// setIsMenuActive(false) +// setIsHomeDropdownActive(false) +// setIsAnimeDropdownActive(false) +// setIsGamesDropdownActive(false) +// setIsHobbiesDropdownActive(false) +// seetIsMusicDropdowenActive(false) +// } +// } +// document.addEventListener('mousedown', handleDropdowns) +// document.addEventListener('scroll', handleScrollHeader) +// document.addEventListener('scroll', handleScrollHeaderBg) +// return () => { +// document.removeEventListener('mousedown', handleDropdowns) +// document.removeEventListener('scroll', handleScrollHeader) +// document.removeEventListener('scroll', handleScrollHeaderBg) +// } +// }, []); - return ( - <> -
-
- - -

Moonbami

- -
- -
- -
-
- -
- {isMenuActive && ( - <> -
- - - )} - - ) -} +// return ( +// <> +//
+//
+// +// +//

Moonbami

+// +//
+// +//
+// +//
+//
+// +//
+// {isMenuActive && ( +// <> +//
+// +// +// )} +// +// ) +// } -export default Header; \ No newline at end of file +// export default Header; \ No newline at end of file