🐛 The issue of the Navbar exceeding boundaries when accessing Tina.io on some mobile devices.

[ZenoWang1999]

🐛 Describe the Bug

See https://tina.io/
When accessing tina.io using an iPhone 12 Pro, a blank area appears on the right side.
The blank area is caused by the Navbar at the top exceeding the width of screen.

Figure 1: Blanck area appears on the right side

🧑‍💻 Reproduction Steps

1. Access tina.io on Chrome, right-click and select "Inspect," then click "Toggle device toolbar" and switch to iPhone 12 Pro. Alternatively, access it directly on a mobile device.
2. If the device being used has a relatively small width and height, you will notice a white margin on the right side of the screen.
3. You can use the Responsive mode in Chrome to test at which screen ratios the white margin appears.

🎯 Expected Behaviour

The webpage content should fully cover the entire screen, with no components partially displayed.

💼 Tasks

• Modify the code to ensure the white margin no longer appears.
• Test across multiple mobile screen ratios to verify that the issue is properly resolved.

✅ Acceptance Criteria

The white margin no longer appears on different mobile screen ratio.