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

Aesthetic improvements

zio/stable
Paul Frazee 2022-08-31 20:09:47 -05:00
parent b4802c6b5b
commit 4aa8a58f27
10 changed files with 57 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
src/view/com/feed/FeedItem.tsx
View File

@ -81,8 +81,9 @@ export const FeedItem = observer(function FeedItem({
<FontAwesomeIcon
style={styles.ctrlIcon}
icon={['far', 'comment']}
size={14}
/>
<Text>{item.replyCount}</Text>
<Text style={s.f13}>{item.replyCount}</Text>
</TouchableOpacity>
<TouchableOpacity style={styles.ctrl} onPress={onPressToggleRepost}>
<FontAwesomeIcon
@ -92,11 +93,11 @@ export const FeedItem = observer(function FeedItem({
: styles.ctrlIcon
}
icon="retweet"
size={22}
size={18}
/>
<Text
style={
item.myState.hasReposted ? [s.bold, s.green3] : undefined
item.myState.hasReposted ? [s.bold, s.green3, s.f13] : s.f13
}>
{item.repostCount}
</Text>
@ -107,9 +108,10 @@ export const FeedItem = observer(function FeedItem({
item.myState.hasLiked ? styles.ctrlIconLiked : styles.ctrlIcon
}
icon={[item.myState.hasLiked ? 'fas' : 'far', 'heart']}
size={14}
/>
<Text
style={item.myState.hasLiked ? [s.bold, s.pink3] : undefined}>
style={item.myState.hasLiked ? [s.bold, s.red3, s.f13] : s.f13}>
{item.likeCount}
</Text>
</TouchableOpacity>
@ -119,6 +121,7 @@ export const FeedItem = observer(function FeedItem({
<FontAwesomeIcon
style={styles.ctrlIcon}
icon="share-from-square"
size={14}
/>
</TouchableOpacity>
</View>
@ -140,7 +143,7 @@ const styles = StyleSheet.create({
},
repostedBy: {
flexDirection: 'row',
paddingLeft: 70,
paddingLeft: 60,
},
repostedByIcon: {
marginRight: 2,
@ -150,12 +153,13 @@ const styles = StyleSheet.create({
flexDirection: 'row',
},
layoutAvi: {
width: 70,
width: 60,
paddingTop: 5,
},
avi: {
width: 60,
height: 60,
borderRadius: 30,
width: 50,
height: 50,
borderRadius: 25,
resizeMode: 'cover',
},
layoutContent: {
@ -164,7 +168,7 @@ const styles = StyleSheet.create({
meta: {
flexDirection: 'row',
paddingTop: 2,
paddingBottom: 4,
paddingBottom: 2,
},
metaItem: {
paddingRight: 5,
@ -193,6 +197,6 @@ const styles = StyleSheet.create({
},
ctrlIconLiked: {
marginRight: 5,
color: colors.pink3,
color: colors.red3,
},
})

2
src/view/com/notifications/FeedItem.tsx
View File

@ -115,7 +115,7 @@ const styles = StyleSheet.create({
meta: {
flexDirection: 'row',
paddingTop: 6,
paddingBottom: 4,
paddingBottom: 2,
},
metaItem: {
paddingRight: 3,

2
src/view/com/post-thread/PostLikedBy.tsx
View File

@ -112,7 +112,7 @@ const styles = StyleSheet.create({
avi: {
width: 40,
height: 40,
borderRadius: 30,
borderRadius: 20,
resizeMode: 'cover',
},
layoutContent: {

2
src/view/com/post-thread/PostRepostedBy.tsx
View File

@ -118,7 +118,7 @@ const styles = StyleSheet.create({
avi: {
width: 40,
height: 40,
borderRadius: 30,
borderRadius: 20,
resizeMode: 'cover',
},
layoutContent: {

23
src/view/com/post-thread/PostThreadItem.tsx
View File

@ -129,8 +129,9 @@ export const PostThreadItem = observer(function PostThreadItem({
<FontAwesomeIcon
style={styles.ctrlIcon}
icon={['far', 'comment']}
size={14}
/>
<Text>{item.replyCount}</Text>
<Text style={s.f13}>{item.replyCount}</Text>
</TouchableOpacity>
<TouchableOpacity style={styles.ctrl} onPress={onPressToggleRepost}>
<FontAwesomeIcon
@ -140,11 +141,11 @@ export const PostThreadItem = observer(function PostThreadItem({
: styles.ctrlIcon
}
icon="retweet"
size={22}
size={18}
/>
<Text
style={
item.myState.hasReposted ? [s.bold, s.green3] : undefined
item.myState.hasReposted ? [s.bold, s.green3, s.f13] : s.f13
}>
{item.repostCount}
</Text>
@ -155,9 +156,10 @@ export const PostThreadItem = observer(function PostThreadItem({
item.myState.hasLiked ? styles.ctrlIconLiked : styles.ctrlIcon
}
icon={[item.myState.hasLiked ? 'fas' : 'far', 'heart']}
size={14}
/>
<Text
style={item.myState.hasLiked ? [s.bold, s.pink3] : undefined}>
style={item.myState.hasLiked ? [s.bold, s.red3, s.f13] : s.f13}>
{item.likeCount}
</Text>
</TouchableOpacity>
@ -167,6 +169,7 @@ export const PostThreadItem = observer(function PostThreadItem({
<FontAwesomeIcon
style={styles.ctrlIcon}
icon="share-from-square"
size={14}
/>
</TouchableOpacity>
</View>
@ -190,15 +193,15 @@ const styles = StyleSheet.create({
marginRight: 2,
},
layoutAvi: {
width: 80,
width: 70,
paddingLeft: 10,
paddingTop: 10,
paddingBottom: 10,
},
avi: {
width: 60,
height: 60,
borderRadius: 30,
width: 50,
height: 50,
borderRadius: 25,
resizeMode: 'cover',
},
layoutContent: {
@ -210,7 +213,7 @@ const styles = StyleSheet.create({
meta: {
flexDirection: 'row',
paddingTop: 2,
paddingBottom: 4,
paddingBottom: 2,
},
metaItem: {
paddingRight: 5,
@ -251,6 +254,6 @@ const styles = StyleSheet.create({
},
ctrlIconLiked: {
marginRight: 5,
color: colors.pink3,
color: colors.red3,
},
})

14
src/view/com/post/Post.tsx
View File

@ -136,7 +136,7 @@ export const Post = observer(function Post({uri}: {uri: string}) {
icon={[item.myState.hasLiked ? 'fas' : 'far', 'heart']}
/>
<Text
style={item.myState.hasLiked ? [s.bold, s.pink3] : undefined}>
style={item.myState.hasLiked ? [s.bold, s.red3] : undefined}>
{item.likeCount}
</Text>
</TouchableOpacity>
@ -164,12 +164,12 @@ const styles = StyleSheet.create({
flexDirection: 'row',
},
layoutAvi: {
width: 70,
width: 60,
},
avi: {
width: 60,
height: 60,
borderRadius: 30,
width: 50,
height: 50,
borderRadius: 25,
resizeMode: 'cover',
},
layoutContent: {
@ -178,7 +178,7 @@ const styles = StyleSheet.create({
meta: {
flexDirection: 'row',
paddingTop: 2,
paddingBottom: 4,
paddingBottom: 2,
},
metaItem: {
paddingRight: 5,
@ -206,6 +206,6 @@ const styles = StyleSheet.create({
},
ctrlIconLiked: {
marginRight: 5,
color: colors.pink3,
color: colors.red3,
},
})

2
src/view/com/profile/ProfileFollowers.tsx
View File

@ -116,7 +116,7 @@ const styles = StyleSheet.create({
avi: {
width: 40,
height: 40,
borderRadius: 30,
borderRadius: 20,
resizeMode: 'cover',
},
layoutContent: {

2
src/view/com/profile/ProfileFollows.tsx
View File

@ -116,7 +116,7 @@ const styles = StyleSheet.create({
avi: {
width: 40,
height: 40,
borderRadius: 30,
borderRadius: 20,
resizeMode: 'cover',
},
layoutContent: {

16
src/view/lib/styles.ts
View File

@ -17,6 +17,12 @@ export const colors = {
blue4: '#0062bd',
blue5: '#034581',
red1: '#ffe6f2',
red2: '#fba2ce',
red3: '#ec4899',
red4: '#d1106f',
red5: '#97074e',
pink1: '#f8ccff',
pink2: '#e966ff',
pink3: '#db00ff',
@ -36,6 +42,10 @@ export const colors = {
green5: '#082b03',
}
export const gradients = {
primary: {start: '#db00ff', end: '#ff007a'},
}
export const s = StyleSheet.create({
// font weights
fw600: {fontWeight: '600'},
@ -128,6 +138,12 @@ export const s = StyleSheet.create({
blue4: {color: colors.blue4},
blue5: {color: colors.blue5},
red1: {color: colors.red1},
red2: {color: colors.red2},
red3: {color: colors.red3},
red4: {color: colors.red4},
red5: {color: colors.red5},
pink1: {color: colors.pink1},
pink2: {color: colors.pink2},
pink3: {color: colors.pink3},

1
src/view/shell/mobile/history-menu.tsx
View File

@ -36,6 +36,7 @@ export function createBackMenu(tab: NavigationTabModel): RootSiblings {
)
return sibling
}
export function createForwardMenu(tab: NavigationTabModel): RootSiblings {
const onPressItem = (index: number) => {
sibling.destroy()