[PR #2356] [MERGED] fix: fix icon hover color in dark mode #5203

New issue

Closed

opened 2026-03-23 22:17:42 +00:00 by mirror · 0 comments

mirror commented

2026-03-23 22:17:42 +00:00

Owner

📋 Pull Request Information

Original PR: https://github.com/AppFlowy-IO/AppFlowy/pull/2356
Author: @hyj1204
Created: 4/25/2023
Status: ✅ Merged
Merged: 4/27/2023
Merged by: @a-wallen

Base: main ← Head: issue-2298

📝 Commits (5)

3f064c3 fix: File and Trash icons brightness in dark mode.
7369f6d chore: update hover color in file location
cb8b708 feat: add foregroundColorOnHover in HoverStyle
c7194a3 feat: add iconColorOnHover in FlowyIconButton
d43a15c chore: update trash page UI

📊 Changes

6 files changed (+46 additions, -34 deletions)

View changed files

📝 frontend/appflowy_flutter/lib/plugins/trash/src/sizes.dart (+6 -2)
📝 frontend/appflowy_flutter/lib/plugins/trash/src/trash_cell.dart (+7 -13)
📝 frontend/appflowy_flutter/lib/plugins/trash/trash_page.dart (+2 -8)
📝 frontend/appflowy_flutter/lib/workspace/presentation/settings/widgets/settings_file_customize_location_view.dart (+8 -0)
📝 frontend/appflowy_flutter/packages/flowy_infra_ui/lib/style_widget/hover.dart (+9 -8)
📝 frontend/appflowy_flutter/packages/flowy_infra_ui/lib/style_widget/icon_button.dart (+14 -3)

📄 Description

This PR is to follow up PR #2345 and fix #2298.

Main Changes

I added a foregroundColorOnHover in the HoverStyle,so we can modify the icon and text color when it is hovered. Then I used it in FlowyIconButton to change the icon color when it is hovered.

Feature Preview

Update the hover effect in file location setting. I used the same hover style in setting(like theme and language)
Update the hover effect on trash page.

https://user-images.githubusercontent.com/14248245/234407831-6309f053-190b-4506-abdb-34377cdf9638.mov

PR Checklist

My code adheres to the AppFlowy Style Guide
I've listed at least one issue that this PR fixes in the description above.
I've added a test(s) to validate changes in this PR, or this PR only contains semantic changes.
All existing tests are passing.

_{🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.}

## 📋 Pull Request Information **Original PR:** https://github.com/AppFlowy-IO/AppFlowy/pull/2356 **Author:** [@hyj1204](https://github.com/hyj1204) **Created:** 4/25/2023 **Status:** ✅ Merged **Merged:** 4/27/2023 **Merged by:** [@a-wallen](https://github.com/a-wallen) **Base:** `main` ← **Head:** `issue-2298` --- ### 📝 Commits (5) - [`3f064c3`](https://github.com/AppFlowy-IO/AppFlowy/commit/3f064c390bdfcb3c43854836ab17b4987fb00c52) fix: File and Trash icons brightness in dark mode. - [`7369f6d`](https://github.com/AppFlowy-IO/AppFlowy/commit/7369f6dd4b91350370ae3f8af8fbc1b4a5199c26) chore: update hover color in file location - [`cb8b708`](https://github.com/AppFlowy-IO/AppFlowy/commit/cb8b708a731f1d608bea956cc667f9b6a37fd53c) feat: add foregroundColorOnHover in HoverStyle - [`c7194a3`](https://github.com/AppFlowy-IO/AppFlowy/commit/c7194a3ee4afe604f260a7df635e285e9aeec1b7) feat: add iconColorOnHover in FlowyIconButton - [`d43a15c`](https://github.com/AppFlowy-IO/AppFlowy/commit/d43a15c3aa1c6cf0afe6a09dd222ffdb52f74f32) chore: update trash page UI ### 📊 Changes **6 files changed** (+46 additions, -34 deletions) <details> <summary>View changed files</summary> 📝 `frontend/appflowy_flutter/lib/plugins/trash/src/sizes.dart` (+6 -2) 📝 `frontend/appflowy_flutter/lib/plugins/trash/src/trash_cell.dart` (+7 -13) 📝 `frontend/appflowy_flutter/lib/plugins/trash/trash_page.dart` (+2 -8) 📝 `frontend/appflowy_flutter/lib/workspace/presentation/settings/widgets/settings_file_customize_location_view.dart` (+8 -0) 📝 `frontend/appflowy_flutter/packages/flowy_infra_ui/lib/style_widget/hover.dart` (+9 -8) 📝 `frontend/appflowy_flutter/packages/flowy_infra_ui/lib/style_widget/icon_button.dart` (+14 -3) </details> ### 📄 Description This PR is to follow up PR #2345 and fix #2298. ### Main Changes I added a `foregroundColorOnHover` in the `HoverStyle`,so we can modify the icon and text color when it is hovered. Then I used it in `FlowyIconButton` to change the icon color when it is hovered. ![image](https://user-images.githubusercontent.com/14248245/234405795-880959e7-fde4-4515-8859-c207bd85f5e4.png) ### Feature Preview 1. Update the hover effect in file location setting. I used the same hover style in setting(like theme and language) 2. Update the hover effect on trash page. https://user-images.githubusercontent.com/14248245/234407831-6309f053-190b-4506-abdb-34377cdf9638.mov  ---  #### PR Checklist - [X] My code adheres to the [AppFlowy Style Guide](https://appflowy.gitbook.io/docs/essential-documentation/contribute-to-appflowy/software-contributions/submitting-code/style-guides) - [X] I've listed at least one issue that this PR fixes in the description above. - [X] I've added a test(s) to validate changes in this PR, or this PR only contains semantic changes. - [X] All existing tests are passing. --- <sub>🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.</sub>