[HOLD facebook/react-native#37397][$1000] Back ticks aren't centered vertically

[mvtglobally]

If you haven’t already, check out our contributing guidelines for onboarding and email contributors@expensify.com to request to join our Slack channel!

---

Action Performed:

1. Send few messages with back ticks

Expected Result:

Back ticks should be centered vertically

Actual Result:

Back ticks aren't centered vertically

Workaround:

unknown

Platform:

Where is this issue occurring?

• iOS

Version Number: 1.1.42-2 Reproducible in staging?: Y Reproducible in production?: Y Email or phone of affected tester (no customers): Logs: https://stackoverflow.com/c/expensify/questions/4856 Notes/Photos/Videos: Any additional supporting documentation

Expensify/Expensify Issue URL: Issue reported by: @AndrewGable Slack conversation: https://expensify.slack.com/archives/C01GTK53T8Q/p1646420349264159 Upwork: https://www.upwork.com/jobs/~01be27e71047382c31

View all open jobs on GitHub

[MelvinBot]

Triggered auto assignment to @stitesExpensify (Engineering), see https://stackoverflow.com/c/expensify/questions/4319 for more details.

[MelvinBot]

Triggered auto assignment to @mallenexpensify (External), see https://stackoverflow.com/c/expensify/questions/8582 for more details.

[MelvinBot]

Triggered auto assignment to Contributor-plus team member for initial proposal review - @Santhosh-Sellavel (Exported)

[MelvinBot]

Current assignee @stitesExpensify is eligible for the Exported assigner, not assigning anyone new.

[mallenexpensify]

Posted https://www.upwork.com/jobs/~012344f1febdbac925

[Phantom-2]

Proposal

in src/styles/styles.js

        code: {
            ...baseCodeTagStyles,
            ...codeStyles.codeTextStyle,
            paddingLeft: 5,
            paddingRight: 5,
            fontFamily: fontFamily.MONOSPACE,
            fontSize: 13,
+           paddingTop:1,

        },

        img: {
            borderColor: themeColors.border,
            borderRadius: variables.componentBorderRadiusNormal,
            borderWidth: 1,
        },

[mallenexpensify]

@Phantom-2 , apologies for the delay, @Santhosh-Sellavel can you please review the proposal above?

[Santhosh-Sellavel]

Sorry I didn’t leave a comment earlier. This would make some unintended style break in other platforms.

[Santhosh-Sellavel]

Also, I tried to reproduce this on my end today, it's not occurring for me.

Can you check on the latest staging or production build, is the issue still occurring for you? @AndrewGable

If reproducible, share me device modal & iOS version, thanks!

cc: @mallenexpensify @stitesExpensify

[AndrewGable]

@mvtglobally - Can you have some testers try to reproduce? If if it's not reproducible, agree let's close.

[stitesExpensify]

@mvtglobally was this reproducible?

[Santhosh-Sellavel]

@mvtglobally Any update on this?

[mallenexpensify]

Pinged @mvtglobally in NewDot to take a look

[mvtglobally]

checking, Sorry for the delay. for some reason I missed this one.

[mvtglobally]

Looks like I was unsubscribed from this issue alerts. I did not mean this. Trying this right now, I am not able to use back-ticks on the multiline or paragraphs. If you use straight text, it is looking aligned

[AndrewGable]

Can you test on iOS?

[mvtglobally]

@AndrewGable Same on iOS. Are you able to repro?

[AndrewGable]

Yes, what version are you on?

bug	version

[mvtglobally]

Very interesting @AndrewGable. Can you give me exact text copy you are using to try maybe? I am on IOS 15.4 / iPhone 12 Pro https://user-images.githubusercontent.com/43995119/164292982-aff1392b-c20d-4fbd-b375-9edc3aa36190.MOV

[AndrewGable]

I am on iPhone 13 Pro 15.4.1 - Using the same copy it's still misaligned

[mvtglobally]

Asking team to try different devices/OS if anyone can repro. Your above screenshot looks much more aligned comparing to the earlier one

[Santhosh-Sellavel]

@AndrewGable @mvtglobally I was able to reproduce this one finally. While changing system font size the issue occurs

Check the video in the thread here

[AndrewGable]

Ohhh yes - I do have a smaller font size set on my iOS device.

[Santhosh-Sellavel]

@AndrewGable This could break a lot of other UI in the app. Ex:

[Santhosh-Sellavel]

Should look for any related issues, combine them, and handle them. Or maybe we can perform an audit to find issues in these cases.

@AndrewGable

[AndrewGable]

I think we should bring this up in the open source room and decide if it's something we want to full tackle or not.

[Santhosh-Sellavel]

Started a thread here

[AndrewGable]

Thank you very much @Santhosh-Sellavel!

[stitesExpensify]

@Santhosh-Sellavel any update here?

[Santhosh-Sellavel]

Can you put this on hold, this related to #7541

[mallenexpensify]

Put on hold, added Planning label and removed Help Wanted label. @stitesExpensify , chime in if you disagree

[Santhosh-Sellavel]

Not overdue, on hold.

[mallenexpensify]

Bumped to Monthly since on hold

[stitesExpensify]

On hold, not overdue

[stitesExpensify]

hold

[stitesExpensify]

Still on hold. Posted here for an update

[Santhosh-Sellavel]

On hold.

[mallenexpensify]

Added #7541 to hold in title, checked on it too, PR hasn't been updated for it in two weeks https://github.com/Expensify/App/issues/7541

[melvin-bot[bot]]

Triggered auto assignment to @sonialiap (Bug), see https://stackoverflow.com/c/expensify/questions/14418 for more details.

[mallenexpensify]

@sonialiap Reassigning as I'm heading OOO for a month

[stitesExpensify]

Moved this back to monthly

[sonialiap]

on hold

[Santhosh-Sellavel]

This one can come off hold as #7541 is closed now. The issue is still reproducible, let's open this for proposals.

[stitesExpensify]

Off hold!

[trjExpensify]

Let’s make sure to update labels when we take issues off hold. Minimally, we should remove planning and re-add Daily and Help wanted

[MelvinBot]

⚠️ Could not update price automatically because there is no linked Upwork Job ID. The BZ team member will need to update the price manually in Upwork.

[mountiny]

Context here

[fabioh8010]

Hi, I'm Fábio from Callstack and I would like to work in this issue.

[MelvinBot]

📣 @fabioh8010 You have been assigned to this job by @mountiny! Please apply to this job in Upwork and leave a comment on the Github issue letting us know when we can expect a PR to be ready for review 🧑‍💻 Keep in mind: Code of Conduct | Contributing 📖

[sonialiap]

The original Upwork post got closed, here's the new one https://www.upwork.com/jobs/~01be27e71047382c31