Adjust avi and type sizing

bskyogcard/src/components/Post.tsx

@@ -37,7 +37,6 @@ export function Post({
 }) {
   if (AppBskyFeedPost.isValidRecord(post.record)) {
     const avatar = data.images.get(post.author.avatar)
-    console.log(avatar.colors.vibrant)
     const rt = post.record.text
       ? new RichTextApi({
           text: post.record.text,
@@ -76,7 +75,7 @@ export function Post({
           ]}>
           <Box cx={[a.flex_row, a.align_center, a.gap_sm, a.pb_sm]}>
             <Avatar
-              size={48}
+              size={42}
               image={avatar}
               profile={post.author}
               moderatorData={moderatorData}

bskyogcard/src/components/Text.tsx

@@ -2,6 +2,8 @@ import React from 'react'
 
 import {atoms as a, style as s, theme as t} from '../theme/index.js'
 
+const SCALE_MULTIPLIER = 1 - 0.0625
+
 export function Text({
   children,
   cx,
@@ -9,21 +11,18 @@ export function Text({
   children?: React.ReactNode
   cx?: Record<string, any>[]
 }) {
-  return (
+  const styles = s([
-    <div
+    a.flex,
-      style={s([
+    a.flex_wrap,
-        a.flex,
+    {
-        a.flex_wrap,
+      columnGap: '1px',
-        {
+    },
-          columnGap: '1px',
+    a.font_normal,
-        },
+    a.leading_tight,
-        a.font_normal,
+    a.tracking_wide,
-        a.leading_tight,
+    t.atoms.text,
-        a.tracking_wide,
+    ...(cx ?? []),
-        t.atoms.text,
+  ])
-        ...(cx ?? []),
+  styles.fontSize = (styles.fontSize || a.text_md.fontSize) * SCALE_MULTIPLIER
-      ])}>
+  return <div style={styles}>{children}</div>
-      {children}
-    </div>
-  )
 }