From bf056cf6228155abac25e91b88a8bed43bae2b70 Mon Sep 17 00:00:00 2001
From: Paul Frazee <pfrazee@gmail.com>
Date: Thu, 25 May 2023 17:09:23 -0500
Subject: [PATCH] Visually unify the home header with other screens

---
 src/lib/styles.ts                        | 3 +++
 src/view/com/pager/FeedsTabBarMobile.tsx | 3 ++-
 src/view/com/pager/TabBar.tsx            | 6 +++---
 src/view/com/util/ViewHeader.tsx         | 2 +-
 src/view/screens/Home.tsx                | 2 +-
 5 files changed, 10 insertions(+), 6 deletions(-)

diff --git a/src/lib/styles.ts b/src/lib/styles.ts
index 07315c9f..fb631c0b 100644
--- a/src/lib/styles.ts
+++ b/src/lib/styles.ts
@@ -52,6 +52,7 @@ export const colors = {
   green5: '#082b03',
 
   unreadNotifBg: '#ebf6ff',
+  brandBlue: '#0066FF',
 }
 
 export const gradients = {
@@ -218,6 +219,8 @@ export const s = StyleSheet.create({
   green3: {color: colors.green3},
   green4: {color: colors.green4},
   green5: {color: colors.green5},
+
+  brandBlue: {color: colors.brandBlue},
 })
 
 export function lh(
diff --git a/src/view/com/pager/FeedsTabBarMobile.tsx b/src/view/com/pager/FeedsTabBarMobile.tsx
index 333feb31..574265eb 100644
--- a/src/view/com/pager/FeedsTabBarMobile.tsx
+++ b/src/view/com/pager/FeedsTabBarMobile.tsx
@@ -59,7 +59,7 @@ export const FeedsTabBar = observer(
               />
             </TouchableOpacity>
           </View>
-          <Text type="title" style={[pal.link, s.bold]}>
+          <Text type="title-lg" style={[s.brandBlue, s.bold]}>
             Bluesky
           </Text>
           <View style={[pal.view]}>
@@ -104,6 +104,7 @@ const styles = StyleSheet.create({
     justifyContent: 'space-between',
     alignItems: 'center',
     paddingHorizontal: 18,
+    paddingTop: 8,
     paddingBottom: 2,
     width: '100%',
   },
diff --git a/src/view/com/pager/TabBar.tsx b/src/view/com/pager/TabBar.tsx
index ec636d05..50194147 100644
--- a/src/view/com/pager/TabBar.tsx
+++ b/src/view/com/pager/TabBar.tsx
@@ -131,14 +131,14 @@ const styles = isDesktopWeb
         backgroundColor: 'transparent',
       },
       contentContainer: {
-        columnGap: 14,
+        columnGap: 16,
         marginLeft: 14,
         paddingRight: 28,
         backgroundColor: 'transparent',
       },
       item: {
-        paddingTop: 8,
-        paddingBottom: 8,
+        paddingTop: 10,
+        paddingBottom: 10,
         borderBottomWidth: 3,
         borderBottomColor: 'transparent',
       },
diff --git a/src/view/com/util/ViewHeader.tsx b/src/view/com/util/ViewHeader.tsx
index bb60ba68..cdbd555b 100644
--- a/src/view/com/util/ViewHeader.tsx
+++ b/src/view/com/util/ViewHeader.tsx
@@ -77,7 +77,7 @@ export const ViewHeader = observer(function ({
             <FontAwesomeIcon
               size={18}
               icon="bars"
-              style={[styles.backIcon, pal.icon]}
+              style={[styles.backIcon, pal.textLight]}
             />
           )}
         </TouchableOpacity>
diff --git a/src/view/screens/Home.tsx b/src/view/screens/Home.tsx
index 3d443041..9057b3fc 100644
--- a/src/view/screens/Home.tsx
+++ b/src/view/screens/Home.tsx
@@ -23,7 +23,7 @@ import {useAnalytics} from 'lib/analytics'
 import {ComposeIcon2} from 'lib/icons'
 import {isDesktopWeb} from 'platform/detection'
 
-const HEADER_OFFSET = isDesktopWeb ? 50 : 64
+const HEADER_OFFSET = isDesktopWeb ? 50 : 78
 const POLL_FREQ = 30e3 // 30sec
 
 type Props = NativeStackScreenProps<HomeTabNavigatorParams, 'Home'>