🐞 Bug: [ UI issue: Project name in navbar is cut off, affecting visibility of certain characters ]

[Darshan808]

Is there an existing issue for this?

• I have searched the existing issues.

Describe the bug

There is a UI issue on the navigation bar of simulator where the project name is not fully visible. The bottom part of the text, especially symbols like _, gets hidden. This also affects the visibility of letters like 'i' and 'j', which appear very similar due to the lower portion being obscured. This results in a poor user experience as it can lead to confusion and difficulty in reading the project name accurately.

Steps to Reproduce

1. Open the simulator page.
2. Observe the project name displayed at the center of the navbar.
3. Edit project name to something like 'my_project'
4. Observe that the bottom-most characters gets hidden

Expected Behavior

The project name should be fully visible with all characters displayed clearly, including any underscores, descenders on letters like 'g', 'j', 'q', 'p', and 'y', ensuring they are distinguishable from one another.

Screenshots

Is the faced issue/bug related to the Vue simulator?

Yes

Used Vue simulator with or without backend?

Without Backend

Is the bug present only on the dev server, the build, or both?

Both

Device Information

No response

Additional Context

No response

Are you working on this issue?

Yes