diff --git a/src/contents/education.tsx b/src/contents/education.tsx index 929201711da523995a2f6ddf571c86f82fd78e6e..ed18f814734c1325d42e2f783bcc5ed5d5e7f64b 100644 --- a/src/contents/education.tsx +++ b/src/contents/education.tsx @@ -2,37 +2,46 @@ import { ButtonOne} from "../components/Buttons"; import { useEffect } from "react"; import { useLocation } from "react-router-dom"; -import { openFromOtherPage } from "../components/Buttons"; import { useNavigation } from "../utils/useNavigation"; export function Education() { const { goToPagesAndOpenTab/* , goToTextsAndOpenCollapsible */ } = useNavigation(); const location = useLocation(); - useEffect(() => { - const params = new URLSearchParams(location.search); - const collapseId = params.get('collapseId'); - const tabId = params.get('tab'); + useEffect(() => { + const params = new URLSearchParams(location.search); + const collapseId = params.get('collapseId'); + const tabId = params.get('tab'); - // Scroll to the section specified by collapseId - if (collapseId) { - const collapseElement = document.getElementById(collapseId); - if (collapseElement) { - const elementTop = collapseElement.getBoundingClientRect().top + window.pageYOffset; - const offset = window.innerHeight / 2 - collapseElement.offsetHeight / 2; - const scrollPosition = elementTop - offset; + // Open the tab specified by tabId + if (tabId) { + // Hide all tabs + const tabs = document.querySelectorAll('.cycletab'); + tabs.forEach((tab) => { + (tab as HTMLElement).style.display = 'none'; + }); - window.scrollTo({ - top: scrollPosition, - behavior: 'smooth', - }); - } + // Show the selected tab + const selectedTab = document.getElementById(tabId); + if (selectedTab) { + selectedTab.style.display = 'block'; } + } - // Open the tab specified by tabId - if (tabId) { - openFromOtherPage(tabId)({ currentTarget: document.getElementById(tabId)! }); + // Scroll to the section specified by collapseId after opening the tab + if (collapseId) { + const collapseElement = document.getElementById(collapseId); + if (collapseElement) { + const elementTop = collapseElement.getBoundingClientRect().top + window.pageYOffset; + const offset = window.innerHeight / 2 - collapseElement.offsetHeight / 2; + const scrollPosition = elementTop - offset; + + window.scrollTo({ + top: scrollPosition, + behavior: 'smooth', + }); } - }, [location.search]); + } +}, [location.search]); return ( <> diff --git a/src/contents/engineering.tsx b/src/contents/engineering.tsx index 6d109446321585371b2aad4441e8c39bdbb8eb58..ba899b3b0ae872c8accce19d0c389f0960028828 100644 --- a/src/contents/engineering.tsx +++ b/src/contents/engineering.tsx @@ -8,31 +8,41 @@ import { openFromOtherPage } from "../components/Buttons"; export function Engineering() { const location = useLocation(); - useEffect(() => { - const params = new URLSearchParams(location.search); - const collapseId = params.get('collapseId'); - const tabId = params.get('tab'); + useEffect(() => { + const params = new URLSearchParams(location.search); + const collapseId = params.get('collapseId'); + const tabId = params.get('tab'); - // Scroll to the section specified by collapseId - if (collapseId) { - const collapseElement = document.getElementById(collapseId); - if (collapseElement) { - const elementTop = collapseElement.getBoundingClientRect().top + window.pageYOffset; - const offset = window.innerHeight / 2 - collapseElement.offsetHeight / 2; - const scrollPosition = elementTop - offset; + // Open the tab specified by tabId + if (tabId) { + // Hide all tabs + const tabs = document.querySelectorAll('.enginneeringtab'); + tabs.forEach((tab) => { + (tab as HTMLElement).style.display = 'none'; + }); - window.scrollTo({ - top: scrollPosition, - behavior: 'smooth', - }); - } - } + // Show the selected tab + const selectedTab = document.getElementById(tabId); + if (selectedTab) { + selectedTab.style.display = 'block'; + } + } - // Open the tab specified by tabId - if (tabId) { - openFromOtherPage(tabId)({ currentTarget: document.getElementById(tabId)! }); - } - }, [location.search]); + // Scroll to the section specified by collapseId after opening the tab + if (collapseId) { + const collapseElement = document.getElementById(collapseId); + if (collapseElement) { + const elementTop = collapseElement.getBoundingClientRect().top + window.pageYOffset; + const offset = window.innerHeight / 2 - collapseElement.offsetHeight / 2; + const scrollPosition = elementTop - offset; + + window.scrollTo({ + top: scrollPosition, + behavior: 'smooth', + }); + } + } + }, [location.search]); return ( <>