diff --git a/app/soapbox/features/ui/index.js b/app/soapbox/features/ui/index.js
index 266d6f4e2..8c6cbcc22 100644
--- a/app/soapbox/features/ui/index.js
+++ b/app/soapbox/features/ui/index.js
@@ -292,6 +292,7 @@ class UI extends React.PureComponent {
 
   state = {
     draggingOver: false,
+    mobile: isMobile(window.innerWidth),
   };
 
   handleBeforeUnload = (e) => {
@@ -400,10 +401,17 @@ class UI extends React.PureComponent {
     }
   }
 
+  handleResize = debounce(() => {
+    this.setState({ mobile: isMobile(window.innerWidth) });
+  }, 500, {
+    trailing: true,
+  });
+
   componentDidMount() {
     const { account } = this.props;
     if (!account) return;
     window.addEventListener('beforeunload', this.handleBeforeUnload, false);
+    window.addEventListener('resize', this.handleResize, { passive: true });
 
     document.addEventListener('dragenter', this.handleDragEnter, false);
     document.addEventListener('dragover', this.handleDragOver, false);
@@ -437,6 +445,7 @@ class UI extends React.PureComponent {
 
   componentWillUnmount() {
     window.removeEventListener('beforeunload', this.handleBeforeUnload);
+    window.removeEventListener('resize', this.handleResize);
     document.removeEventListener('dragenter', this.handleDragEnter);
     document.removeEventListener('dragover', this.handleDragOver);
     document.removeEventListener('drop', this.handleDrop);
@@ -565,7 +574,7 @@ class UI extends React.PureComponent {
 
   render() {
     const { streamingUrl } = this.props;
-    const { draggingOver } = this.state;
+    const { draggingOver, mobile } = this.state;
     const { intl, children, isComposing, location, dropdownMenuIsOpen, me } = this.props;
 
     if (me === null || !streamingUrl) return null;
@@ -605,7 +614,7 @@ class UI extends React.PureComponent {
           <ModalContainer />
           <UploadArea active={draggingOver} onClose={this.closeUploadModal} />
           {me && <SidebarMenu />}
-          {me && <ChatPanes />}
+          {me && !mobile && <ChatPanes />}
         </div>
       </HotKeys>
     );
diff --git a/app/styles/ui.scss b/app/styles/ui.scss
index a0ad254bf..a8f09663a 100644
--- a/app/styles/ui.scss
+++ b/app/styles/ui.scss
@@ -369,7 +369,7 @@
   justify-content: center;
   transition: 0.2s;
 
-  @media screen and (max-width: 895px) {
+  @media screen and (max-width: 630px) {
     display: flex;
   }