diff --git a/packages/ui/src/components/UserProfileScreenView.tsx b/packages/ui/src/components/UserProfileScreenView.tsx index 2344235021..272ae946ca 100644 --- a/packages/ui/src/components/UserProfileScreenView.tsx +++ b/packages/ui/src/components/UserProfileScreenView.tsx @@ -15,6 +15,7 @@ import { View, XStack, YStack, + isWeb, styled, useTheme, useWindowDimensions, @@ -22,6 +23,7 @@ import { import { useContact, useCurrentUserId, useNavigation } from '../contexts'; import { useCopy } from '../hooks/useCopy'; +import useIsWindowNarrow from '../hooks/useIsWindowNarrow'; import { triggerHaptic, useGroupTitle } from '../utils'; import { ContactAvatar, GroupAvatar } from './Avatar'; import { Button } from './Button'; @@ -138,11 +140,12 @@ function StatusBlock({ label: string; }) { const windowDimensions = useWindowDimensions(); + const isWindowNarrow = useIsWindowNarrow(); return ( @@ -216,7 +219,7 @@ export function BioDisplay({ ...rest }: { bio: string } & ComponentProps) { return bio.length ? ( - + About {bio} @@ -230,9 +233,11 @@ export function StatusDisplay({ ...rest }: { status: string } & ComponentProps) { return ( - + Status - {status} + + {status} + ); } @@ -464,7 +469,7 @@ function ProfileButton(props: { flexGrow={1} flexBasis={1} borderWidth={0} - paddingVertical={'$xl'} + paddingVertical="$xl" paddingHorizontal="$2xl" borderRadius="$2xl" onPress={handlePress} @@ -474,6 +479,8 @@ function ProfileButton(props: { {props.title}