minor ui tweaks

app/client/mobile/App.tsx

@@ -46,10 +46,10 @@ const databagColors = {
     elevation: {
       level0: 'rgb(255, 255, 255)',
       level1: 'rgb(240, 240, 240)',
-      level2: 'rgb(225, 225, 225)',
-      level3: 'rgb(210, 210, 210)',
-      level4: 'rgb(180, 180, 180)',
-      level5: 'rgb(160, 160, 160)',
+      level2: 'rgb(232, 232, 232)',
+      level3: 'rgb(216, 216, 216)',
+      level4: 'rgb(208, 208, 208)',
+      level5: 'rgb(200, 200, 200)',
     },
     surfaceDisabled: 'rgba(25, 28, 26, 0.12)',
     onSurfaceDisabled: 'rgba(25, 28, 26, 0.38)',

app/client/mobile/ios/Podfile.lock

@@ -2250,7 +2250,7 @@ SPEC CHECKSUMS:
   SDWebImageWebPCoder: 908b83b6adda48effe7667cd2b7f78c897e5111d
   SocketRocket: abac6f5de4d4d62d24e11868d7a2f427e0ef940d
   TOCropViewController: 80b8985ad794298fb69d3341de183f33d1853654
-  Yoga: b05994d1933f507b0a28ceaa4fdb968dc18da178
+  Yoga: a9ef4f5c2cd79ad812110525ef61048be6a582a4
 
 PODFILE CHECKSUM: 9cf7373afef7b881c911fda82ff1f94eacee3e98
 

app/client/mobile/src/contacts/Contacts.tsx

@@ -76,8 +76,8 @@ export function Contacts({openRegistry, openContact, callContact, textContact}:
                     color={Colors.connected}
                     select={async () => {
                       try {
-console.log(item);
                         await actions.call(item);
+                        callContact(item);
                       } catch (err) {
                         console.log(err);
                         setAlert(true);

app/client/mobile/src/ring/Ring.styled.ts

@@ -20,7 +20,6 @@ export const styles = StyleSheet.create({
     alignItems: 'center',
     width: '100%',
     height: '100%',
-    borderRadius: 16,
     paddingLeft: 16,
     paddingRight: 8,
   },

app/client/mobile/src/ring/Ring.tsx

@@ -106,14 +106,14 @@ export function Ring() {
     const declineButton = <IconButton key="decline" style={styles.flipIcon} iconColor="white" containerColor={Colors.offsync} icon="phone-outline" compact="true" mode="contained" size={24} loading={declining===callId} onPress={()=>decline(callId, card)} />
     const acceptButton = <IconButton key="accept" style={styles.circleIcon} iconColor="white" containerColor={Colors.primary} icon="phone-outline" compact="true" mode="contained" size={24} loading={accepting===callId} onPress={()=>accept(callId, card)} />
     return (
-      <Contact containerStyle={styles.card} placeholder={''} imageUrl={imageUrl} name={name} node={node} handle={handle} actions={[ignoreButton, declineButton, acceptButton]} />
+      <Contact containerStyle={styles.card} placeholder={state.strings.name} imageUrl={imageUrl} name={name} node={node} handle={handle} actions={[ignoreButton, declineButton, acceptButton]} />
     )
   });
 
   return (
     <View style={(accepting || state.calling || state.calls.length > 0) ? styles.active : styles.inactive}>
       { state.calls.length > 0 && !accepting && !state.calling && (
-        <Surface elevation={4} mode="flat" style={styles.ring}>
+        <Surface elevation={4} mode="flat" style={{ ...styles.ring, borderRadius: display.layout === 'large' ? 16 : 0 }}>
           { calls[0] }
         </Surface>
       )}

app/client/mobile/src/ring/useRing.hook.ts

@@ -11,7 +11,8 @@ export function useRing() {
   const offset = useRef(false);
 
   const [state, setState] = useState({
-    strings: display.state.strings, 
+    strings: display.state.strings,
+    layout: display.state.layout,
     calls: [] as { callId: string, card: Card }[],
     calling: null as null | Card,
     remoteVideo: false,
@@ -27,6 +28,11 @@ export function useRing() {
     setState((s) => ({ ...s, ...value }))
   }
 
+  useEffect(() => {
+    const { layout, strings } = display.state;
+    updateState({ layout, strings });
+  }, [display.state]);
+
   useEffect(() => {
     const interval = setInterval(() => {
       if (offset.current) {

app/client/mobile/src/session/Session.tsx

@@ -437,6 +437,10 @@ function SettingsScreen({nav}) {
 }
 
 function HomeScreen({nav}) {
+  useEffect(() => {
+    nav.contacts.closeDrawer();
+  }, [nav.callCard]);
+
   return (
     <View style={styles.frame}>
       <View style={styles.left}>