fix: 宽屏下的样式重叠

[Alexzjt]

No description provided.

[gemini-code-assist]

Summary of Changes

Hello @Alexzjt, I'm Gemini Code Assist¹! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed!

此拉取请求旨在解决在宽屏显示器上出现的样式重叠问题。通过调整 Banner 组件中 listContainer 的布局和宽度计算方式，确保内容在不同屏幕尺寸下都能正确显示，尤其是在超宽屏环境下，避免了元素之间的不当堆叠，提升了用户体验。

Highlights

• 布局调整: 移除了 div.listContainer 的绝对定位 (position: absolute, left, right)，并改用 margin-right: auto 和 margin-left: auto 实现水平居中。
• 宽度优化: 将容器宽度从基于视口计算 (calc(100vw - 224px)) 调整为 80vw，使其更具弹性。
• 超宽屏适配: 新增了一个媒体查询 (@media (min-width: 2700px))，在屏幕宽度超过 2700px 时，将 listContainer 的最大宽度限制为 2100px，以防止在超宽屏下内容过度拉伸或重叠。

Using Gemini Code Assist

The full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips.

Invoking Gemini

You can request assistance from Gemini at any point by creating a comment using either /gemini <command> or @gemini-code-assist <command>. Below is a summary of the supported commands on the current page.

Feature	Command	Description
Code Review	/gemini review	Performs a code review for the current pull request in its current state.
Pull Request Summary	/gemini summary	Provides a summary of the current pull request in its current state.
Comment	@gemini-code-assist	Responds in comments when explicitly tagged, both in pull request comments and review comments.
Help	/gemini help	Displays a list of available commands.

Customization

To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a .gemini/ folder in the base of the repository. Detailed instructions can be found here.

Limitations & Feedback

Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for Github and other Google products, sign up here.

You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension.

Footnotes

1. Review the Privacy Notices, Generative AI Prohibited Use Policy, Terms of Service, and learn how to configure Gemini Code Assist in GitHub here. Gemini can make mistakes, so double check it and use code with caution. ↩

[gemini-code-assist]

Code Review

您好，感谢您提交的修复。将 div.listContainer 的布局从绝对定位改为使用 margin: auto 进行居中，这是一个很好的改进，使代码更健壮、更易于维护。针对宽屏的适配，我有一个小建议，可以通过使用 max-width 属性来替代媒体查询，使样式代码更简洁。具体请参考我添加的评论。