make alignment platform specific rather than size specific

zio/stable
Samuel Newman 2024-03-15 16:21:15 +00:00
parent 502df521c1
commit 58ac22c45b
1 changed files with 6 additions and 6 deletions

View File

@ -11,10 +11,11 @@ import {
UsePreferencesQueryResponse, UsePreferencesQueryResponse,
} from '#/state/queries/preferences' } from '#/state/queries/preferences'
import {Button, ButtonText} from '../Button' import {Button, ButtonText} from '../Button'
import {atoms as a, useBreakpoints, useTheme} from '#/alf' import {atoms as a, useTheme} from '#/alf'
import {ErrorMessage} from '#/view/com/util/error/ErrorMessage' import {ErrorMessage} from '#/view/com/util/error/ErrorMessage'
import {cleanError} from '#/lib/strings/errors' import {cleanError} from '#/lib/strings/errors'
import {ActivityIndicator, View} from 'react-native' import {ActivityIndicator, View} from 'react-native'
import {isIOS, isWeb} from '#/platform/detection'
export function BirthDateSettingsDialog({ export function BirthDateSettingsDialog({
control, control,
@ -63,7 +64,6 @@ function BirthdayInner({
const {_} = useLingui() const {_} = useLingui()
const [date, setDate] = React.useState(preferences.birthDate || new Date()) const [date, setDate] = React.useState(preferences.birthDate || new Date())
const t = useTheme() const t = useTheme()
const {gtMobile} = useBreakpoints()
const hasChanged = date !== preferences.birthDate const hasChanged = date !== preferences.birthDate
@ -80,7 +80,7 @@ function BirthdayInner({
}, [date, setBirthDate, control, hasChanged]) }, [date, setBirthDate, control, hasChanged])
return ( return (
<View style={a.gap_lg}> <View style={a.gap_lg} testID="birthDateSettingsDialog">
<View style={[a.gap_sm]}> <View style={[a.gap_sm]}>
<Text style={[a.text_2xl, a.font_bold]}> <Text style={[a.text_2xl, a.font_bold]}>
<Trans>My Birthday</Trans> <Trans>My Birthday</Trans>
@ -89,7 +89,7 @@ function BirthdayInner({
<Trans>This information is not shared with other users.</Trans> <Trans>This information is not shared with other users.</Trans>
</Text> </Text>
</View> </View>
<View style={[a.w_full, a.align_center]}> <View style={isIOS && [a.w_full, a.align_center]}>
<DateInput <DateInput
handleAsUTC handleAsUTC
testID="birthdayInput" testID="birthdayInput"
@ -107,10 +107,10 @@ function BirthdayInner({
<ErrorMessage message={cleanError(error)} style={[a.rounded_sm]} /> <ErrorMessage message={cleanError(error)} style={[a.rounded_sm]} />
) : undefined} ) : undefined}
<View style={gtMobile && [a.flex_row, a.justify_end]}> <View style={isWeb && [a.flex_row, a.justify_end]}>
<Button <Button
label={hasChanged ? _(msg`Save birthday`) : _(msg`Done`)} label={hasChanged ? _(msg`Save birthday`) : _(msg`Done`)}
size={gtMobile ? 'small' : 'medium'} size={isWeb ? 'small' : 'medium'}
onPress={onSave} onPress={onSave}
variant="solid" variant="solid"
color="primary"> color="primary">