Used dom portal to render hamburger at document body instead of at nav
- why is portal needed? Hamburger is added in navbar.tsx, so the blur-grey backdrop only affects the nav. Hence we move the location of the hamburger using a portal so backdrop affects all components
- why not place hamburger at index.tsx? Our hamburger icon is placed on the navbar, and will follow the navbar around. So, click detection is in navbar.tsx. Our x button is place in hamburger.tsx and thus so is close detection. Our nav handles closing. So we pass props back to nav. But this means we need to redefine every nav with these new props.
Quick exit using Esc or tapping outside of sidemenu
Scroll bar padding offset added
Socials added to bottom of sidemenu

TR-04 added5 commits

removed space above navbar for all pages

f1d02c9

ran prettier formatting, added hamburger sidemenu

ab1506d

transition addded to sidebar menu, had to use dual state approach to …

bef40cb

…fix sliding animation

fixed jittery effect when scroll bar vanishes by adding padding=scrol…

62d7c44

…lbar-width

added socials to bottom of side menu

1ba5196

None yet

Movatterモバイル変換

Navigation Menu