Make load-latest button same on web

src/view/com/util/load-latest/LoadLatestBtn.web.tsx

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