diff options
Diffstat (limited to 'vnext')
-rw-r--r-- | vnext/src/App.js | 18 | ||||
-rw-r--r-- | vnext/src/index.css | 6 |
2 files changed, 12 insertions, 12 deletions
diff --git a/vnext/src/App.js b/vnext/src/App.js index 011e5cbd..4c1e72d1 100644 --- a/vnext/src/App.js +++ b/vnext/src/App.js @@ -22,7 +22,7 @@ import { me } from './api'; const elClassHidden = 'header--hidden'; -const elClassFull = 'content--full'; +const elClassTop = 'content--top'; export default function App() { @@ -57,7 +57,7 @@ export default function App() { const [scrollState, setScrollState] = useRafState({ hidden: false, - bottom: false, + top: false, prevScroll: 0 }); @@ -69,30 +69,30 @@ export default function App() { setScrollState((scrollState) => { let wScrollDiff = scrollState.prevScroll - y; let hidden = scrollState.hidden; - let bottom = scrollState.bottom; + let top = scrollState.top; if (y <= 0) { // scrolled to the very top; element sticks to the top hidden = false; - bottom = false; + top = true; } else if ((wScrollDiff > 0) && hidden) { // scrolled up; element slides in hidden = false; - bottom = false; + top = false; } else if (wScrollDiff < 0) { // scrolled down if ((y + wHeight) >= dHeight && hidden) { // scrolled to the very bottom; element slides in hidden = false; - bottom = true; + top = false; } else { // scrolled down; element slides out hidden = true; - bottom = false; + top = false; } } return { hidden: hidden, - bottom: bottom, + top: top, prevScroll: y }; }); @@ -161,7 +161,7 @@ export default function App() { <> <Header visitor={visitor} className={scrollState.hidden ? elClassHidden : ''} /> <div id="wrapper"> - <section id="content" ref={contentRef} className={scrollState.hidden || scrollState.bottom ? elClassFull : ''}> + <section id="content" ref={contentRef} className={scrollState.top ? elClassTop : ''}> <Switch> <Route exact path="/" render={(props) => <Discussions visitor={visitor} {...props} />} /> <Route exact path="/home" render={(props) => <Home visitor={visitor} {...props} />} /> diff --git a/vnext/src/index.css b/vnext/src/index.css index 3cc41b8b..6ca33a13 100644 --- a/vnext/src/index.css +++ b/vnext/src/index.css @@ -163,13 +163,13 @@ hr { #content { grid-area: content; - margin-top: 64px; + margin-top: 0; overflow: auto; transition: margin-top 0.4s; } -.content--full { - margin-top: 0 !important; +.content--top { + margin-top: 64px !important; } #footer { |