forked from
jollywhoppers.com/witchsky.app
Bluesky app fork with some witchin' additions 💫
Update load latest to match sizing and aesthetic better
+18
-16
+18
-16
src/view/screens/Home.tsx
+18
-16
src/view/screens/Home.tsx
···
2
2
import {StyleSheet, TouchableOpacity, View} from 'react-native'
3
3
import {observer} from 'mobx-react-lite'
4
4
import useAppState from 'react-native-appstate-hook'
5
-
import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
5
+
import LinearGradient from 'react-native-linear-gradient'
6
6
import {useSafeAreaInsets} from 'react-native-safe-area-context'
7
7
import {ViewHeader} from '../com/util/ViewHeader'
8
8
import {Feed} from '../com/posts/Feed'
···
10
10
import {FAB} from '../com/util/FAB'
11
11
import {useStores} from '../../state'
12
12
import {ScreenParams} from '../routes'
13
-
import {s, colors} from '../lib/styles'
13
+
import {s, colors, gradients} from '../lib/styles'
14
14
import {useOnMainScroll} from '../lib/hooks/useOnMainScroll'
15
15
import {clamp} from 'lodash'
16
16
···
100
100
style={[
101
101
styles.loadLatest,
102
102
store.shell.minimalShellMode
103
-
? {bottom: 50}
103
+
? {bottom: 35}
104
104
: {bottom: 60 + clamp(safeAreaInsets.bottom, 15, 30)},
105
105
]}
106
106
onPress={onPressLoadLatest}
107
107
hitSlop={HITSLOP}>
108
-
<FontAwesomeIcon icon="arrow-up" style={{color: colors.white}} />
109
-
<Text style={styles.loadLatestText}>Load new posts</Text>
108
+
<LinearGradient
109
+
colors={[gradients.blueLight.start, gradients.blueLight.end]}
110
+
start={{x: 0, y: 0}}
111
+
end={{x: 1, y: 1}}
112
+
style={styles.loadLatestInner}>
113
+
<Text type="md-bold" style={styles.loadLatestText}>
114
+
Load new posts
115
+
</Text>
116
+
</LinearGradient>
110
117
</TouchableOpacity>
111
118
) : undefined}
112
119
<FAB icon="pen-nib" onPress={() => onPressCompose(false)} />
···
116
123
117
124
const styles = StyleSheet.create({
118
125
loadLatest: {
119
-
flexDirection: 'row',
120
126
position: 'absolute',
121
-
left: 10,
122
-
backgroundColor: colors.blue3,
123
-
paddingHorizontal: 12,
124
-
paddingVertical: 10,
125
-
borderRadius: 30,
127
+
left: 20,
126
128
shadowColor: '#000',
127
129
shadowOpacity: 0.3,
128
130
shadowOffset: {width: 0, height: 1},
129
131
},
130
-
loadLatestLow: {
131
-
bottom: 15,
132
+
loadLatestInner: {
133
+
flexDirection: 'row',
134
+
paddingHorizontal: 14,
135
+
paddingVertical: 10,
136
+
borderRadius: 30,
132
137
},
133
138
loadLatestText: {
134
139
color: colors.white,
135
-
fontWeight: 'bold',
136
-
marginLeft: 5,
137
-
fontSize: 16,
138
140
},
139
141
})