lightbox header/footer: Make icons smaller.

As Greg points out [1], 24px seems to be the standard size for most
icon buttons in Material Design [2] [3] [4].

[1] zulip#4442 (comment)
[2] https://material.io/components/bottom-navigation#specs
[3] https://material.io/components/app-bars-bottom#specs
[4] https://material.io/design/iconography/system-icons.html#grid-and-keyline-shapes

Author: chrisbobbe

src/lightbox/LightboxFooter.js

@@ -38,9 +38,9 @@ export default class LightboxFooter extends PureComponent<Props> {
       <SafeAreaView mode="padding" edges={['right', 'bottom', 'left']}>
         <View style={[styles.wrapper, style]}>
           <Text style={styles.text}>{displayMessage}</Text>
-          <Pressable style={styles.iconTouchTarget} onPress={onOptionsPress} hitSlop={10}>
+          <Pressable style={styles.iconTouchTarget} onPress={onOptionsPress} hitSlop={12}>
             {({ pressed }) => (
-              <Icon size={28} color={pressed ? 'gray' : 'white'} name="more-vertical" />
+              <Icon size={24} color={pressed ? 'gray' : 'white'} name="more-vertical" />
             )}
           </Pressable>
         </View>

src/lightbox/LightboxHeader.js

@@ -70,8 +70,8 @@ export default class LightboxHeader extends PureComponent<Props> {
               {subheader}
             </Text>
           </View>
-          <Pressable style={styles.rightIconTouchTarget} onPress={onPressBack} hitSlop={10}>
-            {({ pressed }) => <Icon size={28} color={pressed ? 'gray' : 'white'} name="x" />}
+          <Pressable style={styles.rightIconTouchTarget} onPress={onPressBack} hitSlop={12}>
+            {({ pressed }) => <Icon size={24} color={pressed ? 'gray' : 'white'} name="x" />}
           </Pressable>
         </View>
       </SafeAreaView>