Make burger always visible as long as oc is visible
continuous-integration/drone/push Build is passing
Details
continuous-integration/drone/push Build is passing
Details
This commit is contained in:
parent
922b152dd9
commit
91d841728b
|
@ -49,8 +49,8 @@ export function OrganizedContent({
|
|||
const section = sections[currentIndex];
|
||||
const isReadAll = section.id === READ_ALL_ID;
|
||||
const ref = useRef<HTMLDivElement>(null);
|
||||
const isVisible = useOnScreen(ref.current);
|
||||
const burgerVisible = useBurger(isVisible);
|
||||
const burgerVisible = useOnScreen(ref.current);
|
||||
// const burgerVisible = useBurger(isVisible);
|
||||
|
||||
useEffect(() => {
|
||||
mobileNavOpen
|
||||
|
@ -332,32 +332,32 @@ function useOnScreen(element: HTMLDivElement | null) {
|
|||
return isIntersecting;
|
||||
}
|
||||
|
||||
function useBurger(componentIsVisible: boolean): boolean {
|
||||
const [prevScrollPos, setPrevScrollPos] = useState(0);
|
||||
const [burgerVisible, setBurgerVisible] = useState(true);
|
||||
// function useBurger(componentIsVisible: boolean): boolean {
|
||||
// const [prevScrollPos, setPrevScrollPos] = useState(0);
|
||||
// const [burgerVisible, setBurgerVisible] = useState(true);
|
||||
|
||||
const handleScroll = useDebounce(() => {
|
||||
// find current scroll position
|
||||
const currentScrollPos = window.pageYOffset;
|
||||
setBurgerVisible(
|
||||
componentIsVisible &&
|
||||
((prevScrollPos > currentScrollPos &&
|
||||
prevScrollPos - currentScrollPos > 70) ||
|
||||
currentScrollPos < 10)
|
||||
);
|
||||
// const handleScroll = useDebounce(() => {
|
||||
// // find current scroll position
|
||||
// const currentScrollPos = window.pageYOffset;
|
||||
// setBurgerVisible(
|
||||
// componentIsVisible &&
|
||||
// ((prevScrollPos > currentScrollPos &&
|
||||
// prevScrollPos - currentScrollPos > 70) ||
|
||||
// currentScrollPos < 10)
|
||||
// );
|
||||
|
||||
// set state to new scroll position
|
||||
setPrevScrollPos(currentScrollPos);
|
||||
});
|
||||
// // set state to new scroll position
|
||||
// setPrevScrollPos(currentScrollPos);
|
||||
// });
|
||||
|
||||
useEffect(() => {
|
||||
window.addEventListener("scroll", handleScroll);
|
||||
// useEffect(() => {
|
||||
// window.addEventListener("scroll", handleScroll);
|
||||
|
||||
return () => window.removeEventListener("scroll", handleScroll);
|
||||
}, [handleScroll]);
|
||||
// return () => window.removeEventListener("scroll", handleScroll);
|
||||
// }, [handleScroll]);
|
||||
|
||||
return burgerVisible;
|
||||
}
|
||||
// return burgerVisible;
|
||||
// }
|
||||
|
||||
// Inlining this svg because we want to fill in colors using css variables
|
||||
function Burger() {
|
||||
|
|
Loading…
Reference in New Issue