From 244b06c19d57901b1fee04a742396f6c360339d9 Mon Sep 17 00:00:00 2001
From: Paul Frazee <pfrazee@gmail.com>
Date: Thu, 16 Mar 2023 22:02:44 -0500
Subject: [PATCH] Visual tune-up

---
 src/view/com/util/PostMeta.tsx |  2 +-
 src/view/com/util/TabBar.tsx   | 10 ++++------
 src/view/screens/Home.tsx      |  6 ++++--
 3 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/src/view/com/util/PostMeta.tsx b/src/view/com/util/PostMeta.tsx
index 3f9e6935f4..1a36a72e82 100644
--- a/src/view/com/util/PostMeta.tsx
+++ b/src/view/com/util/PostMeta.tsx
@@ -136,7 +136,7 @@ const styles = StyleSheet.create({
     alignItems: 'center',
     justifyContent: 'space-between',
     width: '100%',
-    paddingBottom: 2,
+    paddingBottom: 4,
   },
   metaTwoLineLeft: {
     flex: 1,
diff --git a/src/view/com/util/TabBar.tsx b/src/view/com/util/TabBar.tsx
index d9f48577c9..666ad58112 100644
--- a/src/view/com/util/TabBar.tsx
+++ b/src/view/com/util/TabBar.tsx
@@ -78,9 +78,7 @@ export function TabBar({
         return (
           <TouchableWithoutFeedback key={i} onPress={() => onPressItem(i)}>
             <View style={styles.item} ref={itemRefs[i]}>
-              <Text
-                type="xl-medium"
-                style={selected ? pal.text : pal.textLight}>
+              <Text type="xl-bold" style={selected ? pal.text : pal.textLight}>
                 {item}
               </Text>
             </View>
@@ -97,14 +95,14 @@ const styles = StyleSheet.create({
     paddingHorizontal: 14,
   },
   item: {
-    paddingTop: 6,
-    paddingBottom: 14,
+    paddingTop: 8,
+    paddingBottom: 12,
     marginRight: 24,
   },
   underline: {
     position: 'absolute',
     height: 3,
-    bottom: 0,
+    bottom: -1,
     borderRadius: 4,
   },
 })
diff --git a/src/view/screens/Home.tsx b/src/view/screens/Home.tsx
index fa200e931a..b38e1cc367 100644
--- a/src/view/screens/Home.tsx
+++ b/src/view/screens/Home.tsx
@@ -58,11 +58,11 @@ export const HomeScreen = withAuthRequired((_opts: Props) => {
   const renderTabBar = React.useCallback(
     (props: TabBarProps) => {
       return (
-        <View style={[pal.view, styles.tabBar]}>
+        <View style={[pal.view, pal.border, styles.tabBar]}>
           <TouchableOpacity style={styles.tabBarAvi} onPress={onPressAvi}>
             <UserAvatar avatar={store.me.avatar} size={32} />
           </TouchableOpacity>
-          <TabBar items={['Popular', 'Following']} {...props} />
+          <TabBar items={['Suggested', 'Following']} {...props} />
         </View>
       )
     },
@@ -273,8 +273,10 @@ const styles = StyleSheet.create({
     flexDirection: 'row',
     alignItems: 'center',
     paddingHorizontal: 18,
+    borderBottomWidth: 1,
   },
   tabBarAvi: {
     marginRight: 16,
+    paddingBottom: 2,
   },
 })