1888 signuplogin images are too small and pixelated (#1909)

* replace signup and login images and logo

* images

* Update photos

* Updated photos to higher quality, updated launch screen photo

* deleted old images

ios/Launch Screen.storyboard

@@ -0,0 +1,48 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<document type="com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB" version="3.0" toolsVersion="13142" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" launchScreen="YES" useTraitCollections="YES" useSafeAreas="YES" colorMatched="YES" initialViewController="01J-lp-oVM">
+    <dependencies>
+        <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="12042"/>
+        <capability name="Constraints with non-1.0 multipliers" minToolsVersion="5.1"/>
+        <capability name="Safe area layout guides" minToolsVersion="9.0"/>
+        <capability name="documents saved in the Xcode 8 format" minToolsVersion="8.0"/>
+    </dependencies>
+    <scenes>
+        <!--View Controller-->
+        <scene sceneID="EHf-IW-A2E">
+            <objects>
+                <viewController id="01J-lp-oVM" sceneMemberID="viewController">
+                    <view key="view" contentMode="scaleToFill" id="Ze5-6b-2t3">
+                        <rect key="frame" x="0.0" y="0.0" width="375" height="667"/>
+                        <autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
+                        <subviews>
+                            <label opaque="NO" clipsSubviews="YES" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="" textAlignment="center" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" minimumFontSize="9" translatesAutoresizingMaskIntoConstraints="NO" id="obG-Y5-kRd">
+                                <rect key="frame" x="0.0" y="626.5" width="375" height="20.5"/>
+                                <fontDescription key="fontDescription" type="system" pointSize="17"/>
+                                <color key="textColor" red="0.0" green="0.0" blue="0.0" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
+                                <nil key="highlightedColor"/>
+                            </label>
+                            <label opaque="NO" clipsSubviews="YES" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="iNaturalistReactNative" textAlignment="center" lineBreakMode="middleTruncation" baselineAdjustment="alignBaselines" minimumFontSize="18" translatesAutoresizingMaskIntoConstraints="NO" id="GJd-Yh-RWb">
+                                <rect key="frame" x="0.0" y="202" width="375" height="43"/>
+                                <fontDescription key="fontDescription" type="boldSystem" pointSize="36"/>
+                                <color key="textColor" red="0.0" green="0.0" blue="0.0" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
+                                <nil key="highlightedColor"/>
+                            </label>
+                        </subviews>
+                        <color key="backgroundColor" red="1" green="1" blue="1" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
+                        <constraints>
+                            <constraint firstItem="Bcu-3y-fUS" firstAttribute="centerX" secondItem="obG-Y5-kRd" secondAttribute="centerX" id="5cz-MP-9tL"/>
+                            <constraint firstItem="Bcu-3y-fUS" firstAttribute="centerX" secondItem="GJd-Yh-RWb" secondAttribute="centerX" id="Q3B-4B-g5h"/>
+                            <constraint firstItem="obG-Y5-kRd" firstAttribute="leading" secondItem="Bcu-3y-fUS" secondAttribute="leading" constant="20" symbolic="YES" id="SfN-ll-jLj"/>
+                            <constraint firstAttribute="bottom" secondItem="obG-Y5-kRd" secondAttribute="bottom" constant="20" id="Y44-ml-fuU"/>
+                            <constraint firstItem="GJd-Yh-RWb" firstAttribute="centerY" secondItem="Ze5-6b-2t3" secondAttribute="bottom" multiplier="1/3" constant="1" id="moa-c2-u7t"/>
+                            <constraint firstItem="GJd-Yh-RWb" firstAttribute="leading" secondItem="Bcu-3y-fUS" secondAttribute="leading" constant="20" symbolic="YES" id="x7j-FC-K8j"/>
+                        </constraints>
+                        <viewLayoutGuide key="safeArea" id="Bcu-3y-fUS"/>
+                    </view>
+                </viewController>
+                <placeholder placeholderIdentifier="IBFirstResponder" id="iYj-Kq-Ea1" userLabel="First Responder" sceneMemberID="firstResponder"/>
+            </objects>
+            <point key="canvasLocation" x="53" y="375"/>
+        </scene>
+    </scenes>
+</document>

ios/iNaturalistReactNative/Images.xcassets/splash.imageset/Contents.json

@@ -0,0 +1,33 @@
+{
+  "images" : [
+    {
+      "filename" : "splash-1.jpg",
+      "idiom" : "universal",
+      "scale" : "1x"
+    },
+    {
+      "filename" : "splash-2.jpg",
+      "idiom" : "universal",
+      "scale" : "2x"
+    },
+    {
+      "filename" : "splash-3.jpg",
+      "idiom" : "universal",
+      "scale" : "3x"
+    },
+    {
+      "filename" : "splash-3 1.jpg",
+      "idiom" : "ipad",
+      "scale" : "1x"
+    },
+    {
+      "filename" : "splash-4.jpg",
+      "idiom" : "ipad",
+      "scale" : "2x"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}

ios/iNaturalistReactNative/LaunchScreen.storyboard

@@ -3,7 +3,7 @@
     <device id="ipad7_9" orientation="portrait" layout="fullscreen" appearance="light"/>
     <dependencies>
         <deployment identifier="iOS"/>
-        <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="22684"/>
+        <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="22685"/>
         <capability name="Safe area layout guides" minToolsVersion="9.0"/>
         <capability name="documents saved in the Xcode 8 format" minToolsVersion="8.0"/>
     </dependencies>
@@ -16,7 +16,7 @@
                         <rect key="frame" x="0.0" y="0.0" width="744" height="1133"/>
                         <autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
                         <subviews>
-                            <imageView clipsSubviews="YES" userInteractionEnabled="NO" contentMode="scaleAspectFill" horizontalHuggingPriority="251" verticalHuggingPriority="251" ambiguous="YES" image="daniel-olah-YNUFtf4qyh0-unsplash-320-20" id="eUZ-ZU-PYF">
+                            <imageView clipsSubviews="YES" userInteractionEnabled="NO" contentMode="scaleAspectFill" horizontalHuggingPriority="251" verticalHuggingPriority="251" ambiguous="YES" image="splash" id="eUZ-ZU-PYF">
                                 <rect key="frame" x="0.0" y="0.0" width="744" height="1133"/>
                                 <autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
                             </imageView>
@@ -41,7 +41,7 @@
         </scene>
     </scenes>
     <resources>
-        <image name="daniel-olah-YNUFtf4qyh0-unsplash-320-20" width="512" height="910.5"/>
+        <image name="splash" width="512" height="910"/>
         <image name="white-bird" width="108" height="108"/>
     </resources>
 </document>

src/components/Camera/CameraWithDevice.tsx

@@ -172,7 +172,7 @@ const CameraWithDevice = ( {
         body={t( "iNaturalist-can-save-photos-you-take-in-the-app-to-your-devices-gallery" )}
         buttonText={t( "SAVE-PHOTOS" )}
         icon="gallery"
-        image={require( "images/birger-strahl-ksiGE4hMiso-unsplash.jpg" )}
+        image={require( "images/background/birger-strahl-ksiGE4hMiso-unsplash.jpg" )}
         onModalHide={( ) => setAddPhotoPermissionGateWasClosed( true )}
         onPermissionGranted={onPhotoPermissionGranted}
         onPermissionDenied={onPhotoPermissionDenied}

src/components/LoginSignUp/ForgotPassword.js

@@ -31,7 +31,7 @@ const ForgotPassword = ( ): Node => {
 
   return (
     <TouchableWithoutFeedback accessibilityRole="button" onPress={blurFields}>
-      <LoginSignUpWrapper backgroundSource={require( "images/butterfly.png" )}>
+      <LoginSignUpWrapper backgroundSource={require( "images/background/butterfly.jpg" )}>
         {showSheet && (
           <WarningSheet
             handleClose={( ) => setShowSheet( false )}

src/components/LoginSignUp/Header.js

@@ -1,9 +1,8 @@
 // @flow
 
 import { Body1 } from "components/SharedComponents";
-import {
-  Image, View
-} from "components/styledComponents";
+import { View } from "components/styledComponents";
+import INaturalistLogo from "images/svg/inaturalist-white.svg";
 import type { Node } from "react";
 import React from "react";
 
@@ -14,14 +13,14 @@ type Props = {
 
 const Header = ( { headerText, hideHeader }: Props ): Node => {
   if ( hideHeader ) { return null; }
+
+  const renderLogo = ( ) => (
+    // $FlowIgnore[not-a-component]
+    <INaturalistLogo width="234" height="43" />
+  );
   return (
     <View className="w-full items-center shrink">
-      <Image
-        className="w-[234px] h-[43px]"
-        resizeMode="contain"
-        source={require( "images/inaturalist.png" )}
-        accessibilityIgnoresInvertColors
-      />
+      {renderLogo()}
       {headerText && (
         <Body1 className="text-center color-white mt-[24px] max-w-[280px]">
           {headerText}

src/components/LoginSignUp/LicensePhotos.js

@@ -10,7 +10,7 @@ import LicensePhotosForm from "./LicensePhotosForm";
 import LoginSignUpWrapper from "./LoginSignUpWrapper";
 
 const LicensePhotos = ( ): Node => (
-  <LoginSignUpWrapper backgroundSource={require( "images/plants.png" )}>
+  <LoginSignUpWrapper backgroundSource={require( "images/background/plants.jpg" )}>
     <ScrollView
       keyboardShouldPersistTaps="always"
     >

src/components/LoginSignUp/Login.tsx

@@ -34,7 +34,7 @@ const Login = ( ) => {
 
   return (
     <LoginSignUpWrapper
-      backgroundSource={require( "images/toucan.png" )}
+      backgroundSource={require( "images/background/toucan.jpg" )}
       keyboardVerticalOffset={keyboardVerticalOffset}
     >
       {renderLoginForm( )}

src/components/LoginSignUp/SignUp.js

@@ -24,7 +24,7 @@ const SignUp = ( ): Node => {
 
   return (
     <LoginSignUpWrapper
-      backgroundSource={require( "images/frog.png" )}
+      backgroundSource={require( "images/background/birger-strahl-ksiGE4hMiso-unsplash.jpg" )}
       keyboardVerticalOffset={keyboardVerticalOffset}
     >
       <Header

src/components/LoginSignUp/SignUpConfirmation.js

@@ -20,7 +20,7 @@ const SignUpConfirmation = ( ): Node => {
   const navigation = useNavigation( );
 
   return (
-    <LoginSignUpWrapper backgroundSource={require( "images/pink_flower.png" )}>
+    <LoginSignUpWrapper backgroundSource={require( "images/background/pink_flower.jpg" )}>
       <View className="flex-1 justify-between">
         <Header />
         <View className="px-4">

src/components/SharedComponents/LocationPermissionGate.tsx

@@ -31,7 +31,7 @@ const LocationPermissionGate = ( {
     blockedPrompt={t( "Youve-previously-denied-location-permissions" )}
     buttonText={t( "USE-LOCATION" )}
     icon="map-marker-outline"
-    image={require( "images/landon-parenteau-EEuDMqRYbx0-unsplash.jpg" )}
+    image={require( "images/background/landon-parenteau-EEuDMqRYbx0-unsplash.jpg" )}
     permissionNeeded={permissionNeeded}
     onModalHide={onModalHide}
     onPermissionGranted={onPermissionGranted}

src/components/SharedComponents/PermissionGate.tsx

@@ -53,7 +53,7 @@ const PermissionGate = ( {
   body2,
   blockedPrompt = t( "Youve-denied-permission-prompt" ),
   buttonText = t( "GRANT-PERMISSION" ),
-  image = require( "images/bart-zimny-W5XTTLpk1-I-unsplash.jpg" ),
+  image = require( "images/background/bart-zimny-W5XTTLpk1-I-unsplash.jpg" ),
   onClose,
   testID
 }: Props ) => (

src/navigation/StackNavigators/NoBottomTabStackNavigator.js

@@ -79,7 +79,7 @@ const GalleryContainerWithPermission = ( ) => (
     blockedPrompt={t( "Youve-previously-denied-gallery-permissions" )}
     buttonText={t( "CHOOSE-PHOTOS" )}
     icon="gallery"
-    image={require( "images/viviana-rishe-j2330n6bg3I-unsplash.jpg" )}
+    image={require( "images/background/viviana-rishe-j2330n6bg3I-unsplash.jpg" )}
   >
     <PhotoGallery />
   </PermissionGateContainer>
@@ -95,7 +95,7 @@ const SoundRecorderWithPermission = ( ) => (
       blockedPrompt={t( "Youve-previously-denied-microphone-permissions" )}
       buttonText={t( "RECORD-SOUND" )}
       icon="microphone"
-      image={require( "images/azmaan-baluch-_ra6NcejHVs-unsplash.jpg" )}
+      image={require( "images/background/azmaan-baluch-_ra6NcejHVs-unsplash.jpg" )}
     >
       <SoundRecorder />
     </PermissionGateContainer>