admin mobile: improve small-screen readability across checklist, tabs, badges, and headers
This commit is contained in:
@@ -980,8 +980,8 @@ function PackageCard({
|
||||
backgroundColor={isActive ? accentSoft : undefined}
|
||||
gap="$2"
|
||||
>
|
||||
<XStack alignItems="center" justifyContent="space-between">
|
||||
<Text fontSize="$md" fontWeight="800" color={textStrong}>
|
||||
<XStack alignItems="flex-start" justifyContent="space-between" gap="$2" flexWrap="wrap">
|
||||
<Text fontSize="$md" fontWeight="800" color={textStrong} flex={1} minWidth={0}>
|
||||
{pkg.package_name ?? t('mobileBilling.packageFallback', 'Package')}
|
||||
</Text>
|
||||
{label ? <PillBadge tone="success">{label}</PillBadge> : null}
|
||||
@@ -1262,8 +1262,8 @@ function AddonRow({
|
||||
|
||||
return (
|
||||
<MobileCard borderColor={border} padding="$3" gap="$1.5">
|
||||
<XStack alignItems="center" justifyContent="space-between">
|
||||
<Text fontSize="$sm" fontWeight="700" color={textStrong}>
|
||||
<XStack alignItems="flex-start" justifyContent="space-between" gap="$2" flexWrap="wrap">
|
||||
<Text fontSize="$sm" fontWeight="700" color={textStrong} flex={1} minWidth={0}>
|
||||
{addon.label ?? addon.addon_key}
|
||||
</Text>
|
||||
<PillBadge tone={status.tone}>{status.text}</PillBadge>
|
||||
@@ -1271,11 +1271,11 @@ function AddonRow({
|
||||
{!hideEventLink && eventName ? (
|
||||
eventPath ? (
|
||||
<Pressable onPress={() => navigate(eventPath)}>
|
||||
<XStack alignItems="center" justifyContent="space-between">
|
||||
<Text fontSize="$xs" color={textStrong} fontWeight="600">
|
||||
<XStack alignItems="flex-start" justifyContent="space-between" gap="$2" flexWrap="wrap">
|
||||
<Text fontSize="$xs" color={textStrong} fontWeight="600" flex={1} minWidth={0}>
|
||||
{eventName}
|
||||
</Text>
|
||||
<Text fontSize="$xs" color={primary} fontWeight="700">
|
||||
<Text fontSize="$xs" color={primary} fontWeight="700" flexShrink={0}>
|
||||
{t('mobileBilling.openEvent', 'Open event')}
|
||||
</Text>
|
||||
</XStack>
|
||||
@@ -1316,8 +1316,8 @@ function EventAddonRow({ addon }: { addon: EventAddonSummary }) {
|
||||
|
||||
return (
|
||||
<MobileCard borderColor={border} padding="$3" gap="$1.5">
|
||||
<XStack alignItems="center" justifyContent="space-between">
|
||||
<Text fontSize="$sm" fontWeight="700" color={textStrong}>
|
||||
<XStack alignItems="flex-start" justifyContent="space-between" gap="$2" flexWrap="wrap">
|
||||
<Text fontSize="$sm" fontWeight="700" color={textStrong} flex={1} minWidth={0}>
|
||||
{addon.label ?? addon.key}
|
||||
</Text>
|
||||
<PillBadge tone={status.tone}>{status.text}</PillBadge>
|
||||
|
||||
Reference in New Issue
Block a user