[PR #185] [MERGED] [FR] Dark Mode #4003

New issue

Closed

opened 2026-03-23 21:35:52 +00:00 by mirror · 0 comments

mirror commented

2026-03-23 21:35:52 +00:00

Owner

📋 Pull Request Information

Original PR: https://github.com/AppFlowy-IO/AppFlowy/pull/185
Author: @rileyhawk1417
Created: 12/20/2021
Status: ✅ Merged
Merged: 12/24/2021
Merged by: @MikeWallaceDev

Base: main ← Head: themes

📝 Commits (10+)

52c0431 Rewrote to change with light and dark mode 🔧
aaf3b1d Changed files to match theme switches
012c9f0 Fixed text color switch
2e0e31f Configured accent color for trash page
95dae93 Configured hover color for dark mode
d306fc4 Configured container colors for dark mode
86eceee Configured text to switch with themes
55a64fa Added values to change with theme
2a52709 Configured to work with theme colors
3322a06 Text not affected by theme

📊 Changes

14 files changed (+64 additions, -42 deletions)

View changed files

📝 frontend/app_flowy/lib/startup/tasks/application_widget.dart (+2 -1)
📝 frontend/app_flowy/lib/user/presentation/widgets/background.dart (+1 -1)
📝 frontend/app_flowy/lib/workspace/presentation/stack_page/doc/doc_stack_page.dart (+1 -1)
📝 frontend/app_flowy/lib/workspace/presentation/stack_page/doc/styles.dart (+2 -1)
📝 frontend/app_flowy/lib/workspace/presentation/stack_page/home_stack.dart (+1 -1)
📝 frontend/app_flowy/lib/workspace/presentation/stack_page/trash/widget/trash_header.dart (+1 -1)
📝 frontend/app_flowy/lib/workspace/presentation/widgets/edit_pannel/edit_pannel.dart (+5 -1)
📝 frontend/app_flowy/lib/workspace/presentation/widgets/menu/widget/app/header/add_button.dart (+4 -1)
📝 frontend/app_flowy/lib/workspace/presentation/widgets/menu/widget/app/header/header.dart (+4 -3)
📝 frontend/app_flowy/lib/workspace/presentation/widgets/pop_up_action.dart (+1 -1)
📝 frontend/app_flowy/packages/flowy_infra/lib/theme.dart (+32 -22)
📝 frontend/app_flowy/packages/flowy_infra_ui/lib/src/flowy_overlay/list_overlay.dart (+4 -1)
📝 frontend/app_flowy/packages/flowy_infra_ui/lib/style_widget/decoration.dart (+5 -5)
📝 frontend/app_flowy/packages/flowy_infra_ui/lib/style_widget/text.dart (+1 -2)

📄 Description

Whats been fixed

The following files were changed to work with light and dark mode.
Gray color has been used to be easy on the eyes for light mode.
Black color has been used for dark mode.

What hasn't been fixed

The color of the highlighted text can't be seen clearly, whether in light or dark mode.
App Flowy Icon in right side bar is a svg that will need to be edited, to work with light and dark mode.
Light Dark mode toggle switch has not been implemented.

_{🔄 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/185 **Author:** [@rileyhawk1417](https://github.com/rileyhawk1417) **Created:** 12/20/2021 **Status:** ✅ Merged **Merged:** 12/24/2021 **Merged by:** [@MikeWallaceDev](https://github.com/MikeWallaceDev) **Base:** `main` ← **Head:** `themes` --- ### 📝 Commits (10+) - [`52c0431`](https://github.com/AppFlowy-IO/AppFlowy/commit/52c04310bab65098236891b9ca9488a63da6598e) Rewrote to change with light and dark mode 🔧 - [`aaf3b1d`](https://github.com/AppFlowy-IO/AppFlowy/commit/aaf3b1dcbe0526ce42c852e38b754ebc3752569e) Changed files to match theme switches - [`012c9f0`](https://github.com/AppFlowy-IO/AppFlowy/commit/012c9f05c55248efcd5484ffba35572904c7bde8) Fixed text color switch - [`2e0e31f`](https://github.com/AppFlowy-IO/AppFlowy/commit/2e0e31f1a3e97f2b19e23515530fed649712b0e7) Configured accent color for trash page - [`95dae93`](https://github.com/AppFlowy-IO/AppFlowy/commit/95dae9335f3b9fce821d714d6439477d66171d0b) Configured hover color for dark mode - [`d306fc4`](https://github.com/AppFlowy-IO/AppFlowy/commit/d306fc4d95af57cac9ae5d41035dac10ec1f6bd8) Configured container colors for dark mode - [`86eceee`](https://github.com/AppFlowy-IO/AppFlowy/commit/86eceeee99c79a865bdda870d123dfa8822458e2) Configured text to switch with themes - [`55a64fa`](https://github.com/AppFlowy-IO/AppFlowy/commit/55a64fafe61d1dec2dcf2b66299b8c29235895d5) Added values to change with theme - [`2a52709`](https://github.com/AppFlowy-IO/AppFlowy/commit/2a5270931c64d120e2a34589178cbbfd69307638) Configured to work with theme colors - [`3322a06`](https://github.com/AppFlowy-IO/AppFlowy/commit/3322a06cda6ab3d3966fc98b50665191ad5cf31e) Text not affected by theme ### 📊 Changes **14 files changed** (+64 additions, -42 deletions) <details> <summary>View changed files</summary> 📝 `frontend/app_flowy/lib/startup/tasks/application_widget.dart` (+2 -1) 📝 `frontend/app_flowy/lib/user/presentation/widgets/background.dart` (+1 -1) 📝 `frontend/app_flowy/lib/workspace/presentation/stack_page/doc/doc_stack_page.dart` (+1 -1) 📝 `frontend/app_flowy/lib/workspace/presentation/stack_page/doc/styles.dart` (+2 -1) 📝 `frontend/app_flowy/lib/workspace/presentation/stack_page/home_stack.dart` (+1 -1) 📝 `frontend/app_flowy/lib/workspace/presentation/stack_page/trash/widget/trash_header.dart` (+1 -1) 📝 `frontend/app_flowy/lib/workspace/presentation/widgets/edit_pannel/edit_pannel.dart` (+5 -1) 📝 `frontend/app_flowy/lib/workspace/presentation/widgets/menu/widget/app/header/add_button.dart` (+4 -1) 📝 `frontend/app_flowy/lib/workspace/presentation/widgets/menu/widget/app/header/header.dart` (+4 -3) 📝 `frontend/app_flowy/lib/workspace/presentation/widgets/pop_up_action.dart` (+1 -1) 📝 `frontend/app_flowy/packages/flowy_infra/lib/theme.dart` (+32 -22) 📝 `frontend/app_flowy/packages/flowy_infra_ui/lib/src/flowy_overlay/list_overlay.dart` (+4 -1) 📝 `frontend/app_flowy/packages/flowy_infra_ui/lib/style_widget/decoration.dart` (+5 -5) 📝 `frontend/app_flowy/packages/flowy_infra_ui/lib/style_widget/text.dart` (+1 -2) </details> ### 📄 Description ## Whats been fixed - The following files were changed to work with light and dark mode. - Gray color has been used to be easy on the eyes for light mode. - Black color has been used for dark mode. ## What hasn't been fixed - The color of the highlighted text can't be seen clearly, whether in light or dark mode. - App Flowy Icon in right side bar is a svg that will need to be edited, to work with light and dark mode. - Light Dark mode toggle switch has not been implemented. --- <sub>🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.</sub>