diff options
| -rw-r--r-- | src/components/FeedInterstitials.tsx | 37 |
1 files changed, 20 insertions, 17 deletions
diff --git a/src/components/FeedInterstitials.tsx b/src/components/FeedInterstitials.tsx index 835534871..7debbf5e1 100644 --- a/src/components/FeedInterstitials.tsx +++ b/src/components/FeedInterstitials.tsx @@ -25,7 +25,7 @@ import { type ViewStyleProp, web, } from '#/alf' -import {Button} from '#/components/Button' +import {Button, ButtonIcon, ButtonText} from '#/components/Button' import * as FeedCard from '#/components/FeedCard' import {ArrowRight_Stroke2_Corner0_Rounded as ArrowRight} from '#/components/icons/Arrow' import {Hashtag_Stroke2_Corner0_Rounded as Hashtag} from '#/components/icons/Hashtag' @@ -36,6 +36,7 @@ import type * as bsky from '#/types/bsky' import {ProgressGuideList} from './ProgressGuide/List' const MOBILE_CARD_WIDTH = 165 +const FINAL_CARD_WIDTH = 120 function CardOuter({ children, @@ -420,27 +421,29 @@ export function ProfileGrid({ } function SeeMoreSuggestedProfilesCard() { - const navigation = useNavigation<NavigationProp>() + const t = useTheme() const {_} = useLingui() + const navigation = useNavigation<NavigationProp>() return ( <Button + color="primary" label={_(msg`Browse more accounts on the Explore page`)} - style={[a.flex_col]} - onPress={() => { - navigation.navigate('SearchTab') - }}> - <CardOuter> - <View style={[a.flex_1, a.justify_center]}> - <View style={[a.flex_col, a.align_center, a.gap_md]}> - <Text style={[a.leading_snug, a.text_center]}> - <Trans>See more accounts you might like</Trans> - </Text> - - <ArrowRight size="xl" /> - </View> - </View> - </CardOuter> + style={[ + a.flex_col, + a.align_center, + a.gap_xs, + a.p_md, + a.rounded_lg, + t.atoms.shadow_sm, + {width: FINAL_CARD_WIDTH}, + ]} + onPress={() => navigation.navigate('SearchTab')}> + <ButtonIcon icon={ArrowRight} size="lg" /> + <ButtonText + style={[a.text_md, a.font_medium, a.leading_snug, a.text_center]}> + <Trans>See more</Trans> + </ButtonText> </Button> ) } |