Make load-latest button same on web

This commit is contained in:
Paul Frazee 2023-05-25 00:20:49 -05:00
parent 0262ed11ea
commit 6f02548bca

View file

@ -1,5 +1,6 @@
import React from 'react' import React from 'react'
import {StyleSheet, TouchableOpacity} from 'react-native' import {StyleSheet, TouchableOpacity} from 'react-native'
import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
import {Text} from '../text/Text' import {Text} from '../text/Text'
import {usePalette} from 'lib/hooks/usePalette' import {usePalette} from 'lib/hooks/usePalette'
import {UpIcon} from 'lib/icons' import {UpIcon} from 'lib/icons'
@ -28,8 +29,11 @@ export const LoadLatestBtn = ({
accessibilityLabel={label} accessibilityLabel={label}
accessibilityHint=""> accessibilityHint="">
<Text type="md-bold" style={pal.text}> <Text type="md-bold" style={pal.text}>
<UpIcon size={16} strokeWidth={1} style={[pal.text, styles.icon]} /> <FontAwesomeIcon
{label} icon="angle-up"
size={21}
style={[pal.text, styles.icon]}
/>
</Text> </Text>
</TouchableOpacity> </TouchableOpacity>
) )
@ -38,24 +42,20 @@ export const LoadLatestBtn = ({
const styles = StyleSheet.create({ const styles = StyleSheet.create({
loadLatest: { loadLatest: {
flexDirection: 'row', flexDirection: 'row',
alignItems: 'center',
justifyContent: 'center',
position: 'absolute', position: 'absolute',
left: '50vw', left: '50vw',
// @ts-ignore web only -prf // @ts-ignore web only -prf
transform: 'translateX(-50%)', transform: 'translateX(-282px)',
top: 60, bottom: 40,
shadowColor: '#000', width: 54,
shadowOpacity: 0.2, height: 54,
shadowOffset: {width: 0, height: 2},
shadowRadius: 4,
paddingLeft: 20,
paddingRight: 24,
paddingVertical: 10,
borderRadius: 30, borderRadius: 30,
borderWidth: 1, borderWidth: 1,
}, },
icon: { icon: {
position: 'relative', position: 'relative',
top: 2, top: 2,
marginRight: 5,
}, },
}) })