immich-app/immich

Focus outlines are broken/inconsistent

开放

#19,498 创建于 2025年6月24日

在 GitHub 查看贡献者指南
 (6 条评论) (0 个反应) (0 位负责人)TypeScript (5,601 个派生)batch import
good first issue🖥️web

仓库指标

星标
 (100,600 个星标)
PR 合并指标
 (PR 指标待抓取)

描述

I have searched the existing issues, both open and closed, to make sure this is not a duplicate report.

  • Yes

The bug

There are some various rendering issues in the web view admin page, when using the TAB key to cycle through buttons/menu items.

Chrome 137

Image

Image

The OS that Immich Server is running on

Debian 12

Version of Immich Server

v1.135.3

Version of Immich Mobile App

v1.135.3

Platform with the issue

  • Server
  • Web
  • Mobile

Your docker-compose.yml content

N/A

Your .env content

N/A

Reproduction steps

N/A

Relevant log output

Additional information

No response

贡献者指南

研究方向
调查网页管理页面的焦点样式。使用 Chrome 开发者工具检查元素，识别导致轮廓线失效的 CSS 规则。查找缺失或被覆盖的 `outline` 属性，特别是在按钮和菜单项上。检查是否使用了 Tailwind CSS 或自定义样式，以及是否应用了 `focus visible` 伪类。考虑 Chrome 137 及其他浏览器的跨浏览器兼容性。一个潜在的修复方案是为交互元素添加显式的焦点样式（例如：`outline: 2px solid currentColor; outline offset: 2px;`）。
技术栈
css
领域
frontend
议题类型
缺陷
难度面向新贡献者的预计实现难度，1 表示很小改动，5 表示专家级工作。
2
预计时间有经验贡献者完成调查、实现、测试并准备 pull request 的粗略时间范围。
1-3 小时
活动状态议题当前的可参与程度：新鲜、活跃、陈旧、阻塞或等待维护者输入。
活跃
清晰度议题是否清楚说明期望改动、验收标准和下一步。
清晰
前置要求
HTMLCSS
新手友好度1-100 的估计分数，表示该议题对首次贡献者的友好程度。
70