From 3293c5e0e0bf6fe89596bd0a79dda6cd1a0c2fb5 Mon Sep 17 00:00:00 2001
From: Samuel Newman <mozzius@protonmail.com>
Date: Wed, 25 Sep 2024 17:13:03 +0100
Subject: [PATCH] Reduce display name size (#5482)

* reduce displayname size

* only apply to small screens
---
 src/screens/Profile/Header/DisplayName.tsx | 11 +++++++++--
 1 file changed, 9 insertions(+), 2 deletions(-)

diff --git a/src/screens/Profile/Header/DisplayName.tsx b/src/screens/Profile/Header/DisplayName.tsx
index e30162c3af..bcc56d7f66 100644
--- a/src/screens/Profile/Header/DisplayName.tsx
+++ b/src/screens/Profile/Header/DisplayName.tsx
@@ -5,7 +5,7 @@ import {AppBskyActorDefs, ModerationDecision} from '@atproto/api'
 import {sanitizeDisplayName} from '#/lib/strings/display-names'
 import {sanitizeHandle} from '#/lib/strings/handles'
 import {Shadow} from '#/state/cache/types'
-import {atoms as a, useTheme} from '#/alf'
+import {atoms as a, useBreakpoints, useTheme} from '#/alf'
 import {Text} from '#/components/Typography'
 
 export function ProfileHeaderDisplayName({
@@ -16,12 +16,19 @@ export function ProfileHeaderDisplayName({
   moderation: ModerationDecision
 }) {
   const t = useTheme()
+  const {gtMobile} = useBreakpoints()
+
   return (
     <View pointerEvents="none">
       <Text
         emoji
         testID="profileHeaderDisplayName"
-        style={[t.atoms.text, a.text_4xl, a.self_start, {fontWeight: '600'}]}>
+        style={[
+          t.atoms.text,
+          gtMobile ? a.text_4xl : a.text_3xl,
+          a.self_start,
+          {fontWeight: '600'},
+        ]}>
         {sanitizeDisplayName(
           profile.displayName || sanitizeHandle(profile.handle),
           moderation.ui('displayName'),