labeller avatars, fix overflow/alignment

bskyogcard/src/components/Avatar.tsx

@@ -22,10 +22,11 @@ export function Avatar({
   const moderation = moderateProfile(profile, moderatorData.moderationOptions)
   const modui = moderation.ui('avatar')
   const blur = !!modui?.blurs[0]
+  const isLabeller = !!profile.associated?.labeler
   return (
     <Box
       cx={[
-        a.rounded_full,
+        isLabeller ? a.rounded_xs : a.rounded_full,
         a.overflow_hidden,
         t.atoms.bg_contrast_25,
         {

bskyogcard/src/components/PostEmbed/QuotePost.tsx

@@ -60,14 +60,22 @@ export function QuotePost({
         a.border,
         t.atoms.border_contrast_low,
       ]}>
-      <Box cx={[a.flex_row, a.align_center, a.gap_xs, a.pb_sm]}>
+      <Box
+        cx={[
+          a.flex_row,
+          a.align_center,
+          a.gap_sm,
+          a.pb_sm,
+          a.w_full,
+          a.overflow_hidden,
+        ]}>
         <Avatar
-          size={20}
+          size={18}
           image={avatar}
           profile={author}
           moderatorData={moderatorData}
         />
-        <Box cx={[a.flex_row, a.align_center, a.gap_xs]}>
+        <Box cx={[a.flex_row, a.align_center, a.gap_xs, a.pt_2xs]}>
           <Text cx={[a.text_sm, a.font_bold]}>
             {author.displayName || author.handle}
           </Text>

bskyogcard/test.html

@@ -83,6 +83,10 @@
       <img src="http://localhost:3000/profile/test-all-embeds-a.bsky.social/post/3lkciefiepk2a?mat=1" />
       <h3>Blocked</h3>
       <img src="http://localhost:3000/profile/test-all-embeds-a.bsky.social/post/3lkcikkheys2c?mat=1" />
+
+      <h1>Labelers</h1>
+      <h3>Post from labeler</h3>
+      <img src="http://localhost:3000/profile/xblock.aendra.dev/post/3ljo3ne5cxk2h?mat=1" />
     </div>
   </body>
 </html>