immich-app/immich

Focus outlines are broken/inconsistent

Open

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

在 GitHub 查看
 (6 评论) (0 反应) (0 负责人)TypeScript (100,600 star) (5,601 fork)batch import
good first issue🖥️web

描述

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

贡献者指南

技术栈
typescriptreactcss
领域
frontendaccessibility
议题类型
bug
难度面向新贡献者的预计实现难度，1 表示很小改动，5 表示专家级工作。
2
预计时间有经验贡献者完成调查、实现、测试并准备 pull request 的粗略时间范围。
1-3 hours
活动状态议题当前的可参与程度：新鲜、活跃、陈旧、阻塞或等待维护者输入。
fresh
清晰度议题是否清楚说明期望改动、验收标准和下一步。
clear
前置要求
Basic CSS knowledgeFamiliarity with browser DevTools
新手友好度1-100 的估计分数，表示该议题对首次贡献者的友好程度。
80
研究方向
Investigate the web admin page's focus styles. Inspect elements using Chrome DevTools to identify the CSS rules causing broken outlines. Look for missing or overridden `outline` properties, especially on buttons and menu items. Check if Tailwind CSS or custom styles are used and if `focus visible` pseudo class is applied. Consider cross browser compatibility for Chrome 137 and other browsers. A potential fix involves adding explicit focus styles (e.g., `outline: 2px solid currentColor; outline offset: 2px;`) to interactive elements.
Focus outlines are broken/inconsistent · immich-app/immich#19498 | Good First Issue