Fix ChatRoom message input height and autoresize

Author: joepio

data-browser/src/views/ChatRoomPage.tsx

@@ -21,6 +21,7 @@ import { CommitDetail } from '../components/CommitDetail';
 import Markdown from '../components/datatypes/Markdown';
 import { Detail } from '../components/Detail';
 import { EditableTitle } from '../components/EditableTitle';
+import { NavBarSpacer } from '../components/NavBarSpacer';
 import { editURL } from '../helpers/navigation';
 import { ResourceInline } from './ResourceInline';
 import { ResourcePageProps } from './ResourcePage';
@@ -136,7 +137,7 @@ export function ChatRoomPage({ resource }: ResourcePageProps) {
     // in Firefox, scrollHeight only works if overflow is set to scroll
     const height = e.target.scrollHeight;
     e.target.style.overflow = overflowStyle;
-    const rowHeight = 25;
+    const rowHeight = 30;
     const trows = Math.ceil(height / rowHeight) - 1;
 
     if (trows !== textAreaHight) {
@@ -180,6 +181,7 @@ export function ChatRoomPage({ resource }: ResourcePageProps) {
           Send
         </SendButton>
       </MessageForm>
+      <NavBarSpacer baseMargin='2rem' position='bottom' />
     </FullPageWrapper>
   );
 }