diff options
Diffstat (limited to 'vnext/src/App.js')
| -rw-r--r-- | vnext/src/App.js | 25 |
1 files changed, 14 insertions, 11 deletions
diff --git a/vnext/src/App.js b/vnext/src/App.js index 835d3b9f..af364fe2 100644 --- a/vnext/src/App.js +++ b/vnext/src/App.js @@ -91,13 +91,16 @@ export default class App extends React.Component { history.push(location); } toggleSidebar = () => { - let width = this.sidebar.current.style.width; - this.sidebar.current.style.width = width === '248px' ? '0' : '248px'; - let leftMargin = this.state.appMarginLeft === 'inherit' ? '250px' : 'inherit'; - this.setState({ - appMarginLeft: leftMargin - }); - app.style.marginLeft = leftMargin; + const isMobile = window.matchMedia('width < 62.5rem'); + if (isMobile.matches) { + let width = this.sidebar.current.style.width; + this.sidebar.current.style.width = width === '248px' ? '0' : '248px'; + let leftMargin = this.state.appMarginLeft === 'inherit' ? '250px' : 'inherit'; + this.setState({ + appMarginLeft: leftMargin + }); + app.style.marginLeft = leftMargin; + } } render() { const user = this.state.visitor; @@ -171,19 +174,19 @@ export default class App extends React.Component { user.uid > 0 && <aside id="sidebar" ref={this.sidebar}> <Avatar user={user} /> - <Link to="/?show=my"> + <Link to="/?show=my" onClick={this.toggleSidebar}> <Icon name="ei-clock" size="s" /> <span className="desktop">My feed</span> </Link> - <Link to="/pm"> + <Link to="/pm" onClick={this.toggleSidebar}> <Icon name="ei-envelope" size="s" /> <span className="desktop">Messages</span> </Link> - <Link to="/?show=discuss"> + <Link to="/?show=discuss" onClick={this.toggleSidebar}> <Icon name="ei-bell" size="s" /> <span className="desktop">Discussions</span> </Link> - <Link to="/settings" rel="nofollow"> + <Link to="/settings" rel="nofollow" onClick={this.toggleSidebar}> <Icon name="ei-gear" size="s" /> <span className="desktop">Settings</span> </Link> |