From 835378650bfa1919a964320a68975c9b3fe0f412 Mon Sep 17 00:00:00 2001
From: Matilde Park <matilde@tlon.io>
Date: Tue, 20 Oct 2020 17:22:00 -0400
Subject: [PATCH] chat: timestamps are lined at top of messages

---
 pkg/interface/src/views/apps/chat/components/ChatMessage.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/pkg/interface/src/views/apps/chat/components/ChatMessage.tsx b/pkg/interface/src/views/apps/chat/components/ChatMessage.tsx
index 999e8eda33..00ea0c0f8f 100644
--- a/pkg/interface/src/views/apps/chat/components/ChatMessage.tsx
+++ b/pkg/interface/src/views/apps/chat/components/ChatMessage.tsx
@@ -97,7 +97,7 @@ export default class ChatMessage extends Component<ChatMessageProps> {
 
     const containerClass = `${renderSigil
       ? `cf pt2 pl3 lh-copy`
-      : `items-center cf hide-child`} ${isPending ? 'o-40' : ''} ${className}`
+      : `items-top cf hide-child`} ${isPending ? 'o-40' : ''} ${className}`
 
     const timestamp = moment.unix(msg.when / 1000).format(renderSigil ? 'hh:mm a' : 'hh:mm');
 
@@ -255,7 +255,7 @@ export class MessageWithSigil extends PureComponent<MessageProps> {
 
 export const MessageWithoutSigil = ({ timestamp, msg, remoteContentPolicy, measure }) => (
   <>
-    <p className="child pr1 mono f9 gray2 dib">{timestamp}</p>
+    <Text mono gray display='inline-block' pr='1' pt='2px' lineHeight='tall' className="child">{timestamp}</Text>
     <Box fontSize='14px' className="clamp-message" style={{ flexGrow: 1 }}>
       <MessageContent content={msg.letter} remoteContentPolicy={remoteContentPolicy} measure={measure}/>
     </Box>