Merge branch 'lf/hark-qa-fixes' of https://github.com/urbit/urbit into lf/hark-qa-fixes

pkg/interface/src/views/apps/chat/components/ChatMessage.tsx

@@ -86,7 +86,8 @@ export default class ChatMessage extends Component<ChatMessageProps> {
       unreadMarkerRef,
       history,
       api,
-      highlighted
+      highlighted,
+      fontSize
     } = this.props;
 
     const renderSigil = Boolean((nextMsg && msg.author !== nextMsg.author) || !nextMsg || msg.number === 1);
@@ -118,7 +119,8 @@ export default class ChatMessage extends Component<ChatMessageProps> {
       history,
       api,
       scrollWindow,
-      highlighted
+      highlighted,
+      fontSize
     };
 
     const unreadContainerStyle = {
@@ -131,7 +133,7 @@ export default class ChatMessage extends Component<ChatMessageProps> {
         width='100%'
         display='flex'
         flexWrap='wrap'
-        pt={renderSigil ? 3 : 0}
+        pt={this.props.pt ? this.props.pt : renderSigil ? 3 : 0}
         pr={3}
         pb={isLastMessage ? 3 : 0}
         ref={this.divRef}
@@ -170,7 +172,7 @@ interface MessageProps {
 
 export class MessageWithSigil extends PureComponent<MessageProps> {
   isDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
-  
+
   render() {
     const {
       msg,
@@ -184,14 +186,15 @@ export class MessageWithSigil extends PureComponent<MessageProps> {
       measure,
       api,
       history,
-      scrollWindow
+      scrollWindow,
+      fontSize
     } = this.props;
 
     const datestamp = moment.unix(msg.when / 1000).format(DATESTAMP_FORMAT);
     const contact = msg.author in contacts ? contacts[msg.author] : false;
     const showNickname = !hideNicknames && contact && contact.nickname;
     const name = showNickname ? contact.nickname : cite(msg.author);
-    const color = contact ? `#${uxToHex(contact.color)}` : this.isDark ?  '#000000' :'#FFFFFF'  
+    const color = contact ? `#${uxToHex(contact.color)}` : this.isDark ?  '#000000' :'#FFFFFF'
     const sigilClass = contact ? '' : this.isDark ? 'mix-blend-diff' : 'mix-blend-darken';
 
     let nameSpan = null;
@@ -245,7 +248,7 @@ export class MessageWithSigil extends PureComponent<MessageProps> {
             <Text flexShrink='0' gray mono className="v-mid">{timestamp}</Text>
             <Text gray mono ml={2} className="v-mid child dn-s">{datestamp}</Text>
           </Box>
-          <Box  fontSize='14px'><MessageContent content={msg.letter} remoteContentPolicy={remoteContentPolicy} measure={measure} /></Box>
+          <Box fontSize={fontSize ? fontSize : '14px'}><MessageContent content={msg.letter} remoteContentPolicy={remoteContentPolicy} measure={measure} fontSize={fontSize} /></Box>
         </Box>
       </>
     );
@@ -261,12 +264,12 @@ export const MessageWithoutSigil = ({ timestamp, msg, remoteContentPolicy, measu
   </>
 );
 
-export const MessageContent = ({ content, remoteContentPolicy, measure }) => {
+export const MessageContent = ({ content, remoteContentPolicy, measure, fontSize }) => {
   if ('code' in content) {
     return <CodeContent content={content} />;
   } else if ('url' in content) {
     return (
-      <Text fontSize='14px' lineHeight="tall" color='black'>
+      <Text fontSize={fontSize ? fontSize : '14px'} lineHeight="tall" color='black'>
         <RemoteContent
           url={content.url}
           remoteContentPolicy={remoteContentPolicy}
@@ -282,13 +285,13 @@ export const MessageContent = ({ content, remoteContentPolicy, measure }) => {
     );
   } else if ('me' in content) {
     return (
-      <Text fontStyle='italic' fontSize='14px' lineHeight='tall' color='black'>
+      <Text fontStyle='italic' fontSize={fontSize ? fontSize : '14px'} lineHeight='tall' color='black'>
         {content.me}
       </Text>
     );
   }
   else if ('text' in content) {
-    return <TextContent content={content} />;
+    return <TextContent fontSize={fontSize} content={content} />;
   } else {
     return null;
   }

pkg/interface/src/views/apps/chat/components/content/text.js

@@ -26,13 +26,12 @@ const DISABLED_INLINE_TOKENS = [
 
 const renderers = {
   inlineCode: ({language, value}) => {
-    return <Text mono fontSize='14px' backgroundColor='washedGray' style={{ whiteSpace: 'preWrap'}}>{value}</Text>
+    return <Text mono backgroundColor='washedGray' style={{ whiteSpace: 'preWrap'}}>{value}</Text>
   },
   code: ({language, value}) => {
     return <Text
               p='1'
               className='clamp-message'
-              fontSize='14px'
               display='block'
               borderRadius='1'
               mono
@@ -84,7 +83,7 @@ export default class TextContent extends Component {
       && (urbitOb.isValidPatp(group[2]) // valid patp?
       && (group[0] === content.text))) { // entire message is room name?
       return (
-        <Text fontSize='14px' color='black' lineHeight="tall">
+        <Text fontSize={props.fontSize ? props.fontSize : '14px'} color='black' lineHeight="tall">
           <Link
             className="bb b--black b--white-d mono"
             to={'/~landscape/join/' + group.input}>
@@ -94,7 +93,7 @@ export default class TextContent extends Component {
       );
     } else {
       return (
-        <Text color='black' fontSize='14px' lineHeight="tall" style={{ overflowWrap: 'break-word' }}>
+        <Text color='black' fontSize={props.fontSize ? props.fontSize : '14px'} lineHeight="tall" style={{ overflowWrap: 'break-word' }}>
           <MessageMarkdown source={content.text} />
         </Text>
       );

pkg/interface/src/views/apps/notifications/chat.tsx

@@ -83,6 +83,8 @@ export function ChatNotification(props: {
                 isLastRead={false}
                 group={group}
                 contacts={groupContacts}
+                fontSize='0'
+                pt='2'
               />
             </Link>
           );

pkg/interface/src/views/apps/notifications/graph.tsx

@@ -140,7 +140,7 @@ const GraphNode = ({
 
   return (
     <Link to={nodeUrl}>
-      <Row gapX="2" py="2">
+      <Row gapX="2" pt="2">
         <Col>{img}</Col>
         <Col alignItems="flex-start">
           <Row