Tune the custom feeds header a bit more
parent
629ca24e90
commit
12c7f6d6a5
|
@ -129,53 +129,57 @@ export const CustomFeedScreen = withAuthRequired(
|
||||||
return (
|
return (
|
||||||
<View style={styles.headerBtns}>
|
<View style={styles.headerBtns}>
|
||||||
<Button
|
<Button
|
||||||
testID="shareBtn"
|
type="default-light"
|
||||||
type="default"
|
|
||||||
accessibilityLabel="Share this feed"
|
|
||||||
accessibilityHint=""
|
|
||||||
onPress={onPressShare}>
|
|
||||||
<FontAwesomeIcon icon="share" size={18} color={pal.colors.icon} />
|
|
||||||
</Button>
|
|
||||||
<Button
|
|
||||||
type="default"
|
|
||||||
testID="toggleLikeBtn"
|
testID="toggleLikeBtn"
|
||||||
accessibilityLabel="Like this feed"
|
accessibilityLabel="Like this feed"
|
||||||
accessibilityHint=""
|
accessibilityHint=""
|
||||||
onPress={onToggleLiked}>
|
onPress={onToggleLiked}>
|
||||||
{currentFeed?.isLiked ? (
|
{currentFeed?.isLiked ? (
|
||||||
<HeartIconSolid size={18} style={styles.liked} />
|
<HeartIconSolid size={19} style={styles.liked} />
|
||||||
) : (
|
) : (
|
||||||
<HeartIcon strokeWidth={3} size={18} style={pal.textLight} />
|
<HeartIcon strokeWidth={3} size={19} style={pal.textLight} />
|
||||||
)}
|
)}
|
||||||
</Button>
|
</Button>
|
||||||
|
{currentFeed?.isSaved ? (
|
||||||
<Button
|
<Button
|
||||||
type="default"
|
type="default-light"
|
||||||
accessibilityLabel={isPinned ? 'Unpin this feed' : 'Pin this feed'}
|
accessibilityLabel={
|
||||||
|
isPinned ? 'Unpin this feed' : 'Pin this feed'
|
||||||
|
}
|
||||||
accessibilityHint=""
|
accessibilityHint=""
|
||||||
onPress={onTogglePinned}>
|
onPress={onTogglePinned}>
|
||||||
<FontAwesomeIcon
|
<FontAwesomeIcon
|
||||||
icon="thumb-tack"
|
icon="thumb-tack"
|
||||||
size={16}
|
size={17}
|
||||||
color={isPinned ? colors.blue3 : pal.colors.icon}
|
color={isPinned ? colors.blue3 : pal.colors.textLight}
|
||||||
style={styles.top1}
|
style={styles.top1}
|
||||||
/>
|
/>
|
||||||
</Button>
|
</Button>
|
||||||
|
) : undefined}
|
||||||
{currentFeed?.isSaved ? (
|
{currentFeed?.isSaved ? (
|
||||||
<DropdownButton
|
<DropdownButton
|
||||||
testID="feedHeaderDropdownBtn"
|
testID="feedHeaderDropdownBtn"
|
||||||
type="default"
|
type="default-light"
|
||||||
items={dropdownItems}
|
items={dropdownItems}
|
||||||
menuWidth={250}>
|
menuWidth={250}>
|
||||||
<FontAwesomeIcon icon="ellipsis" style={[pal.text]} />
|
<FontAwesomeIcon
|
||||||
|
icon="ellipsis"
|
||||||
|
color={pal.colors.textLight}
|
||||||
|
size={18}
|
||||||
|
/>
|
||||||
</DropdownButton>
|
</DropdownButton>
|
||||||
) : (
|
) : (
|
||||||
<Button
|
<Button
|
||||||
type="inverted"
|
type="default-light"
|
||||||
onPress={onToggleSaved}
|
onPress={onToggleSaved}
|
||||||
accessibilityLabel="Add to my feeds"
|
accessibilityLabel="Add to my feeds"
|
||||||
accessibilityHint=""
|
accessibilityHint=""
|
||||||
label="Add to My Feeds"
|
style={styles.headerAddBtn}>
|
||||||
/>
|
<FontAwesomeIcon icon="plus" color={pal.colors.link} size={19} />
|
||||||
|
<Text type="xl-medium" style={pal.link}>
|
||||||
|
Add to My Feeds
|
||||||
|
</Text>
|
||||||
|
</Button>
|
||||||
)}
|
)}
|
||||||
</View>
|
</View>
|
||||||
)
|
)
|
||||||
|
@ -187,7 +191,6 @@ export const CustomFeedScreen = withAuthRequired(
|
||||||
onToggleSaved,
|
onToggleSaved,
|
||||||
onTogglePinned,
|
onTogglePinned,
|
||||||
onToggleLiked,
|
onToggleLiked,
|
||||||
onPressShare,
|
|
||||||
dropdownItems,
|
dropdownItems,
|
||||||
])
|
])
|
||||||
|
|
||||||
|
@ -361,8 +364,13 @@ const styles = StyleSheet.create({
|
||||||
},
|
},
|
||||||
headerBtns: {
|
headerBtns: {
|
||||||
flexDirection: 'row',
|
flexDirection: 'row',
|
||||||
gap: 12,
|
alignItems: 'center',
|
||||||
marginTop: 10,
|
},
|
||||||
|
headerAddBtn: {
|
||||||
|
flexDirection: 'row',
|
||||||
|
alignItems: 'center',
|
||||||
|
gap: 4,
|
||||||
|
paddingLeft: 4,
|
||||||
},
|
},
|
||||||
headerDetails: {
|
headerDetails: {
|
||||||
paddingHorizontal: 16,
|
paddingHorizontal: 16,
|
||||||
|
|
Loading…
Reference in New Issue