chat: normalize line height

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
+        <div className="h-100 w-100 overflow-hidden flex flex-column relative">
-          isChatMissing={isChatMissing}
+          <ChatWindow
-          isChatLoading={isChatLoading}
+            isChatMissing={isChatMissing}
-          isChatUnsynced={isChatUnsynced}
+            isChatLoading={isChatLoading}
-          unreadCount={unreadCount}
+            isChatUnsynced={isChatUnsynced}
-          unreadMsg={unreadMsg}
+            unreadCount={unreadCount}
-          stationPendingMessages={pendingMessages}
+            unreadMsg={unreadMsg}
-          ship={props.match.params.ship}
+            stationPendingMessages={pendingMessages}
-          {...props} />
+            ship={props.match.params.ship}
-        <ChatInput
+            {...props} />
-          ref={this.chatInput}
+          <ChatInput
-          api={props.api}
+            ref={this.chatInput}
-          numMsgs={lastMsgNum}
+            api={props.api}
-          station={props.station}
+            numMsgs={lastMsgNum}
-          owner={deSig(props.match.params.ship || "")}
+            station={props.station}
-          ownerContact={ownerContact}
+            owner={deSig(props.match.params.ship || "")}
-          envelopes={props.envelopes}
+            ownerContact={ownerContact}
-          contacts={props.contacts}
+            envelopes={props.envelopes}
-          onUnmount={(msg: string) => this.setState({
+            contacts={props.contacts}
-            messages: this.state.messages.set(props.station, msg)
+            onUnmount={(msg: string) => this.setState({
-          })}
+              messages: this.state.messages.set(props.station, msg)
-          s3={props.s3}
+            })}
-          placeholder="Message..."
+            s3={props.s3}
-          message={this.state.messages.get(props.station) || ""}
+            placeholder="Message..."
-          deleteMessage={() => this.setState({
+            message={this.state.messages.get(props.station) || ""}
-            messages: this.state.messages.set(props.station, "")
+            deleteMessage={() => this.setState({
-          })}
+              messages: this.state.messages.set(props.station, "")
-          hideAvatars={props.hideAvatars}
+            })}
-        />
+            hideAvatars={props.hideAvatars}
+          />
+        </div>
       </div>
     );
   }

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>
     );

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>

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 {

pkg/interface/src/views/apps/chat/css/custom.css

@@ -161,7 +161,7 @@ h2 {
 }
 
 .unread-notice {
-  top: 48px;
+  top: 0px;
 }
 
 /* responsive */