[Bug]: Admin UI header search bar renders overlapping text and icons

问题场景

用户运行 LiteLLM v1.109.0 的 Admin UI，登录后进入 Home 页面（/ui），在浏览器宽度约 1440px（截图中窗口较宽）下查看顶栏 LiteLLM logo 旁边的搜索框，出现占位文字与图标互相叠加的渲染问题。Issue 作者判断该问题与配置无关，属于 Admin UI 首页的视觉 bug。

报错原文

[Bug]: Admin UI header search bar renders overlapping text and icons

the placeholder "Search or jump to..." is drawn over a second label (it reads like "AI Gateway" / "Search"), so the text is garbled.

Two icons, a grid icon and the magnifying-glass icon, also overlap at the left edge of the input.

Expected: one placeholder ("Search or jump to...") with one search icon, and nothing behind it.

原因分析

根据 Issue 评论，原因是 Admin UI 顶栏中同时存在搜索框与 workspace switcher，两者在同一位置层叠渲染，导致占位文字和图标重叠。该问题已通过 #50009 将 workspace switcher 移出顶栏的方式修复。Issue 正文未给出具体 CSS 或组件层面的根因，因此上述为评论区给出的修复结论。

环境排查

• 确认 LiteLLM 版本：v1.109.0 存在该问题，v1.110.0-rc.1 已确认修复。
• 确认部署方式是否为 Docker，以及镜像对应的 LiteLLM 版本。
• 确认访问的是 Admin UI 的 /ui 首页，而非其他自定义页面。
• 确认浏览器窗口宽度（Issue 中在约 1440px 及更宽窗口下复现），并检查其他宽度是否仍出现重叠。
• 清理浏览器缓存后重新加载页面，排除旧前端静态资源残留。

解决步骤

1. 查看当前运行的 LiteLLM 版本，确认是否为 v1.109.0。
2. 将 LiteLLM 升级到 v1.110.0-rc.1 或包含 #50009 修复的更高版本（该修复将 workspace switcher 移出顶栏）。
3. 使用 Docker 部署时，替换为对应新版本镜像并重新启动服务。
4. 重启后强制刷新浏览器页面（或清理缓存），再打开 Admin UI 的 /ui 首页。
5. 如果升级后仍出现重叠，属于新问题，建议在 Issue 中补充浏览器版本、窗口宽度和复现截图。

验证方法

登录 Admin UI 并进入 /ui 首页，在约 1440px 及更宽窗口下查看顶栏搜索框：应只显示一层占位文字 “Search or jump to…”，左侧只有一个搜索图标，不再出现网格图标或第二层标签文字与之重叠。同时可调整浏览器宽度，确认在其他视口下也无重叠。

参考来源

BerriAI/litellm #51177

AI 工具推荐

想把多个 AI 模型放在一个入口？

GamsGo AI 集成 ChatGPT、DeepSeek、Gemini、Claude、Midjourney、Veo 等常用模型，适合写作、绘图、视频和日常 AI 工作流。

了解 GamsGo AI

推广链接：通过此链接购买，我可能获得佣金，不影响你的价格。