admin mobile: improve small-screen readability across checklist, tabs, badges, and headers
Some checks failed
linter / quality (push) Has been cancelled
tests / ci (push) Has been cancelled
tests / ui (push) Has been cancelled

This commit is contained in:
Codex Agent
2026-02-08 22:13:01 +01:00
parent 83cf863548
commit e3bb1642db
11 changed files with 131 additions and 82 deletions

View File

@@ -583,41 +583,49 @@ export default function MobileProfileAccountPage() {
orientation="horizontal"
flexDirection="column"
>
<Tabs.List gap="$2">
<Tabs.List gap="$1" flexWrap="wrap">
<Tabs.Tab
value="account"
flex={1}
paddingVertical="$2.5"
paddingHorizontal="$3"
flexGrow={1}
flexShrink={1}
flexBasis="calc(50% - 4px)"
minWidth={132}
paddingVertical="$2"
paddingHorizontal="$2"
borderRadius="$4"
hoverStyle={{ backgroundColor: '$backgroundHover' }}
pressStyle={{ backgroundColor: '$backgroundPress' }}
activeStyle={{ backgroundColor: '$backgroundPress' }}
>
<Text
fontSize="$sm"
fontSize="$xs"
fontWeight={activeTab === 'account' ? '700' : '600'}
color={activeTab === 'account' ? text : muted}
textAlign="center"
numberOfLines={2}
>
{t('profile.tabs.account', 'Account')}
</Text>
</Tabs.Tab>
<Tabs.Tab
value="branding"
flex={1}
paddingVertical="$2.5"
paddingHorizontal="$3"
flexGrow={1}
flexShrink={1}
flexBasis="calc(50% - 4px)"
minWidth={132}
paddingVertical="$2"
paddingHorizontal="$2"
borderRadius="$4"
hoverStyle={{ backgroundColor: '$backgroundHover' }}
pressStyle={{ backgroundColor: '$backgroundPress' }}
activeStyle={{ backgroundColor: '$backgroundPress' }}
>
<Text
fontSize="$sm"
fontSize="$xs"
fontWeight={activeTab === 'branding' ? '700' : '600'}
color={activeTab === 'branding' ? text : muted}
textAlign="center"
numberOfLines={2}
>
{t('profile.tabs.branding', 'Standard-Branding')}
</Text>