From 6c33e01a644b52f7594ce12a3d572a1fd672ef78 Mon Sep 17 00:00:00 2001
From: Liam Fitzgerald <liam@urizen.co>
Date: Wed, 30 Sep 2020 23:23:42 +1000
Subject: [PATCH] chat: normalize line height

---
 .../src/views/apps/chat/components/chat.tsx   | 60 ++++++++++---------
 .../apps/chat/components/lib/ChatMessage.tsx  |  2 +-
 .../apps/chat/components/lib/content/text.js  |  2 +-
 .../src/views/apps/chat/components/sidebar.js |  2 +-
 .../src/views/apps/chat/css/custom.css        |  2 +-
 5 files changed, 35 insertions(+), 33 deletions(-)

diff --git a/pkg/interface/src/views/apps/chat/components/chat.tsx b/pkg/interface/src/views/apps/chat/components/chat.tsx
index 942edaa01..23a40c5a4 100644
--- a/pkg/interface/src/views/apps/chat/components/chat.tsx
+++ b/pkg/interface/src/views/apps/chat/components/chat.tsx
@@ -159,35 +159,37 @@ export class ChatScreen extends Component<ChatScreenProps, ChatScreenState> {
       >
         {this.state.dragover ? <SubmitDragger /> : null}
         <ChatHeader {...props} />
-        <ChatWindow
-          isChatMissing={isChatMissing}
-          isChatLoading={isChatLoading}
-          isChatUnsynced={isChatUnsynced}
-          unreadCount={unreadCount}
-          unreadMsg={unreadMsg}
-          stationPendingMessages={pendingMessages}
-          ship={props.match.params.ship}
-          {...props} />
-        <ChatInput
-          ref={this.chatInput}
-          api={props.api}
-          numMsgs={lastMsgNum}
-          station={props.station}
-          owner={deSig(props.match.params.ship || "")}
-          ownerContact={ownerContact}
-          envelopes={props.envelopes}
-          contacts={props.contacts}
-          onUnmount={(msg: string) => this.setState({
-            messages: this.state.messages.set(props.station, msg)
-          })}
-          s3={props.s3}
-          placeholder="Message..."
-          message={this.state.messages.get(props.station) || ""}
-          deleteMessage={() => this.setState({
-            messages: this.state.messages.set(props.station, "")
-          })}
-          hideAvatars={props.hideAvatars}
-        />
+        <div className="h-100 w-100 overflow-hidden flex flex-column relative">
+          <ChatWindow
+            isChatMissing={isChatMissing}
+            isChatLoading={isChatLoading}
+            isChatUnsynced={isChatUnsynced}
+            unreadCount={unreadCount}
+            unreadMsg={unreadMsg}
+            stationPendingMessages={pendingMessages}
+            ship={props.match.params.ship}
+            {...props} />
+          <ChatInput
+            ref={this.chatInput}
+            api={props.api}
+            numMsgs={lastMsgNum}
+            station={props.station}
+            owner={deSig(props.match.params.ship || "")}
+            ownerContact={ownerContact}
+            envelopes={props.envelopes}
+            contacts={props.contacts}
+            onUnmount={(msg: string) => this.setState({
+              messages: this.state.messages.set(props.station, msg)
+            })}
+            s3={props.s3}
+            placeholder="Message..."
+            message={this.state.messages.get(props.station) || ""}
+            deleteMessage={() => this.setState({
+              messages: this.state.messages.set(props.station, "")
+            })}
+            hideAvatars={props.hideAvatars}
+          />
+        </div>
       </div>
     );
   }
diff --git a/pkg/interface/src/views/apps/chat/components/lib/ChatMessage.tsx b/pkg/interface/src/views/apps/chat/components/lib/ChatMessage.tsx
index cae8c61f6..2dc479141 100644
--- a/pkg/interface/src/views/apps/chat/components/lib/ChatMessage.tsx
+++ b/pkg/interface/src/views/apps/chat/components/lib/ChatMessage.tsx
@@ -247,7 +247,7 @@ export const MessageContent = ({ content, remoteContentPolicy, measure }) => {
     );
   } else if ('me' in content) {
     return (
-      <p className='f7 i lh-copy v-top'>
+      <p className='f9 i lh-copy v-top'>
         {content.me}
       </p>
     );
diff --git a/pkg/interface/src/views/apps/chat/components/lib/content/text.js b/pkg/interface/src/views/apps/chat/components/lib/content/text.js
index 8621fcedd..f55d6ce8c 100644
--- a/pkg/interface/src/views/apps/chat/components/lib/content/text.js
+++ b/pkg/interface/src/views/apps/chat/components/lib/content/text.js
@@ -64,7 +64,7 @@ export default class TextContent extends Component {
       && (group[0] === content.text))) { // entire message is room name?
       return (
         <Link
-          className="bb b--black b--white-d f7 mono lh-copy v-top"
+          className="bb b--black b--white-d f9 mono lh-copy v-top"
           to={'/~groups/join/' + group.input}>
           {content.text}
         </Link>
diff --git a/pkg/interface/src/views/apps/chat/components/sidebar.js b/pkg/interface/src/views/apps/chat/components/sidebar.js
index bd7f3dce0..de4bd026b 100644
--- a/pkg/interface/src/views/apps/chat/components/sidebar.js
+++ b/pkg/interface/src/views/apps/chat/components/sidebar.js
@@ -2,7 +2,7 @@ import React, { Component } from 'react';
 
 import Welcome from './lib/welcome';
 import { alphabetiseAssociations } from '~/logic/lib/util';
-import SidebarInvite from '~/views/components/SidebarInvite';
+import SidebarInvite from '~/views/components/Sidebar/SidebarInvite';
 import { GroupItem } from './lib/group-item';
 
 export class Sidebar extends Component {
diff --git a/pkg/interface/src/views/apps/chat/css/custom.css b/pkg/interface/src/views/apps/chat/css/custom.css
index 71d507ef9..130bdf5fa 100644
--- a/pkg/interface/src/views/apps/chat/css/custom.css
+++ b/pkg/interface/src/views/apps/chat/css/custom.css
@@ -161,7 +161,7 @@ h2 {
 }
 
 .unread-notice {
-  top: 48px;
+  top: 0px;
 }
 
 /* responsive */