[Bug] 移动端分享截图错位

[WuSWu]

📦 Environment

Docker

📌 Version

1.48.2

💻 Operating System

Ubuntu

🌐 Browser

Other, Chrome

🐛 Bug Description

在移动端，使用分享截图功能，预览界面显示正常，但是下载后的截图会出现右侧大量空白，如图所示：

预览界面

下载后的截图

另外还有一个不是很严重的小问题，模型名称过长会导致会话名称无法显示，希望能够优化。

📷 Recurrence Steps

No response

🚦 Expected Behavior

No response

📝 Additional Information

No response

[lobehubbot]

👀 @WuSWu

Thank you for raising an issue. We will investigate into the matter and get back to you as soon as possible.
Please make sure you have given us as much context as possible.
非常感谢您提交 issue。我们会尽快调查此事，并尽快回复您。 请确保您已经提供了尽可能多的背景信息。

[dosubot]

@WuSWu 你好! 我是一个可以帮助您解决 bug、回答问题并成为贡献者的机器人。我将在等待人类维护者的过程中为您提供帮助。😊

The issue you're experiencing with the screenshot feature on mobile devices, where the downloaded image shows a large blank space on the right side, might be related to the CSS styling and responsive design settings. The preview class has a responsive rule for mobile devices that sets max-height: 40dvh, and the overflow: hidden scroll property might be affecting the layout ^[1][2]. Additionally, the screenshot area is defined with a specific width of 720 pixels for mobile devices, which could contribute to the issue ^[3][4].

For the issue with long model names causing conversation names to be cut off, it seems there might not be a specific handling mechanism in place for this scenario in the current codebase. Adjustments might be needed in the layout or styling to accommodate longer text.

To address these issues, you might consider reviewing and adjusting the CSS rules related to the screenshot feature and exploring ways to handle text overflow for long model names in the chat interface.

To continue talking to Dosu, mention @dosu.

---

^{Help Dosu learn! Give it feedback: Great Response | Irrelevant Answer | Incorrect Sources | Too Verbose | Hallucination | Other}