diff --git a/__snapshots__/libs/location/geolocation/components/GeolocationActivationModal.native.test.tsx.native-snap b/__snapshots__/libs/location/geolocation/components/GeolocationActivationModal.native.test.tsx.native-snap index bdeba7af1b0..5aed15457cc 100644 --- a/__snapshots__/libs/location/geolocation/components/GeolocationActivationModal.native.test.tsx.native-snap +++ b/__snapshots__/libs/location/geolocation/components/GeolocationActivationModal.native.test.tsx.native-snap @@ -254,16 +254,6 @@ exports[`GeolocationActivationModal should render properly 1`] = ` BicolorLocationPointer-SVG-Mock - Retrouve toutes les offres autour de chez toi en activant les données de localisation. - Tu peux activer ou désactiver cette fonctionnalité dans les paramètres de localisation de ton téléphone. - - - ) } const StyledScrollView = styled.ScrollView(({ theme }) => ({ + paddingTop: getSpacing(4), + paddingBottom: getSpacing(3), flex: 1, paddingLeft: getSpacing(6), paddingRight: getSpacing(6), diff --git a/src/libs/location/geolocation/components/GeolocationActivationModal.tsx b/src/libs/location/geolocation/components/GeolocationActivationModal.tsx index 1acf5e78727..df0a11c4add 100644 --- a/src/libs/location/geolocation/components/GeolocationActivationModal.tsx +++ b/src/libs/location/geolocation/components/GeolocationActivationModal.tsx @@ -8,7 +8,7 @@ import { useLocation } from 'libs/location/LocationWrapper' import { ButtonPrimary } from 'ui/components/buttons/ButtonPrimary' import { AppInformationModal } from 'ui/components/modals/AppInformationModal' import { BicolorLocationPointer } from 'ui/svg/icons/BicolorLocationPointer' -import { Spacer, Typo } from 'ui/theme' +import { getSpacing, Typo } from 'ui/theme' type Props = { hideGeolocPermissionModal: () => void @@ -41,17 +41,14 @@ export const GeolocationActivationModal: React.FC = ({ testIdSuffix="geoloc-permission-modal"> {/** Special case where theme.icons.sizes is not used */} - - + Retrouve toutes les offres autour de chez toi en activant les données de localisation. - {informationText} {isNative ? ( - - { analytics.logOpenLocationSettings() @@ -64,7 +61,14 @@ export const GeolocationActivationModal: React.FC = ({ ) } - +const StyledBicolorLocationPointer = styled(BicolorLocationPointer)({ + marginBottom: getSpacing(6), +}) const InformationText = styled(Typo.Body)({ textAlign: 'center', + marginTop: getSpacing(4), +}) + +const StyledButtonPrimary = styled(ButtonPrimary)({ + marginTop: getSpacing(6), }) diff --git a/src/shared/location/LocationSearchInput.tsx b/src/shared/location/LocationSearchInput.tsx index 7a9dde75bea..f1cd59a8c3b 100644 --- a/src/shared/location/LocationSearchInput.tsx +++ b/src/shared/location/LocationSearchInput.tsx @@ -1,4 +1,5 @@ import React from 'react' +import { View } from 'react-native' import styled from 'styled-components/native' import { LOCATION_PLACEHOLDER } from 'features/location/constants' @@ -8,7 +9,7 @@ import { theme } from 'theme' import { SearchInput } from 'ui/components/inputs/SearchInput' import { useDebounceValue } from 'ui/hooks/useDebounceValue' import { MagnifyingGlass } from 'ui/svg/icons/MagnifyingGlass' -import { Spacer } from 'ui/theme' +import { getSpacing } from 'ui/theme' interface LocationSearchInputProps { selectedPlace: SuggestedPlace | null @@ -38,8 +39,7 @@ export const LocationSearchInput = ({ const shouldShowSuggestedPlaces = isQueryProvided && !selectedPlace return ( - - + {shouldShowSuggestedPlaces ? ( - - + - + ) : null} - + ) } const StyledMagnifyingGlass = styled(MagnifyingGlass).attrs(({ theme }) => ({ size: theme.icons.sizes.small, }))`` + +const StyledView = styled(View)({ paddingTop: getSpacing(4) })