use-headroom hook to create headers that are hidden after user scrolls past the given distance in px.
The hook returns a boolean value that determines whether the element should be pinned or hidden.
true when the current scroll position is less than the specified
fixedAt value and
after user scrolled up.
Header is pinned