From 8c55af5b5e18ff1f1c1c554a4b466c4788db570e Mon Sep 17 00:00:00 2001
From: Alex Gleason <alex@alexgleason.me>
Date: Sat, 26 Nov 2022 14:36:09 -0600
Subject: [PATCH] Display custom profile fields on mobile Fixes
 https://gitlab.com/soapbox-pub/soapbox/-/issues/1160

---
 .../features/ui/components/profile-info-panel.tsx        | 9 +++++++++
 1 file changed, 9 insertions(+)

diff --git a/app/soapbox/features/ui/components/profile-info-panel.tsx b/app/soapbox/features/ui/components/profile-info-panel.tsx
index 89239bd61..a765b38f2 100644
--- a/app/soapbox/features/ui/components/profile-info-panel.tsx
+++ b/app/soapbox/features/ui/components/profile-info-panel.tsx
@@ -13,6 +13,7 @@ import { badgeToTag, getBadges as getAccountBadges } from 'soapbox/utils/badges'
 import { capitalize } from 'soapbox/utils/strings';
 
 import ProfileFamiliarFollowers from './profile-familiar-followers';
+import ProfileField from './profile-field';
 import ProfileStats from './profile-stats';
 
 import type { Account } from 'soapbox/types/entities';
@@ -231,6 +232,14 @@ const ProfileInfoPanel: React.FC<IProfileInfoPanel> = ({ account, username }) =>
 
         <ProfileFamiliarFollowers account={account} />
       </Stack>
+
+      {account.fields.size > 0 && (
+        <Stack space={2} className='mt-4 xl:hidden'>
+          {account.fields.map((field, i) => (
+            <ProfileField field={field} key={i} />
+          ))}
+        </Stack>
+      )}
     </div>
   );
 };