nicer design for settings screen

2025-12-05 14:17:38 +02:00
parent 7dcd435ae4
commit 2b817c8aff
3 changed files with 97 additions and 51 deletions
@@ -0,0 +1,33 @@
+import {View} from 'react-native'
+import {Image} from 'expo-image'
+import {msg} from '@lingui/macro'
+import {useLingui} from '@lingui/react'
+
+import {atoms as a, useTheme} from '#/alf'
+
+export function ContactsHeroImage() {
+  const t = useTheme()
+  const {_} = useLingui()
+
+  return (
+    <View
+      style={[
+        a.w_full,
+        a.pl_3xl,
+        a.pr_2xl,
+        a.pt_4xl,
+        a.pb_3xl,
+        a.rounded_lg,
+        {backgroundColor: t.palette.primary_50},
+      ]}>
+      <Image
+        source={require('../../../../assets/images/find_friends_illustration.webp')}
+        accessibilityIgnoresInvertColors
+        style={[a.w_full, {aspectRatio: 1278 / 661}]}
+        alt={_(
+          msg`An illustration depicting user avatars flowing from a contact book into the Bluesky app`,
+        )}
+      />
+    </View>
+  )
+}