zio/bsky-app
2
0
Fork 0
Code Pull requests Releases Packages Activity

Clean up the post controls UI (#2614)

Browse source 
* Hide zeros on post ctrls

* Align buttons between posts

* Update loading placeholders

* Remove unused
This commit is contained in:
dan 2024-01-25 01:38:23 +00:00 • committed by GitHub
parent e111a31c1d
commit 63fbdede42
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
4 changed files with 52 additions and 41 deletions
Download patch file Download diff file Expand all files Collapse all files

50
src/view/com/util/LoadingPlaceholder.tsx
View file

@ -6,8 +6,12 @@ import {
ViewStyle,
DimensionValue,
} from 'react-native'
import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
import {HeartIcon, HeartIconSolid} from 'lib/icons'
import {
HeartIcon,
HeartIconSolid,
CommentBottomArrow,
RepostIcon,
} from 'lib/icons'
import {s} from 'lib/styles'
import {useTheme} from 'lib/ThemeContext'
import {usePalette} from 'lib/hooks/usePalette'
@ -61,30 +65,30 @@ export function PostLoadingPlaceholder({
<LoadingPlaceholder width={100} height={6} style={{marginBottom: 10}} />
<LoadingPlaceholder width="95%" height={6} style={{marginBottom: 8}} />
<LoadingPlaceholder width="95%" height={6} style={{marginBottom: 8}} />
<LoadingPlaceholder width="80%" height={6} style={{marginBottom: 15}} />
<View style={s.flexRow}>
<View style={s.flex1}>
<FontAwesomeIcon
style={{color: theme.palette.default.icon}}
icon={['far', 'comment']}
size={14}
<LoadingPlaceholder width="80%" height={6} style={{marginBottom: 11}} />
<View style={styles.postCtrls}>
<View style={[styles.postCtrl, {paddingLeft: 0}]}>
<CommentBottomArrow
style={[{color: theme.palette.default.icon, marginTop: 1}]}
strokeWidth={3}
size={15}
/>
</View>
<View style={s.flex1}>
<FontAwesomeIcon
<View style={styles.postCtrl}>
<RepostIcon
style={{color: theme.palette.default.icon}}
icon="retweet"
size={18}
strokeWidth={3}
size={20}
/>
</View>
<View style={s.flex1}>
<View style={styles.postCtrl}>
<HeartIcon
style={{color: theme.palette.default.icon} as ViewStyle}
size={17}
strokeWidth={1.7}
size={16}
strokeWidth={3}
/>
</View>
<View style={s.flex1} />
<View style={{width: 30, height: 30}} />
</View>
</View>
</View>
@ -267,6 +271,18 @@ const styles = StyleSheet.create({
paddingHorizontal: 10,
paddingTop: 20,
paddingBottom: 5,
paddingRight: 15,
},
postCtrls: {
opacity: 0.5,
flexDirection: 'row',
justifyContent: 'space-between',
},
postCtrl: {
padding: 5,
flex: 1,
flexDirection: 'row',
alignItems: 'center',
},
avatar: {
borderRadius: 26,