thoughts-frontend/components/remote-user-profile.tsx

@@ -145,22 +145,21 @@ export function RemoteUserProfile({
               )}
 
               {actor.attachment.length > 0 && (
-                <div className="mt-4 overflow-x-auto">
-                  <table className="w-full text-sm border-collapse">
-                    <tbody>
-                      {actor.attachment.map((field) => (
-                        <tr key={field.name} className="border-t">
-                          <td className="py-1 pr-3 font-medium text-muted-foreground whitespace-nowrap align-top">
-                            {field.name}
-                          </td>
-                          <td
-                            className="py-1 break-all [&_a]:underline [&_a]:text-primary"
-                            dangerouslySetInnerHTML={{ __html: field.value }}
-                          />
-                        </tr>
-                      ))}
-                    </tbody>
-                  </table>
+                <div className="mt-4 space-y-0 text-sm">
+                  {actor.attachment.map((field) => (
+                    <div
+                      key={field.name}
+                      className="grid grid-cols-[minmax(0,5rem)_1fr] gap-2 border-t py-1"
+                    >
+                      <span className="font-medium text-muted-foreground truncate" title={field.name}>
+                        {field.name}
+                      </span>
+                      <span
+                        className="break-all min-w-0 [&_a]:underline [&_a]:text-primary"
+                        dangerouslySetInnerHTML={{ __html: field.value }}
+                      />
+                    </div>
+                  ))}
                 </div>
               )}
             </Card>