Clean up header. Add theme.

constants/Colors.ts

@@ -1,26 +1,32 @@
-/**
- * Below are the colors that are used in the app. The colors are defined in the light and dark mode.
- * There are many other ways to style your app. For example, [Nativewind](https://www.nativewind.dev/), [Tamagui](https://tamagui.dev/), [unistyles](https://reactnativeunistyles.vercel.app), etc.
- */
-
-const tintColorLight = '#0a7ea4';
-const tintColorDark = '#fff';
+const black = '#1f1e2c';
+const white = '#ECEDEE'
+const darkTint = '#fff';
+const lightTint = '#0a7ea4';
+const darkIcon = '#9BA1A6';
+const lightIcon = '#687076';
+const ttBlue = '#4d5eae';
+const ttDarkBlue = '#2e2f3d';
+const ttLightBlue = '#c8d0d7';
 
 export const Colors = {
   light: {
-    text: '#11181C',
-    background: '#fff',
-    tint: tintColorLight,
-    icon: '#687076',
-    tabIconDefault: '#687076',
-    tabIconSelected: tintColorLight,
+    text: black,
+    background: white,
+    tint: lightTint,
+    icon: lightIcon,
+    tabIconDefault: lightIcon,
+    tabIconSelected: lightTint,
+    ttBlue,
+    accent: ttLightBlue,
   },
   dark: {
-    text: '#ECEDEE',
-    background: '#151718',
-    tint: tintColorDark,
-    icon: '#9BA1A6',
-    tabIconDefault: '#9BA1A6',
-    tabIconSelected: tintColorDark,
+    text: white,
+    background: black,
+    tint: darkTint,
+    icon: darkIcon,
+    tabIconDefault: darkIcon,
+    tabIconSelected: darkTint,
+    ttBlue,
+    accent: ttDarkBlue,
   },
 };