taqi/portfolio
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

frontend: close navigation dropdown when clicked

Browse Source 
close the navigation dropdown if any click is registered anywhere
in the DOM. Previously the dropdown was closed only when clicked
This commit is contained in:
Taqi Tahmid
2025-04-11 11:51:40 +03:00
parent 6944751b82
commit c1abd36482
2 changed files with 16 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
README.md
View File

@ -26,9 +26,9 @@ This website is packaged as a container and deployed using nginx.
```bash ```bash
source .env source .env
docker build -t my-portfolio-app . docker build -t my-portfolio-app .
docker tag my-portfolio-app:latest ${DOCKER_REGISTRY}/my-portfolio-app:latest docker tag my-portfolio-app:latest $DOCKER_REGISTRY/my-portfolio-app:latest
docker push ${DOCKER_REGISTRY}/my-portfolio-app:latest docker push $DOCKER_REGISTRY/my-portfolio-app:latest
# Check the registry # Check the registry
curl -u user:pass https://${DOCKER_REGISTRY}/v2/_catalog curl -u user:pass https://$DOCKER_REGISTRY/v2/_catalog
``` ```

13
frontend/src/components/Navbar.tsx
View File

@ -26,6 +26,19 @@ const Navbar: React.FC<NavProps> = ({ toggleDarkMode, darkMode }) => {
localStorage.setItem('DARK_MODE', String(darkMode)) localStorage.setItem('DARK_MODE', String(darkMode))
}, [darkMode]) }, [darkMode])
useEffect(() => {
const handleClickoutside = (event: MouseEvent) => {
if (menuRef.current && !menuRef.current.contains(event.target as Node)) {
setIsMenuOpen(false)
}
}
document.addEventListener('mousedown', handleClickoutside)
return () => {
document.removeEventListener('mousedown', handleClickoutside)
}
})
const menuItem = [ const menuItem = [
{ title: 'Home', href: '/' }, { title: 'Home', href: '/' },
{ title: 'Experience', href: '/experience' }, { title: 'Experience', href: '/experience' },