update docs & makefile for iPhone 13 (#17784)

The design team has now decided to keep iPhone 13 as the baseline standard instead of iPhone 11 Pro.

This commit updates the docs on pixel perfection and starting guide.
We also update the default simulator to iPhone 13 for `make run-ios`

Makefile

@@ -278,7 +278,7 @@ run-android: export ANDROID_ABI_INCLUDE ?= $(shell ./scripts/adb_devices_abis.sh
 run-android: ##@run Build Android APK and start it on the device
 	npx react-native run-android --appIdSuffix debug
 
-SIMULATOR=iPhone 11 Pro
+SIMULATOR=iPhone 13
 run-ios: export TARGET := ios
 run-ios: export IOS_STATUS_GO_TARGETS := iossimulator/amd64
 run-ios: ##@run Build iOS app and start it in a simulator/device

doc/pixel-perfection.md

@@ -1,16 +1,22 @@
 # Pixel Perfection
 The Status Mobile team aims to align the design implementation perfectly according to a given screens respective Figma design spec.
 
-Currently the Figma Designs match up with an "iPhone 11 Pro" screen size. 
+Currently, the Figma Designs match up with both "iPhone 11 Pro" and "iPhone 13" screen size.
+
+The Dimension reference for iPhone 11 Pro is 375 x 812 (width x height) and for iPhone 13 is 390 x 844.
 
 To test your implementation is correct you can take the following steps
 
 - Open a new Figma file so that you have write privileges. 
+
 - Copy in the component or screen from the Figma file.
 
-- Using the "iPhone 11 Pro" simulator (it is the default now) you take a screenshot of your component and paste it into your Figma file.
+- Using the "iPhone 11 Pro" or the "iPhone 13" simulator (it is the default now) you take a screenshot of your component and paste it into your Figma file.
+
+- To get the right size, set your screenshot to width according to your simulator: 
+  - for iPhone 13 set 390
+  - for iPhone 11 Pro set 375
 
-- To get the right size, set your screenshot to width 375px
 
 ![](images/pixel-perfection/layer-width.png)
 

doc/starting-guide.md

@@ -30,23 +30,23 @@ You need to have an emulator like [AVD](https://developer.android.com/studio/run
 
 #### Running on a simulator
 
-We highly recommend using the `iPhone 11 Pro` simulator as its screen dimensions match with our design.
+We highly recommend using either the `iPhone 11 Pro` or `iPhone 13` simulator as its screen dimensions match with our design.
 
-If you have Xcode `v12.x` (and above) installed in your system, you need to follow the below steps to add `iPhone 11 Pro` simulator:
+If you have Xcode `v12.x` (and above) installed in your system, you need to follow the below steps to add `iPhone 13` simulator:
 
 1. Open Xcode
 2. Menu `>` Window `>` Devices and Simulators
 3. Tap `+` button on bottom left
-4. Select **Device Type** as `iPhone 11 Pro`
+4. Select **Device Type** as `iPhone 13`
 5. Leave the **Simulator Name** empty and tap on **Create**
 
 ##### NOTE ⚠️
 
-Running `make run-ios` will target `iPhone 11 Pro` by default.
+Running `make run-ios` will target `iPhone 13` by default.
 
 If you need to run on any other simulator, you can specify the simulator type by adding the `SIMULATOR` flag:
 ```sh
-make run-ios SIMULATOR="iPhone 11 Pro"
+make run-ios SIMULATOR="iPhone 13"
 ```
 
 #### Running on a physical device