mattermost-community/focalboard

Bug: Assignee field text on card not visible in dark theme

Open

#4,621 建立於 2023年3月8日

在 GitHub 查看
 (1 留言) (0 反應) (0 負責人)TypeScript (26,187 star) (2,542 fork)user submission
BugHelp WantedUp for grabs

描述

Steps to reproduce the behavior

  1. Set the theme to dark theme (not an issue in light/default theme)
  2. Open a board where cards use the Assignee field
  3. Select/create a card and note the text in the Assignee field matches the background color

Expected behavior

In the dark theme, most text should inherit its color using the CSS variable --center-channel-color-rgb: 220, 220, 220;. However, this does not seem to be the case for the Assignee field. In my testing, the text in this field is visible in lighter themes. It appears as if the RGB value of 51,51,51 is hardcoded in the styling for that item rather than using the theme variable.

I tried hard reloading with a clean cache, new browsers, and incognito windows, and the issue persisted.

Screenshots (optional)

Original

image image image image

Modified Using Developer Tools

image image

Default Theme

image image

Light Theme

image image

Edition and Platform

  • Edition: Focalboard Server (Debian)
  • Version: 7.8.2
  • Browser and OS: Chome, Windows 10

Additional context (optional)

Add any other context about the problem here, and any notes about the severity:

  • Sev 3: Affects minor, non-critical functionality

Text still "legible" if you hover over the field, workaround exists by using a light theme.

貢獻者指南

技術棧
reacttypescriptcss
領域
frontend
議題類型
bug
難度面向新貢獻者的預計實作難度，1 表示很小改動，5 表示專家級工作。
2
預計時間有經驗貢獻者完成調查、實作、測試並準備 pull request 的粗略時間範圍。
under 1 hour
活動狀態議題目前的可參與程度：新鮮、活躍、陳舊、阻塞或等待維護者輸入。
fresh
清晰度議題是否清楚說明預期改動、驗收標準和下一步。
clear
前置要求
understanding of CSS variablesFocalboard theming basics
新手友善度1-100 的估計分數，表示該議題對首次貢獻者的友善程度。
90
研究方向
The issue is that the Assignee field in card view uses a hardcoded color (#333) instead of the CSS variable center channel color rgb for dark theme. To fix, locate the Assignee field component (likely in webapp/src/components/cardDetail/ or similar) and replace the hardcoded color with the appropriate CSS variable. Ensure the fix respects theme changes. Refer to other components that correctly use the variable for guidance.