Tune the empty state visuals

src/view/com/util/EmptyState.tsx

@@ -25,11 +25,13 @@ export function EmptyState({
           <FontAwesomeIcon
             icon={icon}
             size={64}
-            style={[styles.icon, pal.textLight]}
+            style={[styles.icon, {color: pal.colors.emptyStateIcon}]}
           />
         )}
       </View>
-      <Text type="xl" style={[pal.textLight, styles.text]}>
+      <Text
+        type="xl-medium"
+        style={[{color: pal.colors.textVeryLight}, styles.text]}>
         {message}
       </Text>
     </View>
@@ -50,6 +52,6 @@ const styles = StyleSheet.create({
   },
   text: {
     textAlign: 'center',
-    paddingTop: 16,
+    paddingTop: 20,
   },
 })

src/view/lib/themes.ts

@@ -16,12 +16,13 @@ export const defaultTheme: Theme = {
       icon: colors.gray2,
 
       // non-standard
-      actionLabel: colors.gray4,
+      textVeryLight: colors.gray4,
       replyLine: colors.gray2,
       replyLineDot: colors.gray3,
       unreadNotifBg: '#ebf6ff',
       postCtrl: '#71768A',
       brandText: '#0066FF',
+      emptyStateIcon: '#B6B6C9',
     },
     primary: {
       background: colors.blue3,
@@ -259,12 +260,13 @@ export const darkTheme: Theme = {
       icon: colors.gray5,
 
       // non-standard
-      actionLabel: colors.gray3,
+      textVeryLight: colors.gray4,
       replyLine: colors.gray5,
       replyLineDot: colors.gray6,
       unreadNotifBg: colors.blue5,
       postCtrl: '#61657A',
       brandText: '#0085ff',
+      emptyStateIcon: colors.gray4,
     },
     primary: {
       ...defaultTheme.palette.primary,