diff options
| author | Eric Bailey <git@esb.lol> | 2024-03-20 16:15:41 -0500 |
|---|---|---|
| committer | Eric Bailey <git@esb.lol> | 2024-03-20 16:15:41 -0500 |
| commit | 6e1541f2030897c8e32090dee3904fc65284ee8c (patch) | |
| tree | 5b55fafedce1dc8c66311a3e52d483106f001c20 /src/components/forms/HostingProvider.tsx | |
| parent | 94cc08929f05b4909d3367b51790ceab4b5017ec (diff) | |
| download | voidsky-6e1541f2030897c8e32090dee3904fc65284ee8c.tar.zst | |
HostingProvider tweaks
Diffstat (limited to 'src/components/forms/HostingProvider.tsx')
| -rw-r--r-- | src/components/forms/HostingProvider.tsx | 60 |
1 files changed, 34 insertions, 26 deletions
diff --git a/src/components/forms/HostingProvider.tsx b/src/components/forms/HostingProvider.tsx index 34db9442d..f2d11062a 100644 --- a/src/components/forms/HostingProvider.tsx +++ b/src/components/forms/HostingProvider.tsx @@ -51,36 +51,44 @@ export function HostingProvider({ a.align_center, a.rounded_sm, a.px_md, + a.pr_sm, a.gap_xs, {paddingVertical: isAndroid ? 14 : 9}, ]} onPress={onPressSelectService}> - {({hovered}) => ( - <> - <View style={a.pr_xs}> - <Globe - size="md" - fill={hovered ? t.palette.contrast_800 : t.palette.contrast_500} - /> - </View> - <Text style={[a.text_md]}>{toNiceDomain(serviceUrl)}</Text> - <View - style={[ - a.rounded_sm, - hovered ? t.atoms.bg_contrast_300 : t.atoms.bg_contrast_100, - {marginLeft: 'auto', left: 6, padding: 6}, - ]}> - <Pencil - size="sm" - style={{ - color: hovered - ? t.palette.contrast_800 - : t.palette.contrast_500, - }} - /> - </View> - </> - )} + {({hovered, pressed}) => { + const interacted = hovered || pressed + return ( + <> + <View style={a.pr_xs}> + <Globe + size="md" + fill={ + interacted ? t.palette.contrast_800 : t.palette.contrast_500 + } + /> + </View> + <Text style={[a.text_md]}>{toNiceDomain(serviceUrl)}</Text> + <View + style={[ + a.rounded_sm, + interacted + ? t.atoms.bg_contrast_300 + : t.atoms.bg_contrast_100, + {marginLeft: 'auto', padding: 6}, + ]}> + <Pencil + size="sm" + style={{ + color: interacted + ? t.palette.contrast_800 + : t.palette.contrast_500, + }} + /> + </View> + </> + ) + }} </Button> </> ) |